/* Fade-in */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Fade-up stronger */
@keyframes fadeUp {
  0%   { opacity: 0; transform: translateY(40px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Smooth scaling intro */
@keyframes scaleFade {
  0%   { opacity: 0; transform: scale(0.96); }
  100% { opacity: 1; transform: scale(1); }
}

.fade-up   { animation: fadeUp 0.8s ease forwards; }
.fade-in   { animation: fadeIn 0.7s ease forwards; }
.fade-slow { animation: fadeIn 1.2s ease forwards; }
.scale-fade{ animation: scaleFade 0.9s ease forwards; }

.glow {
  text-shadow: 
    0 0 6px rgba(132, 255, 201, 0.35),
    0 0 12px rgba(161, 98, 255, 0.25);
}

.glow-strong {
  text-shadow:
    0 0 10px rgba(132, 255, 201, 0.45),
    0 0 18px rgba(161, 98, 255, 0.30);
}

.track-tight  { letter-spacing: -0.2px; }
.track-normal { letter-spacing: 0.0px; }
.track-wide   { letter-spacing: 0.4px; }
.track-wider  { letter-spacing: 0.6px; }

/* HERO TITLES */
#hero_title_main,
#hero_title_highlight {
  font-size: 64px !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.2px;
  margin-bottom: 6px;
}

#hero_title_main.glow,
#hero_title_highlight.glow {
  text-shadow:
    0 0 12px rgba(133, 255, 201, 0.40),
    0 0 22px rgba(163, 108, 255, 0.30);
}

/* SUBTITLE */
#hero_subtitle {
  font-size: 27px !important;
  opacity: 0.92;
  line-height: 1.35;
  letter-spacing: 0.3px;
}

/* BUTTONS */
.hero-buttons a {
  font-size: 22px !important;
  padding: 17px 38px !important;
  border-radius: 16px !important;
  letter-spacing: 0.3px;
}

/* SECTION TITLES */
.section-title {
  font-size: 46px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.1px;
  margin-bottom: 28px !important;
}

.section-title.glow-strong {
  text-shadow:
    0 0 14px rgba(120, 255, 200, 0.40),
    0 0 26px rgba(152, 104, 255, 0.32);
}

.section-subtext {
  font-size: 23px !important;
  line-height: 1.45 !important;
  opacity: 0.88;
  letter-spacing: 0.4px;
}

/* CARDS */
.how-card h3,
.numbers-card .numbers-label,
.tok-card .tok-label {
  font-size: 27px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px;
}

.how-card p,
.numbers-card .numbers-helper,
.tok-card .tok-helper {
  font-size: 20px !important;
  line-height: 1.55 !important;
  letter-spacing: 0.25px;
}

/* BIG NUMBERS */
.numbers-card .numbers-value {
  font-size: 44px !important;
  font-weight: 700 !important;
  letter-spacing: -0.3px;
}

/* TOKENOMICS VALUES */
.tok-card .tok-value {
  font-size: 38px !important;
  font-weight: 700 !important;
  letter-spacing: -0.2px;
}

/* FAQ */
.faq-q {
  font-size: 28px !important;
  letter-spacing: -0.1px;
}

.faq-q.glow {
  text-shadow: 0 0 10px rgba(140,255,215,0.25);
}

.faq-a {
  font-size: 20px !important;
  line-height: 1.55 !important;
  opacity: 0.85;
  letter-spacing: 0.3px;
}

/* CTA */
#cta_title {
  font-size: 48px !important;
  line-height: 1.18 !important;
  letter-spacing: -0.2px;
}

#cta_text {
  font-size: 24px !important;
  opacity: 0.9;
  letter-spacing: 0.3px;
}

#cta_btn {
  font-size: 22px !important;
  padding: 16px 36px !important;
  border-radius: 16px;
  letter-spacing: 0.3px;
}

/* FOOTER */
.footer-link {
  font-size: 20px !important;
  opacity: 0.8;
}

@media (max-width: 768px) {

  #hero_title_main,
  #hero_title_highlight {
    font-size: 42px !important;
    line-height: 1.15;
  }

  #hero_subtitle {
    font-size: 19px !important;
  }

  .section-title {
    font-size: 32px !important;
  }

  .section-subtext {
    font-size: 18px !important;
  }

  .numbers-card .numbers-value {
    font-size: 32px !important;
  }

  .tok-card .tok-value {
    font-size: 30px !important;
  }

  .faq-q {
    font-size: 22px !important;
  }

  #cta_title {
    font-size: 34px !important;
  }

  #cta_text {
    font-size: 18px !important;
  }
}
