body, html {
    font-family: 'Segoe UI', 'Inter', 'system-ui', sans-serif;
    color: #222;
    background: #f3f6fd !important;
}
.gradient-bg {
    background: linear-gradient(135deg, #3a7bd5 0%, #5f5aa2 60%, #c471f5 100%) !important;
}
.gradient-text {
    background: linear-gradient(135deg, #3a7bd5 0%, #5f5aa2 60%, #c471f5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.card-hover {
    transition: all 0.3s cubic-bezier(.4,0,.2,1);
}
.card-hover:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 20px 25px -5px rgba(90,110,200,0.14);
}
.smooth-scroll {
    scroll-behavior: smooth;
}
.btn-solid {
    background: #3a7bd5;
    color: #fff;
    border: none;
    font-weight: 600;
    border-radius: 0.75rem;
    transition: background 0.2s, color 0.2s;
}
.btn-solid:hover {
    background: #5f5aa2;
    color: #fff;
}
.card-solid {
    background: #fff;
    color: #222;
    border: 1px solid #e0e6f8;
    box-shadow: 0 8px 32px 0 rgba(60,60,100,0.08);
}
.section-solid {
    background: #f3f6fd;
    color: #222;
    border-radius: 1.5rem;
    border: 1px solid #e0e6f8;
}
/* Floating image animation */
.floating-img {
    animation: floatY 3s ease-in-out infinite;
}
@keyframes floatY {
    0% { transform: translateY(0); }
    50% { transform: translateY(-24px); }
    100% { transform: translateY(0); }
}
.kartika-blur-logo {
  filter: blur(2px) brightness(0.8);
  opacity: 0.18;
  animation: floatLogo 8s ease-in-out infinite alternate;
  pointer-events: none;
  user-select: none;
}
@keyframes floatLogo {
  0% { transform: translateY(0);}
  100% { transform: translateY(18px);}
}
.kartika-list-why:hover .kartika-check {
  background: #3a7bd5;
  color: #fff;
  transition: background 0.3s, color 0.3s;
}
.kartika-list-why:hover .kartika-why-text {
  color: #3a7bd5;
  transform: scale(1.04);
  transition: color 0.3s, transform 0.3s;
}
.card-solid:hover {
    transform: scale(1.10) translateY(-20px) rotate(-4deg);
    box-shadow: 0 32px 64px -8px rgba(58,123,213,0.22), 0 4px 16px 0 rgba(60,60,100,0.14);
    border-color: #3a7bd5;
    background: linear-gradient(120deg, #f3f6fd 60%, #e0e6f8 100%);
    transition: transform 0.4s cubic-bezier(.4,0,.2,1), box-shadow 0.4s cubic-bezier(.4,0,.2,1), border-color 0.3s, background 0.3s;
    z-index: 2;
} 