.intro {
  color: rgb(187, 183, 183);
  background-color: rgb(243, 241, 241);
  min-height: 75vh;
  display: flex;
  align-items: center;
  margin-top: 80px;
  padding: 40px 0; 
}

.skill-item {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

.skill-icon i {
  color: #111827;
  cursor: pointer;
}

.skill-icon i:hover {
  color: #3B82F6;
}

.skills-flex {
  margin-left: 10px;
  flex: 1; 
  min-width: 300px; 
}

.skills-flex h1 {
  font-size: 50px;
  color: #3B82F6;
  margin-top: 0px;
  margin-bottom: 0px;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

 .profile {
  filter: drop-shadow(0 4px 20px rgba(65, 158, 245, 0.922));
  }

.skill-grid {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; 
  gap: 40px; 
  
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
}

.logo-info {
  display: flex;
  align-items: flex-start; 
  margin-left: 80px;
  gap: 30px; 
}

.skill-icon {
  width: 30px;
  height: 30px;
  background-color: #f0f4ff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
  color: #4f46e5;
  font-size: 30px;
}



.profile {
  width: 100%; 
  max-width: 400px;
  height: auto; 
}

.profile-div {
  
  flex: 1; 
  min-width: 300px;
  text-align: center;
}

.info p {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: 18px;
  margin-bottom: 30px;
  opacity: 0.9;
  
  width: 100%;
  max-width: 400px; 
}