.featured__subtitle{
      font-weight: 400;
      font-size: var(--size-xs);
      color: var(--clr-indigo);
}
.featured__title{
      font-size: var(--size-2xl);
      color: var(--clr-light);
}

.featured__wrapper{
      display: flex;
      align-items: center;
      gap: 1rem;
}
.featured__link{
      width: var(--size-2xl);
      height: var(--size-2xl);
}

.featured__description{
      max-width: 60ch;
      color: var(--clr-slate600);
      font-size: var(--size-sm);
      margin: 1rem 0;
}

.featured__label{
      font-size: var(--size-base);
      margin-bottom:0.25em ;
}

.featured__tech-stack{
      padding: 0;
      list-style: none;
}

.featured__info{
      font-size: var(--size-sm);
      color: var(--clr-slate600);
}

.featured__label-wrapper{
      display: flex;
      flex-wrap: wrap;
      gap:1rem;
}

.featured__label-wrapper div{
      flex:1;
      min-width: 250px;      
}

.featured__img-wrap{
      position: relative;
      /* width: 40rem; */
}

.feature__img-container{
 margin-top: 1rem;
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 grid-gap: 1rem;

}

.featured__img-wrap::after{
      content: '';
      background-color: rgba(0, 0, 0, 0.5);
      height: 100%;
      width: 100%;
      position: absolute;
      top:0;
      left:0;
      z-index: 1;
      transition: background-color 0.3s;
}

.featured__img-wrap:hover::after{
      background-color: rgba(79, 70, 229, 0.1);
}


/* xs */
@media (min-width:475px) {
      .featured__subtitle{
            font-size: var(--size-base);
      }
      .featured__title{
            font-size: var(--size-3xl);
      }
      .featured__link{
            width: var(--size-3xl);
            height: var(--size-3xl);
      }
      .featured__description{
            font-size: var(--size-base);
            margin: 1.5rem 0;
      }
      .featured__label{
            font-size: var(--size-lg);
      }
      .featured__info{
            font-size: var(--size-base);
      }
      .feature__img-container{
            margin-top: 1.5rem;
            grid-gap: 1.5rem;           
      }      
}

/* sm */
@media (min-width:640px) {      
      .feature__img-container{
            grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
            grid-gap: 1rem;
           
           }
}

/* me */
@media (min-width:768px) {      
}

/* lg */
@media (min-width:1024px) {
      .featured__subtitle{
            font-size: var(--size-lg);
      }
      .featured__title{
            font-size: var(--size-4xl);
      }
      .featured__link{
            width: var(--size-4xl);
            height: var(--size-4xl);
      }
      .featured__description{
            font-size: var(--size-lg);
      }
      .featured__label{
            font-size: var(--size-xl);
      }
      .featured__info{
            font-size: var(--size-lg);
      }
}

/* xL */
@media (min-width:1280px) {
      .featured__subtitle{
            font-size: var(--size-xl);
      }
      .featured__title{
            font-size: var(--size-5xl);
      }
      .featured__link{
            width: var(--size-5xl);
            height: var(--size-5xl);
      }
      .featured__description{
            font-size: var(--size-xl);
            margin: 2rem 0;
      }
      .featured__label{
            font-size: var(--size-2xl);
      }
      .featured__info{
            font-size: var(--size-xl);
      }
      .feature__img-container{
            margin-top: 2rem;
            grid-gap: 2rem;           
      }
            
}

/* 2xL */
@media (min-width:1536px) {
}
