body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  gap: 2rem;
  font-family: monospace;
  line-height: 2;
}

.beer-with-path-parent,
.beer-with-shape-parent {
  overflow: hidden;
  resize: horizontal;
  border: 1px solid red;
  width: 80px;
  aspect-ratio: 80 / 87;
  position: relative;
}

.beer-with-path {
  background: red;
  inset: 0;
  position: absolute;
  clip-path: path(
    "M3.51,19.36c-1.33-1.71-1.92-3.31-1.92-5.17,0-5.51,5.34-9.98,11.9-9.98,1.71,0,3.37.3,4.9.87C21.15,1.92,25.83,0,30.95,0s9.8,1.92,12.56,5.07c1.52-.57,3.19-.87,4.9-.87,6.56,0,11.9,4.48,11.9,9.98,0,1.87-.6,3.47-1.92,5.17-.3.39-.76.61-1.25.61H4.76c-.49,0-.95-.22-1.25-.6h0ZM77.77,36.14v18.18c0,5.93-4.82,10.75-10.75,10.75h-8.3v7.28c0,1.01.41,2,1.12,2.71,1.3,1.3,2.06,3.11,2.06,4.95v.27c0,3.86-3.14,7.01-7.01,7.01H7.01c-3.86,0-7.01-3.14-7.01-7.01v-.27c0-1.85.75-3.65,2.06-4.95.71-.71,1.12-1.7,1.12-2.71V26.98c0-.87.71-1.59,1.59-1.59h62.26c5.92,0,10.75,4.82,10.75,10.75h0ZM25.4,38.09c0-1.75-1.42-3.17-3.17-3.17s-3.17,1.42-3.17,3.17v30.16c0,1.75,1.42,3.17,3.17,3.17s3.17-1.42,3.17-3.17v-30.16ZM42.85,38.09c0-1.75-1.42-3.17-3.17-3.17s-3.17,1.42-3.17,3.17v30.16c0,1.75,1.42,3.17,3.17,3.17s3.17-1.42,3.17-3.17v-30.16ZM71.42,36.14c0-2.43-1.98-4.4-4.4-4.4h-8.3v26.98h8.3c2.43,0,4.4-1.98,4.4-4.4v-18.19Z"
  );
}

.beer-with-shape {
  inset: 0;
  position: absolute;
  clip-path: shape(
    evenodd from 4.510892% 22.182055%,
    curve by -2.469431% -5.927258% with -1.704047% -1.963632% / -2.469431% -3.790924%,
    curve by 15.3066% -11.436578% with 0% -6.309027% / 6.867344% -11.436578%,
    curve by 6.295918% 0.999949% with 2.193841% 0% / 4.336743% 0.345454%,
    curve by 16.152311% -5.818168% with 3.551005% -3.618125% / 9.571441% -5.818168%,
    curve by 16.152311% 5.809053% with 6.581631% 0% / 12.60185% 2.200043%,
    curve by 6.295918% -0.999949% with 1.959175% -0.654544% / 4.102077% -0.999949%,
    curve by 15.3066% 11.436578% with 8.438712% 0% / 15.3066% 5.136375%,
    curve by -2.469431% 5.927258% with 0% 2.145449% / -0.765297% 3.972742%,
    curve by -1.612183% 0.700003% with -0.387753% 0.445458% / -0.979588%
      0.700003%,
    hline by -67.345557%,
    curve by -1.612183% -0.690907% with -0.63265% 0.009091% / -1.224484% -0.254545%,
    close,
    move by 95.489108% 19.218378%,
    vline by 20.827101%,
    curve by -13.816538% 12.318031% with 0% 6.790868% / -6.204055% 12.318031%,
    hline by -10.673368%,
    vline by 8.336368%,
    curve by 1.438796% 3.109035% with 0% 1.154518% / 0.53061% 2.290904%,
    curve by 2.642818% 5.672714% with 1.673462% 1.490905% / 2.642818% 3.563628%,
    vline by 0.30909%,
    curve by -9.010138% 8.027229% with 0% 4.427238% / -4.040799% 8.027229%,
    hline by -61.571433%,
    curve by -9.010138% -8.027229% with -4.969339% 0% / -9.010138% -3.599991%,
    vline by -0.30909%,
    curve by 2.642818% -5.672714% with 0% -2.118201% / 0.959179% -4.181808%,
    curve by 1.438796% -3.109035% with 0.918363% -0.81818% / 1.438796% -1.945401%,
    vline by -51.972722%,
    curve by 2.040807% -1.818177% with 0% -0.999949% / 0.918363% -1.818177%,
    hline by 80.060604%,
    curve by 13.816538% 12.309303% with 7.612266% 0% / 13.816538% 5.527259%,
    close,
    move by -67.345557% 2.23631%,
    curve by -4.081615% -3.636355% with 0% -2.00911% / -1.826495% -3.636355%,
    smooth by -4.081615% 3.636355% with -4.081615% 1.627245%,
    vline by 34.54634%,
    curve by 4.081615% 3.636355% with 0% 2.00911% / 1.826495% 3.636355%,
    smooth by 4.081615% -3.636355% with 4.081615% -1.627245%,
    close,
    move by 22.44997% 0%,
    curve by -4.081615% -3.636355% with 0% -2.00911% / -1.826495% -3.636355%,
    smooth by -4.081615% 3.636355% with -4.081615% 1.627245%,
    vline by 34.54634%,
    curve by 4.081615% 3.636355% with 0% 2.00911% / 1.826495% 3.636355%,
    smooth by 4.081615% -3.636355% with 4.081615% -1.627245%,
    close,
    move by 36.734534% -2.23631%,
    curve by -5.653091% -5.0364% with 0% -2.78186% / -2.540832% -5.0364%,
    hline by -10.673368%,
    vline by 30.908046%,
    hline by 10.673368%,
    curve by 5.653091% -5.0364% with 3.12249% 0% / 5.653091% -2.263655%,
    close
  );
  background: red;
}