.services {
    margin-top: 3rem;   
}
.services .container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;    
}
.service-card{
  display:flex;
  flex-direction:column;
  background:#070226;              /* primary-900 */
  border:1px solid #1A0A5C;        /* primary-700 */
  border-radius:12px;
  overflow:hidden;
  width:100%;
  max-width:340px;
  font-family:'Inter', sans-serif;
  transition:border-color .15s ease, transform .15s ease;
}

.service-card:hover{
  border-color:#4321AD;            /* primary-500 */
  transform:translateY(-2px);
}

.service-card__img{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
  border-bottom:1px solid #1A0A5C; /* primary-700 */
}

.service-card__body{
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.service-card__title{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:18px;
  line-height:1.3;
  color:#fff;
  margin:0;
}

.service-card__text{
  font-size:13px;
  line-height:1.55;
  color:#B9B4CF;                   /* neutral-300 */
  margin:0;
}

/* ===== TABLET (≥600px) ===== */
@media (min-width:600px){
  .services .container{flex-direction:row;flex-wrap:wrap;justify-content:space-between;}
  .service-card__img{height:200px;}
  .service-card__body{padding:24px;gap:12px;}
  .service-card__title{font-size:19px;}
  .service-card__text{font-size:14px;}
}

/* ===== DESKTOP (≥769px) ===== */
@media (min-width:769px){
  .service-card{max-width:360px;border-radius:14px;}
  .service-card__img{height:220px;}
  .service-card__body{padding:28px;}
  .service-card__title{font-size:21px;}
}