* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.background-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: 40px 40px;
  background-image: linear-gradient(to right, #4737cd 1px, transparent 1px),
    linear-gradient(to bottom, #4737cd 1px, transparent 1px);
  background-position: center;
  z-index: -1;
  opacity: 0.05;
}

.soon {
  background-color: #000000;
  width: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  height: 30px;
  z-index: 1000;
  color: white;
  display: flex;
  align-items: center;
}

.navbar {
  position: fixed;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  height: 50px;
  background-color: #eaeaea;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 30px 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border: #eaeaea solid 1px;
  z-index: 1000;
}

.navbar .logo {
  display: flex;
  align-items: center;
  margin-right: auto;
}

.navbar .logo img {
  width: 132.2150421142578px;
  height: 30px;
}

.navbar .nav-links {
  display: flex;
  gap: 20px;
}

.navbar .nav-links li {
  list-style: none;
}

.navbar .nav-links a {
  text-decoration: none;
  color: #101010;
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 16px;
  cursor: pointer;
}

.navbar .nav-buttons div {
  cursor: pointer;

  font-size: 18px;
}

.navbar .nav-buttons div h4 {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.navbar .nav-buttons {
  display: flex;
  gap: 20px;
  margin-left: auto;
}

.navbar .nav-buttons div {
  display: flex;
  gap: 10px;
  padding: 5px 10px;
  border-radius: 50px;
  align-items: center;
}

.navbar .nav-buttons div img {
  width: 20px;
  height: 20px;
}

.navbar .nav-buttons .join {
  background-color: #4737cd;
  color: #ffffff;
}
.navbar .nav-buttons .talk {
  background-color: white;
  color: #4737cd;
  border: #4737cd solid 1px;
}

/* Hero */

.hero-title {
  margin-top: 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  position: relative;
  margin-bottom: 200px;
}

.hero-title .image1 {
  position: absolute;
  top: 150px;
  left: 11%;
  z-index: -1;
}

.hero-title .image2 {
  position: absolute;
  top: 100px;
  left: 8%;
  z-index: -1;
}

.hero-title .image3 {
  position: absolute;
  top: 0px;
  right: 0%;
  z-index: -1;
}

.hero-title .image4 {
  position: absolute;
  top: 180px;
  left: 23%;
  z-index: -1;
}

.hero-title .image5 {
  position: absolute;
  top: 190px;
  right: 28%;
  z-index: -1;
}

.hero-title .hero-text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.hero-title h1 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 50px;
  color: #101010;
}

.hero-title h2 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 50px;
  color: #4737cd;
}

.hero-title .hero-button {
  display: flex;
  gap: 10px;
  padding: 12px 20px;
  background-color: #4737cd;
  border-radius: 50px;
  color: #ffffff;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  font-style: normal;
  margin-top: 20px;
  cursor: pointer;
  align-items: center;
  margin-top: 40px;
}

.hero-title .hero-button img {
  width: 20px;
  height: 20px;
}

/* Hero 2 */

.hero-2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  font-family: "Montserrat", sans-serif;
  background-color: white;
  padding: 80px 140px;
}

.hero-2 .hero-2-text {
  display: flex;
  flex-direction: column;
}

.hero-2 .hero-2-text .text-1 {
  background-color: #f1efff;
  padding: 10px;
  border-radius: 5px;
  width: fit-content;
}

.hero-2 .hero-2-text .text-1 h4 {
  font-weight: 600;
  font-size: 13px;
  color: #4737cd;
}

.hero-2 .hero-2-text h2 {
  color: #4737cd;
  font-weight: 600;
  font-size: 32px;
  margin-top: 40px;
}

.hero-2 .hero-2-text h1 {
  color: #101010;
  font-weight: 600;
  font-size: 32px;
}

.hero-2 .hero-2-text .hero-2-text-inner {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 50px;
}

.hero-2 .hero-2-text .hero-2-text-inner div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hero-2 .hero-2-text .hero-2-text-inner div h4 {
  font-weight: 400;
  font-size: 20px;
}

/* Hero 3 */

.hero-3 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  gap: 40px;
  margin-top: 100px;
  padding: 60px;
  background-color: white;
}

.hero-3 .hero-3-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 1247px;
}

.hero-3 .hero-3-text h1 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 32px;
  color: #4737cd;
  text-align: center;
}

