:root {
  --g-black: #332f2c;
  --g-blue: #1b4075;
  --g-green-dark: #0e3925;
  --g-green-light: #056f41;
  --g-red-dark: #ac0000;
  --g-red-light: #ff1727;
  --g-shadow: #000b27;
  --g-white: #fcfafb;
}

.gucci-stripes {
  box-sizing: border-box;
  border: 8px solid var(--g-blue);
  position: relative;
  width: 100%;

  isolation: isolate;
  /* Green stripes */
  background:
    linear-gradient(to bottom right, var(--g-green-dark), var(--g-green-light));

  /* Text */
  -webkit-text-stroke-width: 5px;
  -webkit-text-stroke-color: var(--g-black);
  -webkit-text-fill-color: var(--g-white);
  -webkit-text-stroke: 6px var(--g-black);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 2.5em;
  font-weight: bolder;
  padding: 0 1em 0.1em 1em;
  paint-order: stroke fill;

  /* Shadow */
  filter: drop-shadow(8px 8px var(--g-shadow));
}
.gucci-stripes::after {
  content: "";
  inset: 0;
  position: absolute;
  pointer-events: none;
  z-index: -1;

  /* Red stripes */
  background: linear-gradient(to right, var(--g-red-dark), var(--g-red-light));
  -webkit-mask-image: repeating-linear-gradient(
    45deg,
    black,
    black 8px,
    transparent 8px,
    transparent 16px
  );
  mask-image: repeating-linear-gradient(
    45deg,
    black,
    black 8px,
    transparent 8px,
    transparent 16px
  );
}


.gucci-wrapper {
  border: 8px solid var(--g-white);
}