@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  /* border: 1px solid red; */
}

:root{
  --bg-primary: #E5E3DF
  --bg-secondary: #F9F7F3;
  --bg-gradient:linear-gradient(145deg, #F9F7F3 0%, #E5E3DF 60%, #F9F7F3 100%);
  --bg-gradient:linear-gradient(145deg, #F9F7F3 0%, #E5E3DF 100%);
  --bg-gradient:linear-gradient(to right, #F9F7F3 0%, #E5E3DF 100%);
  --bg-gradient2:linear-gradient(145deg, #E5E3DF 0%, #F9F7F3 100%);
  --bg-gradient2:linear-gradient(145deg, #1C2B4A 0%, #32C2C8 100%);
  --bg-gradient2:linear-gradient(to right bottom,#32C2C8 0%, #1C2B4A 80%);
  --bg-gradient-limo:linear-gradient(135deg, #9AD372, #f6fa0d);
  --color-secondary: #333;
  --color-accent: #ff6347;
  --color-logo: #D6B253;
  --color-logo2: #8B6A2D;
  
  --color-dark: #1a1f2b;
  --color-dark: #121212;
  --color-light: #e9e9e9;
  --color-light: #fffffd;
  --color-light: #fffefb;
  --color-light2: #ecefec;
  --ff-primary: 'Playfair Display', serif;
  --ff-primary: 'Merriweather', serif;
  --ff-primary: 'EB Garamond', serif;
  --ff-secondary: 'Urbanist', sans-serif;
  /* --ff-secondary: 'Poppins', sans-serif; */
}
html{
  font-size: 62.5%;

}



body{
  text-rendering: optimizeLegibility;
  font-optical-sizing: auto;
  font-family: var(--ff-secondary);
  color: var(--color-light);
  color: var(--color-dark);
  width: 100%;
  height: 100%;
  /* background-color: #0056d2; */
  background-color: var(--color-light);
  overflow-x: hidden;
  
  font-size: 1.6rem;
  transition: all 3s;
  position: relative;
  
}

body::before{
  /* background-color: #002FA7; */
  /* background-color: #040240; */
  /* background-color: #ffffff; */
  /* background-color: #040240; */
 
  /* background-image: url(http://transparenttextures.com/patterns/otis-redding.png); */
  z-index: 1;
pointer-events: none;
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: .4;
}

a{
    text-decoration: none;
    color: inherit;
}

section{
  /* display: flex;
  flex-direction: column;
  align-items: center; */
  /* justify-content: center; */
  padding: 10rem 0;
}

.container.container_hero{
  width: 99%;
  width: 100%;
  margin: 0 auto;
}
.container{
  width: 85%;
  margin: 0 auto;
  padding: 0 3rem;
}

.btn_primary{
  /* z-index: 20; */
  /* position: relative; */
  font-size: 1.8rem;
  padding: 1rem 2rem;
  border-radius: 3rem;
  border: 1px solid #8B6A2D;
  color: var(--color-dark);
  /* background-color: transparent; */
  background:#8B6A2D;
  background:linear-gradient(to right top, #D6B253 0%, #8B6A2D 100%);
  
  /* background-color:var(--bg-gradient); */
  /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.9); */
  /* background: linear-gradient(
    145deg,
    /* #9AD372, */
    /* #f6fa0d,
    #f6fa0d,
    #e9ae0d,
    #e9ae0d,
    #D6B253,
    #D6B253, */
   
    /* #f6fa0d, */
    /* #f6fa0d,
    #9AD372
  ); */ 

  

  display: flex;
  align-items: center;
  justify-content: center;
  display: inline-block;

}


.btn_primary:hover{
  background-color: #f9f7f3;
  background: var(--bg-gradient);
  color: #232221;
  transition: all 0.3s ease-in-out;
}

.btn_sec{
  margin-left: 3rem;
  display: inline-block;
   font-size: 1.8rem;
   color: var(--color-light);
   background: transparent;
   border: none;
   border-bottom: 2px solid var(--color-light);
   padding-bottom: .5rem;
}


.btn_right{
  position: fixed;
  right: 10px;
  top: 50%;
  /* display: flex;
  flex-direction: column;
  gap: 1rem; */
  transform: translateY(-50%);
  mix-blend-mode: difference;
  z-index: 20;
  
}

.btn_right i{
  font-size: 3rem;
  padding: 1rem 1.5rem 1rem 1.5rem;
  background: var(--bg-gradient-limo);
  border-bottom-left-radius: 10px;
  border-top-left-radius: 10px;
  /* display: inline-block; */
  margin-bottom: 1rem;
   /* transform: translateX(0); */
  /* transition: transform 5s ease;
  animation: slideOutIn 5s ease infinite; */
}







/* /////////////////// */
/* /////////////////// */
/* LENIS */
html.lenis,
html.lenis body {
  height: 100%;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}
/* ////////////// */
/* ////////////// */
/* TYPOGRAFI */



.subheading{
  font-family: var(--ff-primary), serif;
  font-weight: 500;
  font-size: 1.6rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  z-index: 1;
  margin-bottom: 2rem;
  /* position: relative; */
  /* display: flex; */
}

.subheading img{
  width: 25px;
  height: 25px;
  margin-bottom: -.7rem;
  opacity: .9;
  margin-right: .5rem;
  
}


.title_primary{
  font-family: var(--ff-primary), serif;
  font-weight: 600;
  line-height: 140%;
  
  font-size: 4.5rem;
  letter-spacing: 1px;
  margin-bottom: 4rem;
}

.title_secondary{
  font-family: var(--ff-primary), serif;
  font-weight: 600;
  font-size: clamp(2rem,2vw, 3vw);
  font-size: 3rem;
  letter-spacing: 1px;
  line-height: 140%;
  margin-bottom: 3rem;
}

p.description{
  font-family: var(--ff-secondary), serif;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1;
  line-height: 140%;
  letter-spacing: .5px;
}

p.description:not(:last-child) {
  margin-bottom: 1.25rem;
}


.marking{
  background: linear-gradient(145deg, #9AD372, #f6fa0d);
  clip-path: polygon(5% 0%, 100% 0%, 95% 100%, 0% 100%);
  padding: 0 .5rem;
  position: relative;
  /* color: black; */


}

.sect_team .marking::before{
  content: '';
  position: absolute;
  top: 0%;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0000000b;
}

.clip {

  text-shadow: none !important;
  background: linear-gradient(
    145deg,
    /* #9AD372, */
    #f6fa0d,
    #e9ae0d,
    #f6fa0d,
    #e9ae0d,
    #D6B253,
    /* #00e200, */
    #D6B253,
    /* #00e200, */
    /* #9AD372, */
    #9AD372
  );

  

  
  background-size: 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;

  /* animation: gradient 40s linear infinite; */
}
.clip {

  text-shadow: none !important;
  background: linear-gradient(
    145deg,
    /* #9AD372, */
    #f6fa0d,
    #e9ae0d,
    #f6fa0d,
    #e9ae0d,
    #D6B253,
    /* #00e200, */
    #D6B253,
    /* #00e200, */
    /* #9AD372, */
    #9AD372
  );

  

  
  background-size: 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;

  /* animation: gradient 40s linear infinite; */
}

@keyframes gradient {
  0% {
    background-position: 200%;
  }
  100% {
    background-position: 0%;
  }
}


.ml{
  /* margin-left: 2rem; */
}



@media (max-width: 1570px){
  section{
    padding: 8rem 0;
  }

  .title_secondary {
  /* line-height: 120%;
  font-size: 2.7rem; */
}
}

@media screen and (max-width: 900px){
  .title_primary{
    line-height: 120%;
    font-size: 4rem;
  }

  .container,
  .sect_steps .container{
  padding: 3rem 3rem !important;
  border-radius: 2rem;
}

 .title_secondary {
  line-height: 120%;
  font-size: 3.5rem;
}

  .container {
    width: 98% !important;
  }
}

@media screen and (max-width: 500px) {

p.description {
  
  line-height: 120%;
}

.title_primary{
    font-size: 4rem;
     
    line-height: 105%;
  }

 

.subheading{
  margin-bottom: 3rem;
}

 section {
    padding: 3rem 0 ;
  }



   .title_secondary {
    line-height: 110%;
    font-size: 2.6rem;
  }



  .btn_right{
  position: fixed;
  right: 0px;
  top: 50%;
  /* display: flex;
  flex-direction: column;
  gap: 1rem; */
  transform: translateY(-50%);
  mix-blend-mode: difference;
  z-index: 10;
  
}

.btn_right i{
  font-size: 2rem;
  padding: 1rem;
  /* background: var(--bg-gradient-limo); */
  background: white;
  color: black;
  border-bottom-left-radius: 10px;
  border-top-left-radius: 10px;
  /* display: inline-block; */
  margin-bottom: 1rem;
   /* transform: translateX(0); */
  /* transition: transform 5s ease;
  animation: slideOutIn 5s ease infinite; */
}


}