*{margin:0;padding:0;box-sizing:border-box;font-family:Segoe UI,Tahoma;}
body{background:#f4f6fb;color:#333;}
header{background:#0d6efd;color:#fff;padding:20px;text-align:center;}
.hero{text-align:center;padding:60px 20px;background:#fff;}
.btn{display:inline-block;padding:14px 30px;background:#0d6efd;color:#fff;text-decoration:none;border-radius:6px;}
.form-box{max-width:500px;margin:40px auto;background:#fff;padding:30px;border-radius:10px;box-shadow:0 10px 25px rgba(0,0,0,.08);}
.digital-card{max-width:380px;margin:40px auto;background:#fff;border-radius:15px;box-shadow:0 15px 30px rgba(0,0,0,.15);overflow:hidden;text-align:center;}
.digital-card .top{background:#0d6efd;color:#fff;padding:40px;}
.digital-card .details{padding:25px;}
.icon{width:18px;vertical-align:middle;margin-right:8px;}
/* --- Professional Animations & Effects --- */
.card {
  transition: transform .4s ease, box-shadow .4s ease;
}
.card:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 20px 40px rgba(0,0,0,.15);
}
.fade-in {
  animation: fadeInUp .8s ease forwards;
  opacity: 0;
}
@keyframes fadeInUp {
  from {opacity:0; transform: translateY(20px);}
  to {opacity:1; transform: translateY(0);}
}
.btn {
  position: relative;
  overflow: hidden;
}
.btn::after {
  content:'';
  position:absolute;
  inset:0;
  background:rgba(255,255,255,.2);
  opacity:0;
  transition:.3s;
}
.btn:hover::after {opacity:1;}
