* {
  box-sizing: border-box;
}

body {
  font-family: 'Nunito Sans', sans-serif;
  overflow-x: hidden;
}

.bg-grid {
  background-size: 60px 60px;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, 0.04) 1px, transparent 1px);
  mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
  -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
}

.dark .bg-grid {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
}

.glass-panel {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.dark .glass-panel {
  background: rgba(10, 10, 10, 0.88);
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Float animation */
.float-anim {
  animation: floatY 4s ease-in-out infinite;
}

@keyframes floatY {

  0%,
  100% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-12px)
  }
}


/* FAQ */
.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s cubic-bezier(.4, 0, .2, 1), padding .3s;
}

.faq-item.open .faq-answer {
  max-height: 300px;
  padding-bottom: 1.25rem;
}

.faq-icon {
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
}

.faq-item.open .faq-icon {
  transform: rotate(45deg);
}

/* Feat card hover */
.feat-card {
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.feat-card:hover {
  transform: translateY(-6px);
  border-color: #4ADE80 !important;
  box-shadow: 0 20px 40px rgba(74, 222, 128, 0.12);
}

/* Tag badge */
.tag-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 1px solid rgba(74, 222, 128, 0.3);
  color: #4ADE80;
  background: rgba(74, 222, 128, 0.07);
  margin-bottom: 16px;
}

/* Ticker */
.ticker-wrap {
  overflow: hidden;
  white-space: nowrap;
}

.ticker-inner {
  display: inline-block;
  animation: ticker 22s linear infinite;
}

@keyframes ticker {
  0% {
    transform: translateX(0)
  }

  100% {
    transform: translateX(-50%)
  }
}