@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');
:root{
  --brand-primary:#2563eb; /* blue-600 */
  --brand-accent:#06b6d4;
  --bg-gradient: linear-gradient(135deg,#0ea5e9 0%, #60a5fa 100%);
  --card-bg: rgba(255,255,255,0.9);
}
html,body{font-family: 'Inter',system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;}
.hero-cta{background:var(--bg-gradient); color:white;}
.hero-cta .subtitle{color:rgba(255,255,255,0.92)}
.button.is-primary{background:var(--brand-primary); border-color:transparent; color:white}
.card{border-radius:12px}
.metric-badge{background:white;border-radius:10px;padding:12px 16px;box-shadow:0 6px 20px rgba(16,24,40,0.08);}
.floating-card{transform:translateY(-20px);}
.animate-float{animation: float 6s ease-in-out infinite}
@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-8px)}100%{transform:translateY(0)}}
.footer{background:#0f172a;color:#cbd5e1;padding:40px 0}
.container{max-width:1100px;margin:0 auto;padding:0 24px}

/* Form tweaks */
.field .control .input, .field .control .textarea{border-radius:8px}

/* Responsive tweaks */
@media (max-width:768px){
  .hero-cta{padding:3rem 1.5rem}
}