/* --- Realistic Organic Human Highlighter --- */
.real-human-marker {
  position: relative;
  display: inline-block;
  padding: 1px 12px 3px 10px;
  z-index: 1;
}

.real-human-marker::after {
  content: "";
  position: absolute;
  left: -4px;
  bottom: 1px;
  width: calc(100% + 14px);
  height: 65%;
  /* Insaan ke hath ki thartharahat (jitter) ko imitate karne ke liye dynamic multi-layered design */
  background: rgba(255, 77, 77, 0.22);
  /* Computer jesa perfect daira nahi, balke tedha medha marker stroke corner cutouts */
  clip-path: polygon(
    0% 20%, 15% 5%, 45% 18%, 75% 2%, 100% 15%, 
    98% 85%, 82% 95%, 50% 80%, 20% 98%, 2% 75%
  );
  /* Ink bleeding edges ko simulate karne ke liye edge blur texture blur */
  filter: blur(0.6px);
  /* Marker chalate hue halka sa angle rotation tilt */
  transform: rotate(-1.4deg) skewX(-3deg);
  z-index: -1;
  pointer-events: none;
}

/* --- Chaotic Multi-Stroke Sketchy Underline --- */
.real-human-underline {
  position: relative;
  display: inline-block;
  padding-bottom: 2px;
  z-index: 1;
}

.real-human-underline::after {
  content: "";
  position: absolute;
  left: -2px;
  bottom: -5px;
  width: calc(100% + 6px);
  height: 4px;
  background: #ff4d4d;
  /* Double overlapping strokes: aisa lagta hai jaise kalam ko do dafa ghaseeta gaya ho */
  box-shadow: 
    3px 2px 0px -0.5px rgba(255, 77, 77, 0.75), 
    -4px 1.5px 0px -0.8px rgba(255, 77, 77, 0.5);
  /* Tezi se line khinchne par jo asar ata hai uske liye wave adjustments */
  border-radius: 95% 4% 92% 5% / 4% 95% 6% 95%;
  transform: rotate(0.6deg);
  z-index: -1;
  pointer-events: none;
}