section.intro {
     height: 35vh;
     background-size: cover;
     background-position: center center;
     display: flex;
     justify-content: center;
     align-items: center;
     /* background-attachment: fixed; */
     flex-direction: column;
     position: relative;
 }

 /*
section.intro.w-link {
  cursor: pointer;
}

section.intro .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: rgba(0, 0, 0, .6);
}

section.intro h1 {
  z-index: 10;
  color: #fff;
  font-size: 72px;
  letter-spacing: 4px;
  font-weight: bold;
}

section.intro p.phrase {
  display: block;
  margin-top: 5px;
  font-size: 28px;
  text-align: center;
  letter-spacing: 8px;
  color: #fff;
  z-index: 10;
} */

 section.intro h2.title {
     font-weight: 600;
     font-size: 40px;
     color: #000;
     margin: 0;
     line-height: 40px;
 }

 section.intro h2.title span {
     background: linear-gradient(to right, #498d8c 0%, #2d6592 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     font-weight: bold;
 }

 section.intro .text {
     margin-top: 15px;
     color: #fff;
     font-weight: 100;
     font-size: 18px;
     margin-bottom: 2.5px;
 }

 section.intro .btn-buy {
     padding: 5px 15px;
     background-color: #fff;
     color: #022539;
     font-size: 20px;
     /* margin-bottom: 10vh; */
 }

 section.top-products {
     background-position: center;
     background-size: 100%;
     background-color: #fff;
     padding: 40px 0;
 }

 section.top-products h2.title {
     color: #fff;
     text-transform: uppercase;
     font-weight: bold;
     font-size: 36px;
     margin-bottom: 20px;
     text-align: center;
 }

 section.top-products .product {
     /* width: 21%;
   min-width: 300px;
   max-width: 600px; */
     flex: 1 0 21%;
     text-align: left;
     margin-bottom: 20px;
     text-decoration: none;
 }

 section.top-products .product .product_wrapper {
     display: block;
     width: 320px;
     margin: 0 auto;
     background-color: #eaeaea;
     position: relative;

     overflow: hidden;
     padding-bottom: 7.5px;
     text-decoration: none;

     border-radius: 15px;

     background:
         linear-gradient(#eaeaea, #eaeaea) padding-box,
         linear-gradient(to right, #498d8c, #2d6592) border-box;
     border: 4px solid transparent;
 }


 section.top-products .product .photo_wrapper {
     position: relative;
 }

 section.top-products .product .photo {
     width: 100%;
     height: 400px;
     object-fit: cover;
     z-index: 1;
 }

 section.top-products .product .second_photo {
     z-index: 2;
     object-fit: cover;
     width: 100%;
     height: 100%;
     top: 0;
     right: 0;
     bottom: 0;
     position: absolute;
     left: 0;
     opacity: 0;
     transition: opacity .25s ease;
 }


 section.top-products .product .name {
     margin-top: 10px;
     color: #000 !important;
     font-size: 18px;
     margin-bottom: 0;
     padding-left: 20px;
 }

 section.top-products .product .price {
     color: #000;
     margin-bottom: 0;
     font-size: 16px;
     font-weight: 500;
     padding-left: 20px;
 }

 section.top-products .products {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
     flex-wrap: wrap;
 }

 section.top-products .product .product_wrapper:hover .second_photo {
     opacity: 1;
 }

 section.categories {

     height: 700px;

 }

 section.info {
     height: 700px;
 }

 section.categories .content,
 section.info .content {
     overflow: hidden;
     height: 100%;
     width: 100%;
     position: relative;
     display: flex;
     justify-content: center;
     align-items: center;
     text-decoration: none !important;
     flex-direction: column;
 }

 section.categories .content .desc {
     color: #fff;
     font-size: 18px;
     margin: 0;
     z-index: 2;
     font-weight: 100;
 }

 section.categories .content .title {
     margin-bottom: 0px;
 }

 section.categories .content .title {
     z-index: 2;
     color: #fff;
     text-align: center;
     font-size: 60px;
     font-weight: bold;
 }

 section.info .content .title {
     z-index: 2;
     color: #fff;
     text-align: center;
     font-size: 40px;
     line-height: 39px;
     font-weight: bold;
     text-shadow: 2px 2px rgb(77, 77, 77);
 }

 section.categories .image,
 section.info .image {
     overflow: hidden;
     width: 100%;
     height: 100%;
     position: absolute;
     background-size: cover;
     background-position: center;
     transition: .8s ease all;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     z-index: 0;
 }

 section.categories .content:hover>.image,
 section.info .content:hover>.image {
     transform: scale(1.1);
 }

 section.categories .overlay,
 section.info .overlay {
     overflow: hidden;
     width: 100%;
     position: absolute;
     top: 0;
     background-color: rgba(0, 0, 0, .3);
     right: 0;
     bottom: 0;
     left: 0;
     z-index: 1;
 }


 @media screen and (max-width: 992px) {
     section.top-products {
         background-size: 250%;
     }

     section.intro {
         height: 30vh;
     }

     /* section.intro h1 {
     font-size: 40px;
   } */

     section.intro h2.title {
         font-size: 27px;
         line-height: 30px;
     }

     section.intro p.phrase {
         font-size: 22px;

     }

     section.categories,
     section.info {
         height: auto;
     }

     section.categories .content,
     section.info .content {
         height: 300px;
     }

     section.top-products .products {
         justify-content: center;
     }

     section.categories .content .title,
     section.info .content .title {
         font-size: 40px;
     }

     section.top-products h2.title {
         font-size: 24px;
     }
 }