:root {
  --color-primary: rgba(61, 140, 239, 1);
  --color-secondary: #2d7dbe;
  --color-accent: #f4f8ff;
  --color-text-primary: rgba(16, 24, 40, 1);
  --color-text-secondary: #6c87ae;
  --color-background: rgba(22, 120, 242, 1);
  --color-placeholder: rgba(169, 169, 169, 1);
}

/* import font */
@font-face {
  font-family: "raleway";
  src: url("../Fonts/Raleway-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "raleway_med";
  src: url("../Fonts/Raleway-Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Inter";
  src: url("../Fonts/Inter-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Inter_med";
  src: url("../Fonts/Inter-Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "sora";
  src: url("../Fonts/Sora-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "sora_med";
  src: url("../Fonts/Sora-SemiBold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "poppins";
  src: url("../Fonts/Poppins-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "poppins_med";
  src: url("../Fonts/Poppins-Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "poppins_bold";
  src: url("../Fonts/Poppins-Bold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
.logo {
  margin-bottom: 15px !important;
}
.global-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  position: relative;
}

.landing-page {
  max-width: 1920px;
  width: 100%;
}

.header-container {
  padding-top: 81px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  background-color: var(--color-background);
}

.header-container .link {
  text-decoration: none !important;
  color: rgba(255, 255, 255, 1);
  font-family: "sora";
  font-size: 16px;
}
.header-container .btn-pro {
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(64, 228, 173, 1);
  padding: 16px, 28px, 16px, 28px;
  border-radius: 100px;
  width: 315px;
  height: 55px;
}

.login a {
  font-size: 12px !important;
}
.login {
  display: flex;
  gap: 12px;
  align-items: center;
}
.hero {
  background-color: var(--color-background);
  padding-top: 97px !important;
  padding: 0px 220px;
  padding-bottom: 75px !important;
}
.hero-container {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}

.hero-container h4 {
  color: rgba(255, 255, 255, 1);
  font-family: "poppins_med";
  font-size: 56px;
}
.hero-container p {
  color: rgba(255, 255, 255, 1);
  font-family: "poppins";
  font-size: 18px;
}
.tag-01::before {
  content: url(../SVG/vector_02.svg);
  padding-right: 10px;
}
.tag-02::before,
.tag-03::before {
  content: url(../SVG/vector_03.svg);
  padding-right: 10px;
}
.tag-01,
.tag-02,
.tag-03 {
  color: rgba(255, 255, 255, 1);
  font-family: "poppins";
  font-size: 14px;
}
*:focus {
  outline: none;
}
.search-tags {
  padding-top: 55px;
  display: flex !important;
  align-items: center;
  justify-content: start;
  padding-left: 19px;
  gap: 25px;
}

.search {
  background-color: rgba(255, 255, 255, 1);
  border-radius: 50px;
  position: relative;
  height: 80px;
  display: flex !important;
  align-items: center;
  gap: 15px;
}

.search input {
  background: none !important;
  border: none !important;
}
.vertical {
  border-left: 1px solid rgba(228, 229, 232, 1);
  height: 32px;
}
.keyword-container,
.city-container {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 12px;
}
.keyword-container {
  margin-left: 30px;
}

.btn-search {
  position: absolute;
  right: 12px;
  border: none;
  color: rgba(255, 255, 255, 1);
  font-family: "Inter_med";
  font-size: 16px;
  border-radius: 47px;
  padding: 16px 32px !important;
  background-color: rgba(64, 228, 173, 1);
  padding: 10px;
}

.sug {
  font-family: "poppins";
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  padding-top: 12px;
  padding-left: 19px;
}
.sug a {
  text-decoration: none;
  color: rgba(255, 255, 255, 0.8);
}

a {
  text-decoration: none !important;
}

.tabs-container ul {
  background-color: rgba(64, 228, 173, 1);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}
.tabs-container a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: end;
  height: 178px;
  gap: 20px;
  font-family: "poppins_med";
  font-size: 14px;
  color: white !important;
  padding-bottom: 30px;
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  background: rgba(22, 120, 242, 1) !important;
  color: white !important;
  border: none !important;
  border-radius: 0 !important;
}

.rdv {
  padding: 10px;
}
.rdv h2 {
  text-align: center !important;
  font-family: "poppins_med";
  font-size: 50px;
  text-decoration: underline;
  color: rgba(22, 120, 242, 1);
  padding-top: 54px;
}
.tab-content {
  display: flex;
  justify-content: center;
}

.rdvc {
  min-width: 900px;
  margin-top: 80px;
  position: relative;
}
.vertical-line {
  border-left: 1px solid rgba(217, 217, 217, 1);
  height: 100%;
  left: 20px;
  top: 0;
  position: absolute;
}
.svg-ball {
  z-index: 1;
}
.section-01 {
  display: flex;
  align-items: center;
  gap: 25px;
  padding-left: 60px;
  padding-top: 10px;
}
.section-01 h4 {
  padding-top: 67px;
  color: black;
  text-decoration: none;
  font-family: "poppins_med";
  font-size: 20px;
  padding: 0 !important;
}
.section-01 p,
.cum p {
  max-width: 758px;
  padding-top: 25px;
  font-size: 15px;
  color: rgba(108, 135, 174, 1);
}
.info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 50px;
  padding-bottom: 100px;
  margin-top: 92px;
  width: 100%;
  position: absolute;
  max-width: 1920px;
  background-color: #f1f2f4;
  left: 50%;
  transform: translateX(-50%);
}
.info h2,
.cum h2 {
  font-size: 40px;
  text-decoration: none;
  color: black;
  padding-top: 100px;
  text-align: start !important;
}

.cum {
  padding-top: 150px;
  display: flex;
  gap: 137px;
  flex-direction: row-reverse;
}
.cum p {
  font-size: 18px;
  max-width: 529px;
}
.cum button {
  gap: 10px;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(64, 228, 173, 1);
  border-radius: 100px;
  width: 246px;
  height: 55px;
  color: white;
  margin-top: 32px;
  font-family: "poppins_med";
}

.footer {
  color: white;
  background: rgba(22, 120, 242, 1);
  width: 100%;
  margin-top: 181px;
  padding-top: 83px;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  padding-left: 200px;
}
.footer-section-01 {
  color: white;
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 50px;
}

.footer-section-01 p {
  font-family: "poppins";
  font-size: 15px;
  margin-top: 16px;
}
.footer-section-01 a {
  text-decoration: none !important;
  color: white;
  font-size: 12px;
  font-family: "poppins";
}
.footer-section-01 h4 {
  font-size: 14px;
  font-family: "poppins_bold";
}
.apdn,
.tvs,
.rf {
  display: flex;
  flex-direction: column;
}
.svn {
  width: 100%;
  padding-top: 50px;
}
.gradient {

  background: linear-gradient(45deg, rgba(58, 142, 246, 1), rgba(63, 218, 182, 1), rgba(128, 198, 174, 1));
  padding: 10px;
  border-radius: 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.gradient h2 { 
font-family: "poppins_med";
font-size: 32px;
padding: 0 !important;
margin: 0 !important;
text-decoration: none !important;
}
.gradient p { 
font-family: "poppins";
font-size: 16px;
color: rgba(3, 20, 50, 1);
}

.gradient button{
  gap: 10px;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 1);
  border-radius: 100px;
  width: 246px;
  height: 55px;
  color: rgba(61, 140, 239, 1);
  margin-top: 32px;
  font-family: "poppins_med";
  
  }


.svn h3 {
  width: 100%;
  font-family: "poppins";
  font-size: 14px;
}

.svn-icon {
  display: flex;
  gap: 12px;
}
.horizontal-line {
  border: 0.5px solid rgba(228, 229, 232, 1);
  width: 80%;
  display: flex;
  justify-content: center;
}
.droits{
  text-align: center;
  display: flex;
  justify-content: center;
  width: 80%;
  font-size: 12px;
  font-family: "poppins";
  padding: 28px ;
}

@media (max-width: 768px) {
  .cum {
    flex-direction: column;
    padding-top: 500px;
    justify-content: center;
    align-items: center;
  }
}
.header-container-mobile , .info-img-mobil{
  display: none;
}