.hero-3 .hero-3-text h4 {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 24px;
  color: #000000;
  text-align: center;
}

.hero-3 .hero-3-video video {
  height: 577px;
  border-radius: 12px;
}

.hero-3 .hero-3-video {
  border-radius: 12px;
  box-shadow: #101010;
  border: #f3f4f8 solid 15px;
  display: flex;
  width: fit-content;
}

.hero-3 .hero-3-boxes {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  flex-direction: row;
  width: 100%;
  margin-top: 30px;
}

.hero-3 .hero-3-boxes .hero-3-box {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 40px;
  border-radius: 12px;
  background-color: #ffffff;
  border: #979797 solid 1px;
  width: 395px;
}

.hero-3 .hero-3-boxes .hero-3-box .hero-3-box-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}

.hero-3 .hero-3-boxes .hero-3-box .hero-3-box-title img {
  width: 55px;
  height: 55px;
}

.hero-3 .hero-3-boxes .hero-3-box .hero-3-box-title h2 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: #000000;
}

.hero-3 .hero-3-boxes .hero-3-box p {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 18px;
  color: #000000;
}

/* Hero 4 */

.hero-4 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 50px;
  font-family: "Montserrat", sans-serif;
  background-color: white;
  padding: 60px 130px;
}

.hero-4 .hero-4-text {
  display: flex;
  flex-direction: column;
  gap: 30px;
  max-width: 490px;
}

.hero-4 .hero-4-text .hero-4-text-inner {
  padding: 10px;
  border-radius: 5px;
  background-color: #f1efff;
  width: fit-content;
}

.hero-4 .hero-4-text .hero-4-text-inner h4 {
  font-weight: 600;
  font-size: 13px;
  color: #4737cd;
}

.hero-4 .hero-4-text .hero-4-text-inner-2 {
  display: flex;
  gap: 5px;
}

.hero-4 .hero-4-text .hero-4-text-inner-2 h2 {
  font-weight: 600;
  font-size: 32px;
  color: #101010;
}

.hero-4 .hero-4-text .hero-4-text-inner-2 h1 {
  font-weight: 600;
  font-size: 32px;
  color: #4737cd;
}

.hero-4 .hero-4-text .hero-4-text-inner-3 {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.hero-4 .hero-4-text .hero-4-text-inner-3 h2 {
  color: #101010;
  font-weight: 600;
  font-size: 24px;
}

.hero-4 .hero-4-text .hero-4-text-inner-3 p {
  color: #434343;
  font-weight: 400;
  font-size: 20px;
}

/* Hero 5 */

.hero-5 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 100px;
  padding: 60px 100px;
  background-color: white;
  font-family: "Montserrat", sans-serif;
  overflow: hidden;
}

.hero-5 .hero-5-text {
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 645px;
}

.hero-5 .hero-5-text .hero-5-text-inner {
  background-color: #f1efff;
  padding: 10px;
  border-radius: 5px;
  width: fit-content;
}

.hero-5 .hero-5-text .hero-5-text-inner-2 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.hero-5 .hero-5-text .hero-5-text-inner-2 h2 {
  font-weight: 600;
  font-size: 32px;
  color: #101010;
}

.hero-5 .hero-5-text .hero-5-text-inner-2 h1 {
  font-weight: 600;
  font-size: 32px;
  color: #4737cd;
}

.hero-5 .hero-5-text p {
  font-weight: 400;
  font-size: 22px;
  color: #101010;
}

.hero-5 .hero-5-text .hero-5-text-group {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 50px;
}

.hero-5 .hero-5-text .hero-5-text-group .hero-5-text-group-item {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 185px;
}

.hero-5 .hero-5-text .hero-5-text-group .hero-5-text-group-item img {
  width: 60px;
  height: 60px;
}

.hero-5 .hero-5-text .hero-5-text-group .hero-5-text-group-item h3 {
  font-weight: 600;
  font-size: 20px;
  color: #101010;
}

.hero-5 .hero-5-text .hero-5-text-group .hero-5-text-group-item h4 {
  font-weight: 400;
  font-size: 18px;
  color: #101010;
}

/* Hero 6 */

.hero-6 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 100px;
  padding: 60px;
  background-color: white;
  font-family: "Montserrat", sans-serif;
}

.hero-6 .hero-6-title-1 {
  color: #101010;
  font-weight: 600;
  font-size: 42px;
}

