

/* Fonts */
.raleway-normal {
  font-family: "Raleway", sans-serif;
  font-style: normal;
}

.inter-normal {
  font-family: "Inter", sans-serif;
  font-style: normal;
}

/* Header */
header {
  background-image: url('./Assets/Hero-bg.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding-bottom: 100px;
  text-align: center;
}

nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo {
  color: #4E47FF;
  font-size: 34px;
  margin-left: 120px;
    
}

.btn {
  padding: 12px 36px;
  border-radius: 10px;
  background-color: #4E47FF;
  color: #FFFFFF;
  font-size: 16px;
  font-weight: bold;
  border: none;
  margin-right: 120px;
  /* Hover */
  transition: background-color 0.3s ease; /* Added hover transition */

}

/* Hover */
.btn:hover { /* Hover effect added */
  background-color: #3c3db4; /* Slightly darker on hover */
  cursor: pointer; /* Added cursor change to pointer */
}


.header-title {
  font-size: 65px;
  font-weight: bold;
  margin-top: 200px
}

/*button*/

.press {
  background-color: #4E47FF;
  border-radius: 10px;
  padding: 12px 36px;
  color: #FFFFFF;
  font-weight: bold;
  border: none;
  /* Hover */
  transition: background-color 0.3s ease; /* Added hover transition */
}
/* Hover */
.press:hover { /* Hover effect added */
  background-color: #3c3db4; /* Slightly darker on hover */
  cursor: pointer; 
}


.press-btn {
  text-align: center;
  padding: 12px 36px;
}




/* Action */

main {
  max-width: 1140px;
  margin: 0 auto;
}

.action {
  margin-top: 56px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.action-description {
  font-size: 24px;
  color: #25243283;
}

.action-title {
  font-size: 42px;
}

.action-img {
  border-radius: 48px;
  width: 403px;
  height: 328px;
}

/* button */
.launch {
  border-radius: 10px;
  background-color: #4E47FF;
  color: #FFFFFF;
  font-weight: bold;
  padding: 12px 36px;
  border: none;
  /* Hover */
  transition: background-color 0.3s ease; /* Added hover transition */

}

/* Hover */
.launch:hover { /* Hover effect added */
  background-color: #3c3db4; /* Slightly darker on hover */
  cursor: pointer; 
}



/* Users Stats */

.user-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.user {
  margin-top: 116px;
  background-color: #4d47ff1d;
  padding: 50px 80px;
  border-radius: 24px;
}

.user-heading {
  text-align: center;
}

.actions {
  font-size: 80px;
  color: #4E47FF;
}

/* Users Feedback */
.users-feedback {
  justify-content: center; /* Aligns the content in the center */
  max-width: 1140px;
  margin: 0 auto;
  margin-top: 137px;
  margin-bottom: 137px;
}

.feed-title {
  font-size: 42px;
  font-weight: bold;
  color: #252432;
  text-align: center; /* Center the heading */
}

.feedback {
  display: flex;
  align-items: stretch;
  justify-content: space-between; /* Distribute reviews evenly in one row */
  gap: 20px;
  padding: 24px;
}

.review {
  background-color: rgba(255, 255, 255, 0.9); /* Slightly less transparent */
  border: 1px solid rgba(242, 237, 237, 1);
  border-radius: 14px;
  padding: 24px;
  box-shadow: 2px 2px 2px rgba(203, 170, 234, 0.548);
  flex: 1; /* Ensures that each review takes up equal space */
  min-width: 300px; /* Ensures a minimum width for each review */
  max-width: 350px; /* Limiting the max-width to maintain consistency */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* Added smooth transition for hover effect */

  /*hover*/
  
}
  /*hover*/

.review:hover {
  transform: translateY(-5px); /* Slightly lift the review card */
  box-shadow: 4px 4px 12px rgba(203, 170, 234, 0.8); /* Enhanced shadow effect */
}

.image {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.reviewer-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.view-title {
  font-size: 24px;
  font-weight: 600;
  color: #1E1E1E;
}

.view-detail {
  font-size: 18px;
  font-weight: 400;
  color: #1E1E1E;
}

.reviewer-name {
  font-size: 16px;
  font-weight: 600;
  color: #757575;
}

.reviewer-date {
  font-size: 16px;
  font-weight: 400;
  color: #B3B3B3;
  margin-top: 0px;
}

.review-image {
  width: 40px;
  height: 40px;
  border: solid white;
  border-radius: 9999px;
  display: flex;
  background-color: white;
  overflow: hidden;
  margin-right: 12px;
  /* hover */
  transition: transform 0.3s ease; /* Added transition for image hover */
}

/* hover */
.review-image:hover {
  transform: scale(1.1); /* Slightly enlarge the image on hover */
}



/* Focus */

.dot {
  border-radius: 10px;
  margin-left: 475px;
  margin-bottom: 20px;
  padding: 12px 36px;
  border-radius: 10px;
  background-color: #4E47FF;
  color: #FFFFFF;
  font-weight: bold;
  text-align: center;
  border: none;
  /* hover */
  transition: background-color 0.3s ease; /* Added hover transition */
}

/* hover */
.dot:hover { /* Hover effect added */
  background-color: #3c3db4; /* Slightly darker on hover */
  cursor: pointer; 
}


.focus-img {
  margin-left: 150px;
  border-radius: 48px;
}

.focus {
  max-width: 1140px;
  background-color: whitesmoke;
  padding-top: 10px;
  padding-bottom: 10px;
}

.focus-sub-title {
  color: #0000007a;
}

/* Contact Form */


/* Container for the form */
.touch-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 50px; /* Adjusted padding for a more balanced top space */

}

/* Form title styling */
.touch-title {
  font-size: 70px; /* More scalable font size */
  font-weight: bold; /* Adds emphasis to the title */
  width: 100%; /* Full width for better responsiveness */
  text-align: center; /* Centered title */
  margin-bottom: 20px; /* Adds space between the title and form */
}

/* Form styling */
.touch-form {
  width: 100%;
  max-width: 500px; /* Limit max width for responsiveness */
  margin: 0 auto; /* Centers the form horizontally */
}

/* Styling for text and email input fields */
input[type="text"],
input[type="email"] ,
textarea{
  height: 50px;
  border-radius: 5px;
  padding: 10px 20px;
  width: 100%; /* Make inputs take full width within the form */
  box-sizing: border-box; /* Ensures padding is included in width calculation */
  margin-bottom: 20px; /* Space between inputs */
  border: 1px solid #ccc; /* Light border color */
  font-size: 16px; /* Ensures text is readable */
  /* Hover */
  transition: border-color 0.3s ease; /* Smooth transition for focus effect */
}
/* Hover */

/* Focus effect for inputs */
input[type="text"]:focus,
input[type="email"]:focus {
  outline: none;
  border-color: #4E47FF; /* Border turns blue when focused */
}

/* Button styling */
.touch-btn {
  display: block;
  padding: 15px 40px;
  background-color: #4E47FF;
  color: #FFFFFF;
  border-radius: 10px;
  width: 100%; /* Make button take full width */
  font-size: 18px;
  border: none;
  /* Hover */
  transition: background-color 0.3s ease; /* Added hover transition */


}
/* Hover */
.touch-btn:hover { /* Hover effect added */
  background-color: #3c3db4; /* Slightly darker on hover */
  cursor: pointer; 
}


/* Footer */
.end {
  text-align: center;
  padding: 80px 40px 60px 40px; /* Adjusted padding for better alignment */
  background-color: #f4f4f4;  /* Subtle background color for professionalism */
}

.end ul {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 32px;  /* Reduced gap for a cleaner look */
  padding: 0;
}

.end ul li a {
  text-decoration: none;
  color: #333; /* Darker text for better contrast */
  font-weight: 600; /* Slightly bold for readability */
  /* Hover */
  transition: color 0.3s ease; /* Smooth transition for hover effect */

}

/* Hover */
.end ul li a:hover { /* Hover effect added */
  color: #4e47ff; /* Change color on hover */
  cursor: pointer; 
}





.end-logo {
  color: #4E47FF;
  font-size: 60px; /* Adjusted size for better balance */
  font-weight: bold;
}

.end-description {
  color: #6b6b6b; /* Subtle gray color for description */
  font-size: 16px; /* Reduced font size for readability */
  margin-bottom: 40px; /* Added space below description */
  line-height: 1.6; /* Improved line spacing for clarity */
}




