@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Poppins:wght@500;600&display=swap");
:root{--blue:#0E6FFF;--teal:#00D1B2;--charcoal:#0D1321;--cloud:#F5F7FA;--cta:#FF6A00;--tap-gradient:linear-gradient(45deg,var(--blue),var(--teal));--radius-card:24px;--radius-btn:12px;--shadow-card:0 8px 24px rgba(13,19,33,0.12)}
body{font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--charcoal);background:var(--cloud)}
h1,h2,h3,.tap-heading{font-family:Poppins,Inter,sans-serif}
.hero{background:var(--tap-gradient);color:#fff;border-radius:24px;padding:3rem}
.btn-cta{background:var(--cta);color:#fff;border-radius:var(--radius-btn);font-weight:600;padding:.7rem 1.1rem}
.btn-ghost{border:2px solid var(--charcoal);color:var(--charcoal);border-radius:var(--radius-btn);font-weight:600;padding:.6rem 1rem;background:transparent}
.card.tap{border:0;border-radius:var(--radius-card);box-shadow:var(--shadow-card)}
.badge-soft{background:#E8F6F3;color:#0B8F7C;border-radius:999px;font-weight:600}
.footer{color:#fff;background:var(--charcoal);border-radius:24px;padding:2rem}
a{text-decoration:none}