@media (max-width: 768px) {
  /* Hero-osion korjaus */
  .hero-gradient {
    padding-top: 3rem;
    padding-bottom: 3rem;
    min-height: auto;
  }
  
  /* Teksti-kokojen optimointi */
  .hero-gradient h1 {
    font-size: 3rem !important;
  }
  
  .hero-gradient h1 span:first-child {
    font-size: 2.5rem !important;
  }
  
  .hero-gradient h1 span:last-child {
    font-size: 2.8rem !important;
  }
  
  .hero-gradient p {
    font-size: 1.125rem !important;
    margin-bottom: 2rem !important;
  }
  
  /* Grid-layoutin korjaus */
  .grid.lg\\:grid-cols-2 {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
  
  /* CTA-napit */
  .flex.flex-col.sm\\:flex-row.gap-6 {
    flex-direction: column !important;
    gap: 1rem !important;
  }
  
  .flex.flex-col.sm\\:flex-row.gap-6 a {
    padding: 1rem 1.5rem !important;
    font-size: 1rem !important;
  }
  
  /* Korttien optimointi */
  .card-hover {
    padding: 1.5rem !important;
  }
  
  .step-card {
    padding: 1.5rem !important;
  }
  
  .testimonial-card {
    padding: 1.5rem !important;
  }
  
  /* Vertailutaulukko */
  .comparison-table {
    font-size: 0.875rem;
    overflow-x: auto;
  }
  
  .grid.grid-cols-4 {
    display: block !important;
  }
  
  .grid.grid-cols-4 > div {
    display: flex;
    justify-content: space-between;
    padding: 0.75rem !important;
    border-bottom: 1px solid #e5e7eb;
  }
  
  .grid.grid-cols-4 > div:first-child > div:first-child {
    font-weight: bold;
    color: #1f2937;
  }
}

/* Yleiset mobiilikorjaukset */
@media (max-width: 640px) {
  .container {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  
  .py-24 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
  
  .py-16 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }
  
  /* Tekstien pienennnys */
  .text-5xl {
    font-size: 2.25rem !important;
  }
  
  .text-6xl {
    font-size: 2.5rem !important;
  }
  
  .text-7xl {
    font-size: 3rem !important;
  }
  
  .text-8xl {
    font-size: 3.5rem !important;
  }
}
  
    .hero-gradient {
      background: linear-gradient(135deg, #10b981 0%, #059669 25%, #047857 50%, #065f46 100%);
    }
    .feature-gradient {
      background: linear-gradient(145deg, #f0fdf4, #dcfce7);
    }
    .glass-effect {
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(20px);
      border: 1px solid rgba(255, 255, 255, 0.2);
    }
    .pulse-slow {
      animation: pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    }
    .float-animation {
      animation: float 6s ease-in-out infinite;
    }
    @keyframes float {
      0%, 100% { transform: translateY(0px) rotate(0deg); }
      33% { transform: translateY(-10px) rotate(1deg); }
      66% { transform: translateY(5px) rotate(-1deg); }
    }
    .card-hover {
      transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    }
    .card-hover:hover {
      transform: translateY(-12px) scale(1.03);
      box-shadow: 0 30px 60px rgba(16, 185, 129, 0.25);
    }
    .scroll-reveal {
      opacity: 0;
      transform: translateY(50px);
      transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .scroll-reveal.visible {
      opacity: 1;
      transform: translateY(0);
    }
    .gradient-text {
      background: linear-gradient(135deg, #10b981, #059669);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .stats-counter {
      font-variant-numeric: tabular-nums;
      font-feature-settings: 'tnum';
    }
    .feature-icon {
      background: linear-gradient(135deg, #10b981, #059669);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      filter: drop-shadow(0 4px 8px rgba(16, 185, 129, 0.3));
    }
    .step-card {
      background: linear-gradient(145deg, #ffffff, #f8fafc);
      border: 1px solid #e2e8f0;
      position: relative;
      overflow: hidden;
    }
    .step-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 4px;
      height: 100%;
      background: linear-gradient(135deg, #10b981, #059669);
    }
    .testimonial-card {
      background: linear-gradient(145deg, #ffffff, #f8fafc);
      border: 1px solid #e2e8f0;
      position: relative;
    }
    .testimonial-card::before {
      content: '"';
      position: absolute;
      top: -10px;
      left: 20px;
      font-size: 60px;
      color: #10b981;
      font-family: serif;
    }
    .tech-badge {
      background: linear-gradient(135deg, #10b981, #059669);
      color: white;
      padding: 6px 16px;
      border-radius: 20px;
      font-size: 14px;
      font-weight: 600;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }
    .comparison-table {
      background: linear-gradient(145deg, #ffffff, #f8fafc);
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    }
    .highlight-row {
      background: linear-gradient(90deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.05));
    }