  :root {
      --primary-color: #744aa1;
      --secondary-color: #2db3d6;
    }
    body { font-family: 'Segoe UI', sans-serif; }
    .hero { background: linear-gradient(90deg, var(--primary-color), var(--secondary-color)); color: #fff; padding: 100px 0; text-align: center; }
    .hero h1 { font-size: 2.5rem; font-weight: bold; }
    .hero p { font-size: 1.2rem; margin-bottom: 30px; }
    .btn-primary { background-color: var(--primary-color); border: none; }
    .btn-secondary { background-color: var(--secondary-color); border: none; }
    .section-title { font-weight: bold; margin-bottom: 40px; text-align: center; color: var(--primary-color); }
    .service-card { border: none; text-align: center; transition: transform 0.3s; }
    .service-card:hover { transform: translateY(-5px); }
    .testimonial { background-color: #f8f9fa; padding: 30px; border-radius: 10px; margin-bottom: 20px; }
    footer { background-color: #f1f1f1; padding: 40px 0; text-align: center; }
 