/* Extra polish over Tailwind */
:root{
  --ring: rgba(255,255,255,0.22);
}

.hero-glow{
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(99,102,241,0.30), transparent 60%),
    radial-gradient(1000px 500px at 85% 30%, rgba(34,197,94,0.20), transparent 60%),
    radial-gradient(900px 500px at 50% 95%, rgba(14,165,233,0.18), transparent 60%);
  filter: blur(0px);
}

.card{
  border-radius: 1.25rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.08);
  box-shadow: 0 18px 70px rgba(0,0,0,0.30);
}

.card-soft{
  border-radius: 1rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.09);
}

.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .70rem 1rem;
  border-radius: .95rem;
  font-weight: 600;
  font-size: .95rem;
  border: 1px solid rgba(255,255,255,0.18);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  user-select: none;
}
.btn:active{ transform: translateY(1px); }

.btn-primary{
  background: linear-gradient(135deg, rgba(99,102,241,0.95), rgba(16,185,129,0.90));
  border-color: rgba(255,255,255,0.18);
}
.btn-primary:hover{ filter: brightness(1.05); }

.btn-ghost{
  background: rgba(255,255,255,0.08);
}
.btn-ghost:hover{ background: rgba(255,255,255,0.18); }

.badge{
  font-size: .75rem;
  color: rgba(255,255,255,0.75);
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.09);
  padding: .25rem .5rem;
  border-radius: .7rem;
}

.contact-row{
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: .85rem;
  border-radius: 1rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.10);
  transition: background .12s ease, transform .12s ease;
}
.contact-row:hover{ background: rgba(255,255,255,0.07); }
.contact-row:active{ transform: translateY(1px); }
.contact-row .label{ font-size: .75rem; color: rgba(255,255,255,0.60); }
.contact-row .value{ font-size: .95rem; color: rgba(255,255,255,0.86); }
.contact-row .chev{ color: rgba(255,255,255,0.55); font-size: 1.2rem; }

.field{
  width: 100%;
  border-radius: .9rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.09);
  padding: .7rem .85rem;
  outline: none;
  color: rgba(255,255,255,0.92);
}
.field::placeholder{ color: rgba(255,255,255,0.45); }
.field:focus{
  border-color: rgba(255,255,255,0.22);
  box-shadow: 0 0 0 3px rgba(99,102,241,0.25);
}

.stat{
  border-radius: 1.1rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.10);
  padding: .9rem;
}
.stat-kicker{ font-size: .75rem; color: rgba(255,255,255,0.60); }
.stat-value{ font-size: 1.05rem; font-weight: 700; margin-top: .25rem; }
.stat-sub{ font-size: .75rem; color: rgba(255,255,255,0.55); margin-top: .15rem; }

.dot{
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(99,102,241,0.95), rgba(16,185,129,0.90));
  box-shadow: 0 0 0 3px rgba(255,255,255,0.06);
}

.pill{
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.10);
  padding: .8rem 1rem;
  text-align: center;
  color: rgba(255,255,255,0.85);
  font-weight: 600;
  font-size: .95rem;
}

.mini{
  border-radius: 1rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.10);
  padding: .9rem;
}
.mini-k{ font-size: .75rem; color: rgba(255,255,255,0.60); }
.mini-v{ font-size: .95rem; color: rgba(255,255,255,0.85); margin-top: .25rem; }

.icon{
  width: 18px;
  height: 18px;
  display: inline-block;
  flex: 0 0 18px;
  filter: drop-shadow(0 6px 12px rgba(0,0,0,0.30));
}
.icon-lg{ width: 20px; height: 20px; flex-basis: 20px; }

.wa-float{
  position: fixed;
  right: 18px;
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .80rem 1rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(16,185,129,0.22);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 70px rgba(0,0,0,0.35);
  font-weight: 700;
}
.wa-float:hover{ background: rgba(16,185,129,0.28); }