.benefit-card {
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-md);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
    height: 100%
    }
    
    .benefit-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}
    
    .benefit-header {
    padding: 10px;
    font-weight: var(--font-semibold);
    font-size: var(--text-sm);
    text-align: center;
    color: var(--white);
    }
    
    .header-red {
      background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
    }
    
    .header-orange {
      background: linear-gradient(135deg, #e67e22 0%, #d35400 100%);
    }
    
    .header-olive {
      background: linear-gradient(135deg, #8b9a46 0%, #6b7a36 100%);
    }
    
    .header-gray {
      background: linear-gradient(135deg, #7f8c8d 0%, #5d6d6e 100%);
    }
    
    .header-blue {
      background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
    }
    
    .benefit-content {
      padding: 16px;
      text-align: center;
      background: var(--white);
    }

@media (max-width: 767px) {
    .benefit-content img {
width: 70px;
height: 70px;
}
}