/* Footer from Footer Folder */
:root {
  --bg: rgba(245, 245, 247, 1);
  --black: rgba(20, 20, 20, 1);
  --dark-blue: rgba(29, 58, 112, 1);
  --reg-12-font-family: "Lato", sans-serif;
  --reg-12-font-weight: 400;
  --reg-12-font-size: 12px;
  --reg-12-letter-spacing: 0px;
  --reg-12-line-height: 150%;
  --reg-12-font-style: normal;
  --reg-14-font-family: "Lato", sans-serif;
  --reg-14-font-weight: 400;
  --reg-14-font-size: 14px;
  --reg-14-letter-spacing: 0px;
  --reg-14-line-height: 150%;
  --reg-14-font-style: normal;
  --reg-16-font-family: "Lato", sans-serif;
  --reg-16-font-weight: 400;
  --reg-16-font-size: 16px;
  --reg-16-letter-spacing: 0px;
  --reg-16-line-height: 150%;
  --reg-16-font-style: normal;
  --reg-18-font-family: "Lato", sans-serif;
  --reg-18-font-weight: 400;
  --reg-18-font-size: 18px;
  --reg-18-letter-spacing: 0px;
  --reg-18-line-height: 24px;
  --reg-18-font-style: normal;
  --reg-20-font-family: "Lato", sans-serif;
  --reg-20-font-weight: 400;
  --reg-20-font-size: 20px;
  --reg-20-letter-spacing: 0px;
  --reg-20-line-height: 139.9999976158142%;
  --reg-20-font-style: normal;
  --reg-24-font-family: "Lato", sans-serif;
  --reg-24-font-weight: 400;
  --reg-24-font-size: 24px;
  --reg-24-letter-spacing: 0px;
  --reg-24-line-height: 139.9999976158142%;
  --reg-24-font-style: normal;
  --bold-12-font-family: "Lato", sans-serif;
  --bold-12-font-weight: 700;
  --bold-12-font-size: 12px;
  --bold-12-letter-spacing: 0px;
  --bold-12-line-height: 150%;
  --bold-12-font-style: normal;
  --bold-14-font-family: "Lato", sans-serif;
  --bold-14-font-weight: 700;
  --bold-14-font-size: 14px;
  --bold-14-letter-spacing: 0px;
  --bold-14-line-height: 150%;
  --bold-14-font-style: normal;
  --bold-16-font-family: "Lato", sans-serif;
  --bold-16-font-weight: 700;
  --bold-16-font-size: 16px;
  --bold-16-letter-spacing: 0px;
  --bold-16-line-height: 150%;
  --bold-16-font-style: normal;
  --bold-18-font-family: "Lato", sans-serif;
  --bold-18-font-weight: 700;
  --bold-18-font-size: 18px;
  --bold-18-letter-spacing: 0px;
  --bold-18-line-height: 150%;
  --bold-18-font-style: normal;
  --bold-20-font-family: "Lato", sans-serif;
  --bold-20-font-weight: 700;
  --bold-20-font-size: 20px;
  --bold-20-letter-spacing: 0px;
  --bold-20-line-height: 139.9999976158142%;
  --bold-20-font-style: normal;
  --bold-24-font-family: "Lato", sans-serif;
  --bold-24-font-weight: 700;
  --bold-24-font-size: 24px;
  --bold-24-letter-spacing: 0px;
  --bold-24-line-height: 139.9999976158142%;
  --bold-24-font-style: normal;
  --montserrat-28-reg-font-family: "Lato", sans-serif;
  --montserrat-28-reg-font-weight: 400;
  --montserrat-28-reg-font-size: 28px;
  --montserrat-28-reg-letter-spacing: 0px;
  --montserrat-28-reg-line-height: 129.99999523162842%;
  --montserrat-28-reg-font-style: normal;
  --montserrat-32-reg-font-family: "Lato", sans-serif;
  --montserrat-32-reg-font-weight: 400;
  --montserrat-32-reg-font-size: 32px;
  --montserrat-32-reg-letter-spacing: 0px;
  --montserrat-32-reg-line-height: 120.00000476837158%;
  --montserrat-32-reg-font-style: normal;
  --montserrat-38-reg-font-family: "Lato", sans-serif;
  --montserrat-38-reg-font-weight: 400;
  --montserrat-38-font-size: 38px;
  --montserrat-38-reg-letter-spacing: 0px;
  --montserrat-38-reg-line-height: 120.00000476837158%;
  --montserrat-38-reg-font-style: normal;
  --montserrat-28-b-font-family: "Lato", sans-serif;
  --montserrat-28-b-font-weight: 700;
  --montserrat-28-b-font-size: 28px;
  --montserrat-28-b-letter-spacing: 0px;
  --montserrat-28-b-line-height: 129.99999523162842%;
  --montserrat-28-b-font-style: normal;
  --montserrat-32-b-font-family: "Lato", sans-serif;
  --montserrat-32-b-font-weight: 700;
  --montserrat-32-b-font-size: 32px;
  --montserrat-32-b-letter-spacing: 0px;
  --montserrat-32-b-line-height: 120.00000476837158%;
  --montserrat-32-b-font-style: normal;
  --montserrat-38-b-font-family: "Lato", sans-serif;
  --montserrat-38-b-font-weight: 700;
  --montserrat-38-b-font-size: 38px;
  --montserrat-38-b-letter-spacing: 0px;
  --montserrat-38-b-line-height: 120.00000476837158%;
  --montserrat-38-b-font-style: normal;
  --montserrat-38-semi-font-family: "Lato", sans-serif;
  --montserrat-38-semi-font-weight: 400;
  --montserrat-38-semi-font-size: 38px;
  --montserrat-38-semi-letter-spacing: 0px;
  --montserrat-38-semi-line-height: 120.00000476837158%;
  --montserrat-38-semi-font-style: normal;
  --playfair-38-font-family: "Merriweather", serif;
  --playfair-38-font-weight: 600;
  --playfair-38-font-size: 38px;
  --playfair-38-letter-spacing: 0px;
  --playfair-38-line-height: 120.00000476837158%;
  --playfair-38-font-style: italic;
  --32-bold-font-family: "Lato", sans-serif;
  --32-bold-font-weight: 700;
  --32-bold-font-size: 32px;
  --32-bold-letter-spacing: 0px;
  --32-bold-line-height: 120.00000476837158%;
  --32-bold-font-style: normal;
  --1: 0px 0px 20px 0px rgba(214, 214, 214, 0.25);
  --2: 0px 0px 30px 0px rgba(178, 178, 178, 0.25);
  --3: 0px 0px 0px 0px rgba(123, 123, 123, 0.3);
  --collection-1-new-group-main: rgba(0, 104, 187, 1);
  --collection-1-new-group-accueillir: rgba(226, 213, 30, 1);
  --collection-1-new-group-vendre: rgba(245, 166, 35, 1);
  --collection-1-new-group-violet: rgba(155, 81, 224, 1);
  --collection-1-new-group-former: rgba(45, 156, 219, 1);
  --collection-1-new-group-n-gocier: rgba(217, 179, 249, 1);
  --collection-1-new-group-s-curiser: rgba(69, 128, 100, 1);
  --collection-1-neutral-white: rgba(255, 255, 255, 1);
  --collection-1-functional-red: rgba(235, 87, 87, 1);
  --collection-1-functional-color-2: rgba(39, 174, 96, 1);
  --collection-1-neutral-line: rgba(246, 246, 246, 1);
  --collection-1-neutral-liner: rgba(235, 236, 237, 1);
  --collection-1-neutral-border: rgba(216, 217, 219, 1);
  --collection-1-neutral-disable: rgba(139, 143, 149, 1);
  --collection-1-neutral-second-text: rgba(67, 75, 86, 1);
  --collection-1-neutral-main-text: rgba(12, 39, 55, 1);
}