.hero-6 .hero-6-title-2 {
  color: #4737cd;
  font-weight: 500;
  font-size: 32px;
  margin-top: 10px;
}

.pricing-container {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 90px;
}

.pricing-card {
  background: white;
  border-radius: 12px;
  padding: 32px 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  border: 1px solid #e9ecef;
  position: relative;
  height: 604px;
}

.pricing-card.growth {
  background: linear-gradient(180deg, #ffffff 0%, #e6e3ff 100%);
  border: 1px solid #c5c9ff;
}

.plan-title {
  font-size: 18px;
  font-weight: 600;
  color: #222222;
  margin-bottom: 8px;
}

.plan-title.growth {
  color: #4737cd;
}

.plan-description {
  font-size: 14px;
  color: #1a1a1ab2;
  font-weight: 400;
  margin-bottom: 22px;
  line-height: 1.5;
}

.features-list {
  list-style: none;
  margin-bottom: 32px;
}

.feature-item {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  font-size: 14px;
  color: #1a1a1ab2;
  font-weight: 500;
  line-height: 1.4;
  justify-content: flex-start;
}

.feature-item img {
  width: 32px;
  height: 32px;
  margin-right: 12px;
  flex-shrink: 0;
  background-color: white;
  border-radius: 50%;
}

.feature-item:last-child {
  margin-bottom: 0;
}

.checkmark {
  width: 16px;
  height: 16px;
  background-color: #48bb78;
  border-radius: 50%;
  margin-right: 12px;
  margin-top: 2px;
  flex-shrink: 0;
  position: relative;
}

.checkmark::after {
  content: "✓";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 10px;
  font-weight: bold;
}

.pricing-button {
  width: 90%;
  padding: 12px 24px;
  background-color: #4737cd;
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  display: block;
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}

/* Hero 7 */

.detail-number {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  margin-top: 50px;
  background: #f1efff;
  align-items: center;
  padding: 20px;
}

.detail-number div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.detail-number div h1 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 35px;
  color: #4737cd;
}

.detail-number div h2 {
  color: #3a3a3ab2;
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 16px;
}

.features-title {
  margin-top: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 20px;
}

.features-title h2 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 32px;
  color: #101010;
}

.features-title p {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 24px;
  color: #000000;
  text-align: center;
  width: 1247px;
}

.features-image {
  margin-top: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.feature-image-1 {
  background-color: white;
  padding: 60px 60px 20px 60px;
  border-radius: 15px;
  border: #f3f4f8 solid 15px;
}

.features-2 {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: 60px 60px 0px 60px;
  background-image: linear-gradient(to right, #f3f4f800, #e8e6f8);
}

.features-2 .features-2-title h1 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 32px;
  color: #101010;
}

.features-2 .features-2-title h2 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 32px;
  color: #4737cd;
}

.features-2 .features-2-text {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 50px;
}
.features-2 .features-2-text .features-2-text-content {
  display: flex;
  align-items: center;
  gap: 10px;
}

.features-2 .features-2-text div .features-2-text-inner {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.features-2 .features-2-text div img {
  width: 55px;
  height: 55px;
}

.features-2 .features-2-text div h4 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 24px;
  color: #101010;
}

.features-2 .features-2-text div p {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: #434343;
  text-align: justify;
  width: 460px;
}

.features-3-center {
  display: flex;
  width: 100%;
  justify-content: center;
  margin-top: 100px;
}

.features-3 {
  display: flex;
  padding: 40px;
  justify-content: space-between;
  border: #f3f4f8 solid 15px;
  border-radius: 15px;
  align-items: center;
  width: 80%;
}

.features-3 .features-3-title h1 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 32px;
  color: #4737cd;
}

.features-3 .features-3-title h2 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 32px;
  color: #101010;
}

.features-3 .features-3-text {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 40px;
}

.features-3 .features-3-text div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.features-3 .features-3-text div img {
  width: 55px;
  height: 55px;
}

.features-3 .features-3-text div h4 {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 16px;
  color: #101010;
}

.center-screen {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 400px;
  margin-bottom: 40px;
  position: relative;
}

.contact-in-hero {
  background-color: #4737cd;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 75%;
  padding: 40px;
  position: absolute;
}

.contact-in-hero h1 {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 40px;
  color: #ffffff;
  width: 562px;
  text-align: center;
}

.contact-in-hero p {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: #ffffff;
  text-align: center;
  margin-top: 20px;
}

