ul {
  list-style-type: none; 
  padding: 0;
  margin: 30px 0;
  display: flex;
  flex-direction: column; 
  gap: 10px;             
  width: 300px;          
}
body{
    background: linear-gradient(to right, #dd83b4, #db1cac);
}

li a {
  display: block;         
  text-decoration: none; 
  color: #f5f2f2;        
  background-color: #f70ca8; 
  padding: 12px 20px;
  border-radius: 6px;   
  font-family: Arial, sans-serif;
  font-weight: 500;
  border-left: 4px solid #57093f; 
  transition: all 0.2s ease;     
}


li a:hover {
  background-color: #6b0d41; 
  color: #ffffff;            
  padding-left: 25px;      
}


h2 {
  font-family: Arial, sans-serif;
  color: #222;
  margin-bottom: 5px;
}