:root {
      --primary-color: #0F1B2E;
      --secondary-color: #FF6B00;
      --accent-color: #FFD700;
    }
    
    body {
      font-family: 'Tajawal', sans-serif;
      background-color: #f8f9fa;
    }
    
    .header-section {
  background: linear-gradient(135deg, #0F1B2E 0%, #1A2A40 100%);
  color: white;
  padding: 1.5rem 0;
  margin-bottom: 2rem;
  border-bottom: 3px solid #FF6B00;
  position: relative;
  text-align: center; /* center content inside */
}

.header-section h2 {
  font-weight: 700;
  display: inline-block;
  margin: 0 auto; /* center if block */
}

/* Remove underline if present */
.header-section h2::after {
  content: none;
}
.header-section p.text-muted {
  color: white !important;
}
.header-section h2 i.bi-tags {
  color: #FFD700;
}



    .brand-card {
      border: none;
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 10px 20px rgba(0,0,0,0.1);
      transition: all 0.3s ease;
      background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    }
    
    .brand-card:hover {
      transform: translateY(-10px);
      box-shadow: 0 15px 30px rgba(0,0,0,0.15);
    }
    
    .brand-card .card-body {
      padding: 2rem;
      position: relative;
      z-index: 1;
    }
    
    .brand-card img {
      max-height: 80px;
      width: auto;
      object-fit: contain;
      filter: grayscale(30%);
      transition: all 0.3s ease;
    }
    
    .brand-card:hover img {
      filter: grayscale(0%);
      transform: scale(1.1);
    }
    
    .brand-card .card-title {
      font-weight: 700;
      color: var(--primary-color);
      margin: 15px 0;
      font-size: 1.3rem;
    }
    
    .brand-card .btn {
      border-radius: 30px;
      font-weight: 500;
      padding: 8px 20px;
      background-color: var(--secondary-color);
      border: none;
      color: white;
      transition: all 0.3s ease;
    }
    
    .brand-card .btn:hover {
      background-color: var(--primary-color);
      transform: translateY(-2px);
    }
    
    .brand-card .btn:focus {
      outline: none;
      box-shadow: 0 0 0 0.2rem rgba(255, 107, 0, 0.5);
    }