/* Serial numbering for Abdul Karim portfolio collections */
.serial-card {
  position: relative;
}

.serial-badge {
  position: absolute;
  top: -12px;
  left: -12px;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  border: 1px solid rgba(251, 191, 36, 0.7);
  background: rgba(2, 6, 23, 0.96);
  color: rgb(251, 191, 36);
  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.35), 0 0 0 4px rgba(2, 6, 23, 0.72);
  font-size: 11px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
}

#experience .serial-card {
  overflow: visible;
}

#experience .serial-badge {
  left: 12px;
  top: -14px;
}

#education .serial-card,
#achievements .serial-card,
#training .serial-card {
  overflow: visible;
}

/* Keep the number readable without fighting the content on narrow screens. */
@media (max-width: 640px) {
  .serial-badge {
    width: 30px;
    height: 30px;
    top: -10px;
    left: -8px;
    font-size: 10px;
    box-shadow: 0 6px 18px rgba(2, 6, 23, 0.32), 0 0 0 3px rgba(2, 6, 23, 0.68);
  }

  #experience .serial-badge {
    top: -12px;
    left: 10px;
  }
}