/* Services List 02 Widget */
.services02-grid{
  display:grid;
  gap:16px;
}

.services02-card{
  /* transition variables with soft defaults */
  --mn-tr-dur: .3s;
  --mn-tr-ease: ease-out;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  text-align:center;
  background:#ffffff;
  color:#222;
  border-radius:18px;
  padding:18px 16px;
  box-shadow:0 6px 22px rgba(0,0,0,.06);
  transition:transform var(--mn-tr-dur) var(--mn-tr-ease), box-shadow var(--mn-tr-dur) var(--mn-tr-ease), background-color var(--mn-tr-dur) var(--mn-tr-ease), color var(--mn-tr-dur) var(--mn-tr-ease);
  min-height:120px;
}
.services02-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(0,0,0,.08);
}

.services02-icon{display:block;margin-bottom:10px;}
.services02-icon img{width:42px;height:42px;object-fit:contain;filter: none;}
.services02-icon-fallback{display:inline-flex;width:42px;height:42px;border-radius:50%;align-items:center;justify-content:center;background:#f3dbe0;color:#a3072a;font-weight:700;font-size:20px;}

.service02-title{display:block;font-size:14px;font-weight:600;color:inherit;}

/* Active/highlighted item like screenshot */
.services02-card.is-active{
  background:#a3072a; /* maroon */
  color:#fff;
}
.services02-card.is-active .services02-icon img{filter:brightness(0) invert(1);} 
.services02-card.is-active .services02-icon-fallback{background:rgba(255,255,255,.2);color:#fff;}

/* Responsive tweaks */
@media (max-width:768px){
  .services02-grid{gap:12px;}
  .services02-card{padding:14px 12px;}
  .services02-icon img,.services02-icon-fallback{width:36px;height:36px;}
  .service02-title{font-size:13px;}
}
