/*=============== OEM ===============*/

.oem{
   padding:100px 0;
   position:relative;
}

.oem__container{
   width: 100%;
   max-width:1300px;
   margin:auto;

   background:rgba(255,255,255,.65);

   backdrop-filter:blur(12px);

   border-radius:40px;

   padding:70px;

   display:grid;
   grid-template-columns:1.1fr .9fr;
   align-items:center;
   gap:80px;

   box-shadow:
   0 20px 60px rgba(0,0,0,.05);
}

/* subtitle */

.oem__subtitle{
   display:block;

   font-size:14px;
   font-weight:700;

   letter-spacing:2px;

   color:#4ea56b;

   margin-bottom:18px;
}

/* title */

.oem__title{
   font-size:72px;
   line-height:1;

   color:#101820;

   margin-bottom:24px;
}

.oem__title span{
   display:block;
   color:#57b46c;
}

/* line */

.oem__line{
   width:90px;
   height:5px;

   background:#57b46c;

   border-radius:50px;

   margin-bottom:30px;
}

/* text */

.oem__text{
   color:#666;
   line-height:1.9;
   font-size:18px;

   margin-bottom:22px;

   max-width:700px;
}

/* FEATURES */

.oem__features{
   margin-top:35px;

   display:grid;
   grid-template-columns:repeat(2,1fr);
   gap:18px;
}

.feature{
   background:white;

   padding:20px;

   border-radius:20px;

   display:flex;
   align-items:center;
   gap:15px;

   box-shadow:
   0 10px 25px rgba(0,0,0,.05);

   transition:.3s;
}

.feature:hover{
   transform:translateY(-6px);
}

.feature__icon{
   width:55px;
   height:55px;

   display:flex;
   align-items:center;
   justify-content:center;

   background:#edf6ee;

   border-radius:50%;

   color:#57b46c;
   font-size:25px;
}

.feature h4{
   font-size:16px;
   margin-bottom:2px;
   color:#555;
}

.feature span{
   font-size:20px;
   font-weight:700;
   color:#222;
}

/* IMAGE */

.oem__image{
   position:relative;
   display:flex;
   justify-content:center;
   align-items:center;
}




.oem__glow{
   position:absolute;

   width:550px;
   height:550px;

   background:#8fd49d;

   opacity:1;

   border-radius:50%;

   filter:blur(70px);

   z-index:1;
}

.oem__image img{
   width:100%;
   max-width:650px;
   height:auto;

   position:relative;
   z-index:2;

   display:block;

   filter:drop-shadow(
      0 40px 40px rgba(0,0,0,.15)
   );
}

/* ===================================== */
/* OEM RESPONSIVE */
/* ===================================== */

/* =========================
   MACBOOK / LAPTOP
========================= */
@media screen and (max-width:1200px){

   .oem{
      padding:90px 40px;
   }

   .oem__container{
      padding:50px;
      gap:50px;
   }

   .oem__title{
      font-size:58px;
   }

   .oem__image img{
      max-width:500px;
   }

}

/* =========================
   TABLET
========================= */
@media screen and (max-width:992px){

   .oem{
      padding:80px 30px;
   }

   .oem__container{
      grid-template-columns:1fr;
      gap:60px;

      padding:50px 40px;
   }

   .oem__content{
      text-align:center;
   }

   .oem__line{
      margin:0 auto 25px;
   }

   .oem__text{
      max-width:100%;
   }

   .oem__features{
      grid-template-columns:repeat(2,1fr);
   }

   .oem__image{
      order:-1;
   }

   .oem__image img{
      max-width:450px;
   }

}

/* =========================
   MOBILE
========================= */
@media screen and (max-width:576px){

   .oem{
      padding:70px 20px;
   }

   .oem__container{
      padding:30px 20px;
      border-radius:25px;
      gap:40px;
   }

   .oem__subtitle{
      font-size:12px;
      letter-spacing:1px;
   }

   .oem__title{
      font-size:36px;
      line-height:1.1;
   }

   .oem__text{
      font-size:15px;
      line-height:1.8;
      text-align:left;
   }

   .oem__features{
      grid-template-columns:1fr;
      gap:14px;
      text-align: left;
   }

   .feature{
      padding:15px;
      border-radius:16px;
   }

   .feature__icon{
      width:45px;
      height:45px;
      font-size:20px;
   }

   .feature h4{
      font-size:13px;
   }

   .feature span{
      font-size:16px;
   }

   .oem__image img{
      max-width:280px;
   }

   .oem__glow{
      width:220px;
      height:220px;
      filter:blur(50px);
   }

}

/* =========================
   VERY SMALL PHONE
========================= */
@media screen and (max-width:375px){

   .oem__title{
      font-size:30px;
   }

   .oem__text{
      font-size:14px;
   }

   .oem__image img{
      max-width:240px;
   }

}