White space between parent and child div on some devices/browsers

This white space is not visible on all devices, I don't know if it's related to the resolution or the browser [...] The problem seems to occur more often on mobile than on PC

It's a rounding discrepancy. Probably related to this line:

font-size: 1.75vw;

The browser on each device is calculating a number of pixels - on some devices the browser ends up with a result which is 1px less than on other devices.

The fix (and I appreciate this will require some design thinking) is to use a more explicit value which is less likely to end up with a possible fraction of a pixel (which then needs to be rounded up or down).

I'd be tempted to start by giving .rating:

• an explicit height; and
• an explicit line-height

this could be a half pixel, which is being behaved differently with each browser, it could be seen when zooming in, sometimes it couldn't

https://www.simonbattersby.com/blog/browsers-and-fractional-pixels/

if you cannot remove it, hide it:

.parent {
  border: 2px solid;
  border-color: rgb(0, 0, 0);
  height: 80px;
}

.child {
  height: 80px;
  background-color: rgb(0, 0, 0);
  box-shadow: 0 0 0 1px rgb(0, 0, 0); /* a tiny box-shadow to cover the gap */
}

<div class="parent">
  <div class="child"></div>
</div>

You can to use outline instead of border

.parent {
  outline: 2px solid;
  outline-color: rgb(0, 0, 0);
  height: 80px;
}

.child {
  height: 80px;
  background-color: rgb(0, 0, 0);
}

<div class="parent">
  <div class="child"></div>
</div>

.parent {
   height: 80px;
}

.child {
   height: 80px;
   background: black;
}

<div class="parent">
  <div class="child"></div>
</div>

That's more then enough

Your code is not enough to show your confuse.

It should contain global CSS settings, like resized font-size, line-height, div's display attribute (like inline-block) ...

And in odd number DPR mobile screen, with the global font settings, this appearance will be more common.

Check and resize global or root settings.