.Blurcard {
  --blur: 16px;
  --size: clamp(300px, 90vmin, 500px);
  --leadfont: 26px;
  /*width: var(--size);*/
 /* aspect-ratio: 5 / 2;*/
  max-width: 500px;
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  color: #000;
  margin: 25px;
  border: 2px solid black;
  background: #73aeea21;
}

.Blurcard__img {
  object-fit: cover;
  width: 100%;
  /*position: absolute;*/
  position: relative;
  height:20%;
  object-position: 50% 0%; /* position the image 50% from the left and 0% from the top */
  transform: scale(calc(1 + (var(--hover, 0) * 0.25))) rotate(calc(var(--hover, 0) * -5deg));
  transition: transform 0.2s;
}

.Blurcard__content {
  padding: 15px 15px;   /* top/bottom and left/right */
  position: relative;
  width: 100%;
  display: grid;
  grid-template-row: auto auto;
  gap: 1.2ch;
  /*background: hsl(0 0% 100% / 0.5);*/
  backdrop-filter: blur(var(--blur));
  align-content: center;
}

.Blurcard form{
  padding: 0px 0px;   /* top/bottom and left/right */
  margin:0px;
}

.Blurcard__action {
  position: absolute;
  aspect-ratio: 1;
  width: calc(var(--size) * 0.15);
  bottom: 30%;
  right: 1.5rem;
  transform: translateY(50%)
    translateY(
      calc(
        (var(--size) * 0.4)
      )
    )
    translateY(calc(var(--hover, 0) * (var(--size) * -0.4)));
  background: purple;
  display: grid;
  place-items: center;
  border-radius: 0.5rem;
  background: hsl(0 0% 100% / 0.5);
  transition: transform 0.2s;
}

.Blurcard__action svg {
  aspect-ratio: 1;
  width: 50%;
}

.Blurcard__content span:nth-of-type(1) {
  font-size: calc(var(--leadfont) * 1);
}

.Blurcard__content span:nth-of-type(2) {
  font-size: calc(var(--leadfont) * 0.7);
}

.Blurcard__content span:nth-of-type(3) {
  font-size: calc(var(--leadfont) * 0.6);
}

.Blurcard:is(:hover, :focus-visible) {
  --hover: 1;
}