/* Mobile First Design */
.footer {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
  align-items: flex-start;
  gap: 10px;
  padding: 30px 16px 0px;
  position: relative;
  background-color: #ebeced;
  border-top-width: 1px;
  border-top-style: solid;
  border-color: var(--collection-1-neutral-border);
}

.footer .frame {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.footer .div {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
  gap: 32px;
  position: relative;
  flex: 0 0 auto;
}

.footer .frame-wrapper {
  display: flex;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
  width: 100%;
}

.footer .frame-2 {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
  gap: 33px;
  position: relative;
}

/* Container for the two navigation columns - Mobile first (2 columns side by side) */
.footer .footer-nav-container {
  display: flex;
  flex-direction: row !important; /* Force horizontal layout on all screen sizes */
  width: 100%;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
}

.footer .footer-nav-container > nav {
  flex: 1;
  min-width: 0; /* Allow flex items to shrink below their content size */
  max-width: 50%; /* Ensure each column takes up to 50% of space */
}

/* Slightly larger gap on larger mobile screens */
@media (min-width: 480px) {
  .footer .footer-nav-container {
    gap: 32px;
  }
}

.footer .logo-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}

.footer .frame-3 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.footer .img {
  position: relative;
  flex: 0 0 auto;
  width: 120px;
  height: auto;
}

