* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Segoe UI", Arial, sans-serif;
  background: #050f22;
  color: #ffffff;
}

/* HERO */
.hero {
  position: relative;
  padding: 20px 20px 110px;
  background: radial-gradient(circle at top, #0c2e66, #050f22 75%);
  overflow: hidden;
}

.hero-bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.25), rgba(0,0,0,.85));
}

.hero-container {
  position: relative;
  max-width: 1100px;
  margin: auto;
  text-align: center;
}

/* LOGO */
.logo {
  max-width: 360px;
  margin-bottom: 28px;
  filter: drop-shadow(0 0 18px rgba(120,180,255,.4));
}

/* INAUGURAÇÃO */
.launch-bar {
  max-width: 920px;
  margin: 0 auto 42px;
  padding: 30px 36px;
  border-radius: 20px;
  background: rgba(12,34,72,.95);
  border: 1px solid rgba(140,190,255,.35);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.glow-soft {
  animation: glowSoft 4s infinite;
}

@keyframes glowSoft {
  0% { box-shadow: 0 0 10px rgba(120,180,255,.25); }
  50% { box-shadow: 0 0 26px rgba(120,180,255,.45); }
  100% { box-shadow: 0 0 10px rgba(120,180,255,.25); }
}

.launch-label {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 3px;
  color: #b6d9ff;
}

.pulse-text {
  animation: pulseText 3s infinite;
}

@keyframes pulseText {
  0% { opacity: .75; }
  50% { opacity: 1; }
  100% { opacity: .75; }
}

.launch-date {
  display: block;
  font-size: 34px;
  font-weight: 900;
  margin-top: 6px;
}

/* CONTADOR */
.launch-countdown {
  display: flex;
  gap: 20px;
}

.count-box {
  text-align: center;
  min-width: 70px;
}

.count-box strong {
  font-size: 26px;
}

.count-box span {
  font-size: 12px;
  color: #bcd2ff;
}

/* TITULO */
.title-animated {
  font-size: 52px;
  margin-bottom: 18px;
  animation: titleFloat 6s ease-in-out infinite;
  text-shadow:
    0 0 10px rgba(100,160,255,.35),
    0 0 25px rgba(60,120,255,.4);
}

@keyframes titleFloat {
  0% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
  100% { transform: translateY(0); }
}

/* DESCRIÇÃO */
.hero-desc {
  font-size: 19px;
  color: #dbe7ff;
  margin-bottom: 34px;
}

/* FEATURES */
.hero-features {
  max-width: 960px;
  margin: 0 auto 36px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
  gap: 14px;
}

.feature-box {
  background: rgba(255,255,255,.07);
  padding: 16px 18px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  font-weight: 600;
  transition: transform .3s ease, background .3s ease;
}

.feature-box i {
  color: #8fc3ff;
}

.feature-box:hover {
  background: rgba(255,255,255,.14);
  transform: translateY(-6px);
}

/* FLOAT EFFECT */
.float {
  animation: floatBox 5s ease-in-out infinite;
}

.delay1 { animation-delay: 1s; }
.delay2 { animation-delay: 2s; }
.delay3 { animation-delay: 3s; }

@keyframes floatBox {
  0% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}

/* BOTÃO */
.btn-main {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(180deg, #25d366, #1da851);
  padding: 18px 42px;
  border-radius: 16px;
  font-size: 17px;
  font-weight: 900;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 18px 45px rgba(37,211,102,.6);
}

.pulse-btn {
  animation: pulseBtn 2.5s infinite;
}

@keyframes pulseBtn {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

/* CTA NOTE */
.cta-note {
  margin-top: 14px;
  font-size: 14px;
  color: #bcd2ff;
}

/* INFO */
.info {
  padding: 80px 20px;
  background: #07142d;
}

.info-wrapper {
  max-width: 920px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 26px;
}

.info-card {
  background: rgba(255,255,255,.05);
  padding: 30px;
  border-radius: 18px;
}

.hover-glow:hover {
  box-shadow: 0 0 22px rgba(120,180,255,.4);
}

/* CONVERSÃO */
.conversion {
  padding: 90px 20px;
  text-align: center;
  background: radial-gradient(circle at center, #0c2e66, #050f22);
}

.conversion h2 {
  font-size: 36px;
  margin-bottom: 26px;
}

.conversion p {
  font-size: 18px;
  max-width: 880px;
  margin: 0 auto 20px;
  color: #dbe6ff;
}

.conversion-highlight {
  font-size: 21px;
  font-weight: 900;
  text-shadow: 0 0 14px rgba(120,180,255,.45);
}

/* FOOTER */
.footer {
  background: #050f22;
  padding: 22px;
  text-align: center;
  font-size: 13px;
  color: #9fb4ff;
}

/* MOBILE */
@media (max-width: 800px) {
  .launch-bar {
    flex-direction: column;
    gap: 22px;
    text-align: center;
  }

  .info-wrapper {
    grid-template-columns: 1fr;
  }

  .title-animated {
    font-size: 34px;
  }
}