.lojaDestaque{
   position: relative;
   display: grid;
   grid-template-columns: minmax(0,1.55fr) minmax(240px,.75fr);
   width: min(1120px,100%);
   min-height: 330px;
   overflow: hidden;
   border: 1px solid rgba(255,255,255,.38);
   border-radius: 28px;
   color: #fff;
   background:
      radial-gradient(circle at 8% 12%, rgba(255,255,255,.2), transparent 27%),
      linear-gradient(125deg,#135f9e 0%,#218cbc 46%,#0faaa5 100%);
   box-shadow: 0 18px 46px rgba(19,95,158,.24);
}

.lojaDestaque::before,
.lojaDestaque::after{
   content: '';
   position: absolute;
   border: 2px solid rgba(255,255,255,.13);
   border-radius: 50%;
   pointer-events: none;
}

.lojaDestaque::before{
   top: -105px;
   right: 18%;
   width: 240px;
   height: 240px;
}

.lojaDestaque::after{
   bottom: -145px;
   left: 38%;
   width: 300px;
   height: 300px;
}

.lojaDestaqueConteudo{
   position: relative;
   z-index: 1;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
   padding: 38px 42px;
}

.lojaDestaqueSelo{
   display: inline-flex;
   align-items: center;
   gap: 8px;
   border: 1px solid rgba(255,255,255,.3);
   border-radius: 999px;
   padding: 7px 13px;
   font-size: .78rem;
   font-weight: 900;
   letter-spacing: .09em;
   text-transform: uppercase;
   background: rgba(255,255,255,.14);
   backdrop-filter: blur(5px);
}

.lojaDestaqueSelo svg{
   width: 21px;
   height: 21px;
   fill: currentColor;
}

.lojaDestaque h2{
   max-width: 680px;
   margin: 17px 0 9px;
   color: #fff;
   font-size: clamp(2rem,4vw,3.15rem);
   line-height: 1.05;
   text-align: left;
}

.lojaDestaqueConteudo > p{
   max-width: 680px;
   margin: 0;
   color: rgba(255,255,255,.9);
   font-size: 1rem;
   line-height: 1.55;
}

.lojaDestaqueBeneficios{
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
   margin: 18px 0 22px;
}

.lojaDestaqueBeneficios span{
   border-radius: 999px;
   padding: 6px 11px;
   color: #eaffff;
   font-size: .78rem;
   font-weight: 700;
   background: rgba(3,45,75,.22);
}

.lojaDestaqueBeneficios span::before{
   content: '\2713';
   margin-right: 6px;
   color: #facc15;
   font-weight: 900;
}

.lojaDestaqueBotao{
   display: inline-flex;
   align-items: center;
   gap: 12px;
   border-radius: 15px;
   padding: 13px 17px;
   color: #124f82;
   font-size: .95rem;
   font-weight: 900;
   text-decoration: none;
   background: #fff;
   box-shadow: 0 10px 24px rgba(4,47,78,.2);
   transition: transform .17s ease, box-shadow .17s ease;
}

.lojaDestaqueBotao span{
   font-size: 1.35rem;
   line-height: 1;
   transition: transform .17s ease;
}

.lojaDestaqueBotao:hover,
.lojaDestaqueBotao:focus-visible{
   outline: 0;
   box-shadow: 0 14px 30px rgba(4,47,78,.28);
   transform: translateY(-2px);
}

.lojaDestaqueBotao:hover span,
.lojaDestaqueBotao:focus-visible span{
   transform: translateX(4px);
}

.lojaDestaqueVisual{
   position: relative;
   z-index: 1;
   display: flex;
   min-width: 0;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 30px;
   text-align: center;
   background: rgba(3,45,75,.14);
}

.lojaDestaqueIcone{
   display: grid;
   width: 118px;
   height: 118px;
   place-items: center;
   border: 1px solid rgba(255,255,255,.48);
   border-radius: 34px;
   background: #0b4f73;
   box-shadow: 0 18px 34px rgba(4,47,78,.22);
   transform: rotate(-4deg);
}

.lojaDestaqueIcone img{
   width: 68px;
   height: 68px;
   object-fit: contain;
}

.lojaDestaqueVisual strong{
   margin-top: 19px;
   color: #fff;
   font-size: 1.45rem;
   line-height: 1.05;
}

.lojaDestaqueVisual small{
   margin-top: 7px;
   color: rgba(255,255,255,.78);
   font-size: .76rem;
}

.lojaDestaqueEstrela{
   position: absolute;
   color: #facc15;
   filter: drop-shadow(0 3px 5px rgba(4,47,78,.2));
}

.lojaDestaqueEstrela1{
   top: 35px;
   right: 42px;
   font-size: 2.2rem;
}

.lojaDestaqueEstrela2{
   bottom: 42px;
   left: 40px;
   font-size: 1.4rem;
}

@media (max-width: 760px){
   .lojaDestaque{
      grid-template-columns: 1fr;
   }

   .lojaDestaqueConteudo{
      padding: 30px 26px;
   }

   .lojaDestaqueVisual{
      display: none;
   }
}

@media (max-width: 480px){
   .lojaDestaque{
      border-radius: 22px;
   }

   .lojaDestaqueConteudo{
      padding: 25px 19px;
   }

   .lojaDestaque h2{
      font-size: 1.75rem;
   }

   .lojaDestaqueBotao{
      width: 100%;
      justify-content: center;
      text-align: center;
   }
}
