.qurban-history-section { padding: 80px 24px; background: linear-gradient(135deg, #fef9f0 0%, #fff7ed 100%); }
.qurban-history-inner { max-width: 1200px; margin: 0 auto; }
.section-subtitle { text-align: center; color: #888; font-size: 0.95rem; margin-top: 8px; }
.qurban-history-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-top: 40px; }
.qurban-card {
  background: #fff; border-radius: 16px; padding: 20px; display: flex; align-items: center; gap: 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06); transition: transform 0.3s, box-shadow 0.3s; position: relative; overflow: hidden;
}
.qurban-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(232,101,10,0.12); }
.qurban-card-icon { width: 48px; height: 48px; border-radius: 12px; background: linear-gradient(135deg, #E8650A, #f59e0b); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qurban-card-icon i { color: #fff; font-size: 1.2rem; }
.qurban-card-body { flex: 1; min-width: 0; }
.qurban-name { font-size: 0.95rem; font-weight: 600; color: #1a1a1a; margin: 0 0 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qurban-paket { font-size: 0.82rem; color: #E8650A; font-weight: 500; display: block; }
.qurban-year { font-size: 0.78rem; color: #999; margin-top: 2px; display: block; }
.qurban-year i { margin-right: 4px; }
.qurban-badge { position: absolute; top: 12px; right: 12px; background: #ecfdf5; color: #059669; padding: 4px 10px; border-radius: 20px; font-size: 0.72rem; font-weight: 600; display: flex; align-items: center; gap: 4px; }
.qurban-badge i { font-size: 0.7rem; }
.qurban-cta-row { text-align: center; margin-top: 40px; }
.btn-qurban-cta {
  display: inline-flex; align-items: center; gap: 8px; padding: 14px 36px; border-radius: 50px;
  background: linear-gradient(135deg, #E8650A, #f59e0b); color: #fff; font-weight: 600; font-size: 1rem;
  text-decoration: none; transition: all 0.3s; box-shadow: 0 4px 16px rgba(232,101,10,0.25);
}
.btn-qurban-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(232,101,10,0.35); }
@media (max-width: 768px) { .qurban-history-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .qurban-history-grid { grid-template-columns: 1fr; } }