.contact-in-hero .contact-inputs {
  margin-top: 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.contact-in-hero .contact-inputs .contact-inputs-inner {
  display: flex;
  flex-direction: row;
  gap: 20px;
}

.contact-in-hero .contact-buttons {
  display: flex;
  gap: 20px;
}

.contact-in-hero .contact-buttons div {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  border-radius: 50px;
  cursor: pointer;
  font-family: "Poppins", sans-serif;
  gap: 10px;
}

.contact-in-hero .contact-buttons .join {
  color: #ffffff;
  background-color: #4737cd;
  font-weight: 500;
  font-size: 18px;
  border-radius: 50px;
  border: #ffffff solid 1px;
}

.input-group {
  position: relative;
  margin-bottom: 25px;
}

.input-group img {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  opacity: 0.7;
  z-index: 2;
}

.input-group input {
  width: 100%;
  padding: 15px 15px 15px 50px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  outline: none;
}

.input-group textarea {
  width: 300px;
  min-height: 220px;
  padding: 20px 20px 20px 55px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  resize: vertical;

  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.input-group input::placeholder {
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
}

.input-group input:focus {
  border-color: #ffffff;
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

.input-group input:hover {
  border-color: rgba(255, 255, 255, 0.4);
  background: rgba(255, 255, 255, 0.12);
}

.input-group textarea::placeholder {
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
  font-size: 16px;
}

.input-group textarea:focus {
  border-color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15),
    0 0 0 1px rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

/* Scrollbar styling */
.input-group textarea::-webkit-scrollbar {
  width: 8px;
}

.input-group textarea::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
}

.input-group textarea::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 10px;
  transition: background 0.3s ease;
}

/* Additional glow effect on focus */
.input-group textarea:focus {
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15),
    0 0 0 1px rgba(255, 255, 255, 0.1), 0 0 20px rgba(255, 255, 255, 0.1);
}

.input-group::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  z-index: 2;
  opacity: 0.7;
}

.input-group.name::before {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>')
    no-repeat center;
  background-size: contain;
}

.input-group.email::before {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.89 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>')
    no-repeat center;
  background-size: contain;
}

.input-group.phone::before {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>')
    no-repeat center;
  background-size: contain;
}

.input-group.message::before {
  position: absolute;
  left: 18px;
  top: 34px;
  width: 18px;
  height: 18px;
  z-index: 2;
  opacity: 0.7;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>')
    no-repeat center;
  background-size: contain;
  transition: all 0.3s ease;
}

/* Footer */
footer {
  background-color: #101010;
  color: #ffffff;
  padding: 350px 20px 60px 20px;
  text-align: center;
}

.footer-content .footer-section-1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
}

.footer-content .footer-section-1 .footer-logo img {
  width: 221.02606201171875;
  height: 50px;
}

.footer-content .footer-section-1 .footer-links {
  display: flex;
  gap: 20px;
}

.footer-content .footer-section-1 .footer-links ul {
  display: flex;
  gap: 20px;
}

.footer-content .footer-section-1 .footer-links ul li {
  list-style: none;
  cursor: pointer;
}

.footer-content .footer-section-1 .footer-links a {
  text-decoration: none;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 20px;
}

.footer-content .footer-section-2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
}

.footer-content .footer-section-2 .footer-socials {
  display: flex;
  gap: 20px;
}

.footer-content .footer-section-2 .footer-socials a {
  text-decoration: none;
}

.footer-content .footer-section-2 .footer-socials a img {
  width: 22px;
  height: 22px;
}

.footer-content .footer-section-2 .footer-copyright {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: #ffffff;
}

.email-success {
  position: fixed;
  top: 10px;
  right: -60%;
  font-family: "Poppins", sans-serif;
  z-index: 2000;
  background-image: linear-gradient(to right, #4737cd, #483daf);
  padding: 20px;
  border-radius: 10px;
  transition: all 0.3s ease-in-out;
}

.email-success .close{
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  color: #ffffff;
  font-size: 20px;
}

.email-success .close img {
  width: 20px;
  height: 20px;
}

.email-success img {
  width: 40px;
  height: 40px; 
}

.email-success .image {
  display: flex;
  gap: 10px;
  align-items: center;
}

.email-success h2 {
  font-weight: 300;
  font-size: 14px;
}

.email-success p {
  font-weight: 200;
  font-size: 10px;
}