.wehoffer__wrappper{
  margin-top: var(--space-btw);
  padding: 3rem 3rem 4rem 3rem;
  background: url(../media/offer/gradiente.png) no-repeat center center;
  background-size: cover;
}
.weoffer__container{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.weoffer__title{
  width: 100%;
  text-align: center;
}
.weoffer__title h2{
  color: white;
  text-transform: uppercase;
  font-weight: 400;
  font-size: var(--fs-xs);
  text-align: center;
  font-weight: bolder;
}
.weoffer__title p{
  color: var(--blue-one);
}
.weoffer__section{
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 2rem;
  margin: 3rem 0 5rem 0;
}
.weoffer__article{
  width: calc(100% / 4 - 1rem);
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 3rem;
  border-radius: var(--borders-one);
}
.weoffer__article-img{
  width: 100px;
  display: block;
  filter: invert(100%);
}
.weoffer__article h2{
  color: var(--blue-one);
  font-size: var(--fs-text);
  margin-top: 1rem;
  font-weight: 800;
  letter-spacing: 3px;
  text-align: center;
  font-family: var(--ff-title);
}
.weoffer__article p{
  color: white;
  font-size: 0.9rem;
  margin-top: 0.5rem;
  text-align: center;
}
.weoffer__link a{
  color: var(--grey-two);
  font-weight: 800;  
  font-family: var(--ff-title);
  background: var(--blue-one);
  padding: 1rem 2rem;
  border-radius: var(--borders-one);
  margin-top: 1rem;
  letter-spacing: 2px;
  font-weight: 800;
}
.weoffer__link a:hover{
  background: var(--blue-two);
  color: white;
}



/***************KEYFRAMES****************/



/***************************************/



/*************MEDIAQUERIES**************/

@media (max-width: 1483px) {

}

@media (max-width: 1280px) {

}

@media (max-width: 1150px) {
  .weoffer__section{
    flex-wrap: wrap;
  }
  .weoffer__article{
    width: calc(100% / 2 - 1rem);
  }

}

@media (max-width: 950px) {/*2 REM padding*/
  .wehoffer__wrappper{
    padding: 3rem 2rem 4rem 2rem;
  }
}

@media (max-width: 768px) {
  
}

@media (max-width: 576px) { /*1 REM padding*/
  .weoffer__article{
    width: 100%;
  }
  
}

@media (max-width: 480px) {
  .weoffer__title h2{
    font-size: 2.4rem;
  }
}

@media (max-width: 455px) {
  .weoffer__title h2{
    font-size: 2rem;
  }
}

@media (max-width: 350px) {
  
}

/**************************************/