/* Khusus Layout Pricing */
.pricing-section {
  padding: 80px 0;
  background-color: #f8fbff;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-top: 40px;
}

/* Card Style */
.pricing-card {
  background: #fff;
  border-radius: 15px;
  padding: 40px 25px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
  position: relative;
  border: 1px solid #eee;
}

.pricing-card:hover {
  transform: translateY(-10px);
}

/* Badge Most Popular & Best Choice */
.pricing-card .badge {
  position: absolute;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  background: #ff4444;
  color: #fff;
  padding: 6px 20px;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: bold;
  white-space: nowrap;
}

.best-badge {
  background: #28a745 !important;
}

/* Typography & List */
.pricing-card h3 { text-align: center; color: #003366; margin-bottom: 15px; }
.pricing-card .price { text-align: center; font-size: 2.2rem; font-weight: 800; color: #003366; }
.pricing-card ul { list-style: none; padding: 0; margin: 25px 0; }
.pricing-card li { margin-bottom: 12px; padding-left: 30px; position: relative; text-align: left; }

.pricing-card li::before { 
  content: "✓"; 
  position: absolute; 
  left: 0; 
  color: #28a745; 
  font-weight: bold; 
}

/* Tombol */
.choose-btn { 
  display: block; 
  text-align: center; 
  background: #ff4444; 
  color: #fff !important; 
  padding: 15px; 
  border-radius: 30px; 
  font-weight: bold; 
}