.footer .frame-4 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
}

.footer .text-wrapper {
  position: relative;
  width: fit-content;
  font-family: var(--bold-16-font-family);
  font-weight: var(--bold-16-font-weight);
  color: var(--collection-1-neutral-main-text);
  font-size: var(--bold-16-font-size);
  letter-spacing: var(--bold-16-letter-spacing);
  line-height: var(--bold-16-line-height);
  font-style: var(--bold-16-font-style);
  text-align: left;
  margin-bottom: 8px;
}

.footer .frame-5 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.footer .text-wrapper-2,
.footer .text-wrapper-3,
.footer .text-wrapper-5,
.footer .conditions-d {
  position: relative;
  width: fit-content;
  font-family: var(--reg-14-font-family);
  font-weight: var(--reg-14-font-weight);
  color: var(--collection-1-neutral-second-text);
  font-size: var(--reg-14-font-size);
  letter-spacing: var(--reg-14-letter-spacing);
  line-height: var(--reg-14-line-height);
  font-style: var(--reg-14-font-style);
  text-align: left;
  margin: 0;
}

.footer .frame-6 {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
  gap: 32px;
  position: relative;
}

.footer .frame-7,
.footer .frame-9 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
}

.footer .text-wrapper-4,
.footer .text-wrapper-6 {
  position: relative;
  width: fit-content;
  font-family: var(--bold-16-font-family);
  font-weight: var(--bold-16-font-weight);
  color: var(--collection-1-neutral-main-text);
  font-size: var(--bold-16-font-size);
  letter-spacing: var(--bold-16-letter-spacing);
  line-height: var(--bold-16-line-height);
  font-style: var(--bold-16-font-style);
  text-align: left;
  margin-bottom: 8px;
}

.footer .frame-8 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.footer .frame-10 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.footer .rectangle {
  position: relative;
  align-self: stretch;
  width: 100%;
  height: 1px;
  background-color: var(--collection-1-neutral-border);
}

.footer .div-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.footer .text-wrapper-7 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  background: linear-gradient(
    191deg,
    rgba(0, 120, 248, 1) 0%,
    rgba(9, 65, 235, 1) 100%
  );
  -webkit-background-clip: text !important;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  font-family: var(--montserrat-28-reg-font-family);
  font-weight: var(--montserrat-28-reg-font-weight);
  color: transparent;
  font-size: var(--montserrat-28-reg-font-size);
  letter-spacing: var(--montserrat-28-reg-letter-spacing);
  line-height: var(--montserrat-28-reg-line-height);
  white-space: nowrap;
  font-style: var(--montserrat-28-reg-font-style);
}

.footer .socials {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 24px;
  position: relative;
  flex: 0 0 auto;
}

.footer .community-icon {
  position: relative;
  width: 40px;
  height: 40px;
  background-color: var(--collection-1-neutral-white);
  border-radius: 56px;
  overflow: hidden;
  backdrop-filter: blur(4px) brightness(100%);
  -webkit-backdrop-filter: blur(4px) brightness(100%);
}

