
    .case-study-box {
      background-color: #f8f9fa;
      border-left: 4px solid #2c7be5;
      padding: 20px;
      margin: 20px 0;
      border-radius: 0 4px 4px 0;
    }
    
    .case-study-list {
      list-style-type: none;
      padding-left: 0;
    }
    
    .case-study-list li {
      padding: 8px 0;
      border-bottom: 1px solid #eee;
    }
    
    .case-study-list li i {
      color: #e63757;
      margin-right: 10px;
    }
    
    .impact-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 20px;
      margin: 25px 0;
    }
    
    .impact-card {
      background: white;
      border-radius: 8px;
      padding: 20px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.05);
      text-align: center;
    }
    
    .impact-card i {
      font-size: 2rem;
      color: #2c7be5;
      margin-bottom: 15px;
    }
    
    .feature-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 20px;
      margin: 25px 0;
    }
    
    .feature-card {
      background: white;
      border-radius: 8px;
      padding: 20px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.05);
      text-align: center;
    }
    
    .feature-card i {
      font-size: 1.5rem;
      color: #2c7be5;
      margin-bottom: 15px;
    }
    
    .transformation-example {
      margin: 30px 0;
    }
    
    .comparison-table {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      margin: 20px 0;
    }
    
    .comparison-col {
      flex: 1;
      min-width: 300px;
    }
    
    .comparison-col table {
      width: 100%;
      border-collapse: collapse;
    }
    
    .comparison-col th, .comparison-col td {
      padding: 12px;
      text-align: left;
      border: 1px solid #ddd;
    }
    
    .comparison-col th {
      background-color: #f2f2f2;
    }
    
    .tools-table {
      overflow-x: auto;
      margin: 25px 0;
    }
    
    .tools-table table {
      width: 100%;
      border-collapse: collapse;
    }
    
    .tools-table th, .tools-table td {
      padding: 12px 15px;
      text-align: left;
      border-bottom: 1px solid #ddd;
    }
    
    .tools-table th {
      background-color: #f8f9fa;
    }
    
    .rating {
      color: #ffc107;
    }
    
    .case-study {
      background-color: #f8f9fa;
      padding: 20px;
      border-radius: 8px;
      margin: 25px 0;
    }
    
    .prevention-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 20px;
      margin: 25px 0;
    }
    
    .prevention-card {
      background: white;
      border-radius: 8px;
      padding: 20px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    }
    
    .prevention-card i {
      font-size: 1.5rem;
      color: #2c7be5;
      margin-bottom: 15px;
    }
    
    .integration-example {
      margin: 30px 0;
    }
    
    .scenario {
      background-color: #f8f9fa;
      padding: 15px;
      border-radius: 8px;
      margin-bottom: 15px;
    }
    
    .ai-suggestion {
      border: 1px solid #e0e0e0;
      border-radius: 8px;
      padding: 15px;
      background-color: #f0f7ff;
      margin: 15px 0;
    }
    
    .suggestion-header {
      display: flex;
      align-items: center;
      margin-bottom: 10px;
    }
    
    .suggestion-header i {
      color: #2c7be5;
      margin-right: 10px;
    }
    
    .suggestion-actions {
      display: flex;
      gap: 10px;
      margin-top: 15px;
    }
    
    .btn-accept {
      background-color: #00a854;
      color: white;
      border: none;
      padding: 8px 15px;
      border-radius: 4px;
      cursor: pointer;
    }
    
    .btn-decline {
      background-color: #f5f5f5;
      color: #333;
      border: 1px solid #ddd;
      padding: 8px 15px;
      border-radius: 4px;
      cursor: pointer;
    }
    
    .process-steps {
      margin: 30px 0;
    }
    
    .process-step {
      display: flex;
      margin-bottom: 20px;
      align-items: flex-start;
    }
    
    .step-number {
      background-color: #2c7be5;
      color: white;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 15px;
      flex-shrink: 0;
    }
    
    @media (max-width: 768px) {
      .comparison-col {
        min-width: 100%;
      }
      
      .feature-grid {
        grid-template-columns: 1fr 1fr;
      }
      
      .impact-grid, .prevention-grid {
        grid-template-columns: 1fr;
      }
    }