0
#0c0a09
1<form class="w-[206px] rounded-2xl bg-stone-900 p-3.5 text-stone-100 shadow-2xl shadow-black ring-1 ring-white/10">2 <p class="text-[14px] font-bold">Peça um orçamento</p>3 <p class="text-[10px] text-stone-400">Respondemos em até 1 dia útil.</p>4 <p class="mt-3 text-[9px] font-semibold uppercase tracking-widest text-stone-500">O que você precisa</p>5 <div class="mt-1.5 flex flex-wrap gap-1">6 <label class="cursor-pointer rounded-full border border-white/15 px-2.5 py-1 text-[10px] text-stone-300 transition hover:border-amber-400 has-[:checked]:border-amber-400 has-[:checked]:bg-amber-400 has-[:checked]:font-semibold has-[:checked]:text-stone-900"><input type="checkbox" class="sr-only" checked>Site</label>7 <label class="cursor-pointer rounded-full border border-white/15 px-2.5 py-1 text-[10px] text-stone-300 transition hover:border-amber-400 has-[:checked]:border-amber-400 has-[:checked]:bg-amber-400 has-[:checked]:font-semibold has-[:checked]:text-stone-900"><input type="checkbox" class="sr-only">Loja virtual</label>8 <label class="cursor-pointer rounded-full border border-white/15 px-2.5 py-1 text-[10px] text-stone-300 transition hover:border-amber-400 has-[:checked]:border-amber-400 has-[:checked]:bg-amber-400 has-[:checked]:font-semibold has-[:checked]:text-stone-900"><input type="checkbox" class="sr-only">Logo</label>9 <label class="cursor-pointer rounded-full border border-white/15 px-2.5 py-1 text-[10px] text-stone-300 transition hover:border-amber-400 has-[:checked]:border-amber-400 has-[:checked]:bg-amber-400 has-[:checked]:font-semibold has-[:checked]:text-stone-900"><input type="checkbox" class="sr-only">App</label>10 </div>11 <p class="mt-3 text-[9px] font-semibold uppercase tracking-widest text-stone-500">Verba</p>12 <div class="mt-1.5 grid grid-cols-3 overflow-hidden rounded-lg border border-white/15 text-center text-[10px]">13 <label class="cursor-pointer py-1.5 text-stone-400 transition has-[:checked]:bg-white/10 has-[:checked]:font-semibold has-[:checked]:text-amber-300"><input type="radio" name="verba" class="sr-only">até 5 mil</label>14 <label class="cursor-pointer border-x border-white/15 py-1.5 text-stone-400 transition has-[:checked]:bg-white/10 has-[:checked]:font-semibold has-[:checked]:text-amber-300"><input type="radio" name="verba" class="sr-only" checked>5 a 15 mil</label>15 <label class="cursor-pointer py-1.5 text-stone-400 transition has-[:checked]:bg-white/10 has-[:checked]:font-semibold has-[:checked]:text-amber-300"><input type="radio" name="verba" class="sr-only">15 mil +</label>16 </div>17 <input type="email" placeholder="seu@email.com" aria-label="E-mail" class="mt-3 w-full rounded-lg border border-white/15 bg-black/30 px-2.5 py-1.5 text-xs text-stone-100 outline-none placeholder:text-stone-500 focus:border-amber-400 focus:ring-2 focus:ring-amber-400/20">18 <button type="button" class="group/b mt-2 flex w-full items-center justify-center gap-1 rounded-lg bg-amber-400 py-2 text-xs font-bold text-stone-900 transition hover:bg-amber-300">19 Pedir orçamento <span class="transition group-hover/b:translate-x-1">→</span>20 </button>21</form>