.footer .social-icon {
  position: absolute;
  width: 40.00%;
  height: 40.00%;
  top: 30.00%;
  left: 30.00%;
}

.footer .community-icon-2 {
  position: relative;
  width: 40px;
  height: 40px;
}

.footer .frame-11 {
  position: relative;
  align-self: stretch;
  width: calc(100% + 32px); /* Compensate for footer padding */
  margin-left: -16px; /* Negative margin to break out of footer padding */
  background: linear-gradient(191.18deg, rgba(0, 120, 248, 0.15) 19.35%, rgba(9, 65, 235, 0.15) 101.33%);
    padding: 16px;
  }

.footer .frame-12 {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
  gap: 6px;
  position: relative;
}

.footer .footer-copyright {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
  width: 100%;
}

.footer .copyright-text {
  position: relative;
  width: fit-content;
  font-family: var(--reg-16-font-family);
  font-weight: var(--reg-16-font-weight);
  color: #434B56;
  font-size: var(--reg-16-font-size);
  letter-spacing: var(--reg-16-letter-spacing);
  line-height: var(--reg-16-line-height);
  white-space: nowrap;
  font-style: var(--reg-16-font-style);
}

.footer .frame-13 {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
}

.footer .frame-14 {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}

.footer .mail {
  position: relative;
  width: 24px;
  height: 24px;
}

.footer .text-wrapper-8 {
  position: relative;
  font-family: var(--reg-16-font-family);
  font-weight: var(--reg-16-font-weight);
  color: #434B56;
  font-size: var(--reg-16-font-size);
  letter-spacing: var(--reg-16-letter-spacing);
  line-height: var(--reg-16-line-height);
  font-style: var(--reg-16-font-style);
}

/* Desktop Styles */
@media (min-width: 768px) {
  .footer {  
    max-width: 100%;
    padding: 60px 40px 0px;
  }

  .footer .frame-2 {
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 80px;
    width: 100%;
  }

  .footer .footer-nav-container {
    flex: 1;
    gap: 80px;
  }
  .footer .frame-12 {
    padding-right: 160px;
    flex-direction: row;
    gap: 16px;
  }
  .footer .logo-section {
    width: 120px;
    flex-shrink: 0;
  }

  .footer .img {
    width: 120px;
  }

  .footer .frame-4,
  .footer .frame-7,
  .footer .frame-9 {
    width: 200px;
    flex-shrink: 0;
  }

  .footer .frame-6 {
    display: none;
  }

  .footer .socials {
    justify-content: flex-end;
    gap: 16px;
    width: auto;
  }

  .footer .div-wrapper {
    justify-content: flex-start;
  }

  .footer .footer-copyright {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
  }

  .footer .frame-13 {
    width: auto;
    justify-content: flex-end;
  }

  .footer .frame-11 {
    width: calc(100% + 80px); /* Compensate for desktop footer padding */
    margin-left: -40px; /* Negative margin for desktop */
    padding: 20px 40px;
  }
}

@media (min-width: 1024px) {
  .footer {
    padding: 80px 60px 0px;
  }

  .footer .frame-11 {
    width: calc(100% + 120px); /* Compensate for large desktop footer padding */
    margin-left: -60px; /* Negative margin for large desktop */
  }

  .footer .frame-3 {
    gap: 120px;
  }

  .footer .frame-6 {
    gap: 120px;
  }

  .footer .frame-4,
  .footer .frame-7,
  .footer .frame-9 {
    width: 300px;
  }
}

/* Additional styles for semantic improvements */
.footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer a {
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease;
  display: block;
  text-align: left;
}

.footer a:hover,
.footer a:focus {
  opacity: 0.8;
}

.footer a:focus {
  outline: 2px solid #4a90e2;
  outline-offset: 2px;
}

.footer .socials a {
  display: block;
  border-radius: 56px;
}

.footer .socials a:focus {
  outline: 2px solid #4a90e2;
  outline-offset: 2px;
}

.footer h3 {
  margin: 0;
  text-align: left;
}

.footer .frame-5 li,
.footer .frame-8 li {
  margin: 0;
  text-align: left;
}