

.background-card-hero-us {
  position: absolute;
  top: -66%;
  right: 0;
  width: 66%;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  /* display: block; */
  background: #6c7c62;
  background: linear-gradient(
    315deg,
    rgba(108, 124, 98, 1) 0%,
    rgba(152, 175, 144, 1) 50%,
    rgba(184, 201, 175, 1) 100%
  );
}

.assets-card-us {
  width: 13%;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  /* display: block; */
  background: #6c7c62;
  background: linear-gradient(
    315deg,
    rgba(108, 124, 98, 1) 0%,
    rgba(152, 175, 144, 1) 50%,
    rgba(184, 201, 175, 1) 100%
  );
  position: absolute;
  top: 90%;
  right: -5%;
  max-width: 100%;
  height: auto;
  z-index: 10; /* damit es über dem Hintergrund liegt */
}

.hero-img-overlay {
  position: absolute;
  top: 25%;
  left: -10%;
  max-width: 100%;
  height: auto;
  z-index: 10; /* damit es über dem Hintergrund liegt */
}


.info-heading {
  position: relative;
}

.info-heading h2 {
  font-family: "Extenda" !important;
  font-weight: 900;
  font-size: 4rem;
  color: white; /* deine Hauptfarbe */
/* Outline */
text-shadow:  
   1px 0   #98af90,
  -1px 0   #98af90,
   0   1px #98af90,
   0  -1px #98af90,
   1px 1px #98af90,
  -1px -1px #98af90,
   1px -1px #98af90,
  -1px 1px #98af90,

  /* Versetzter Schatten */
  4px 4px 0px #98af90;
}
.info-heading h2 span {
  font-weight: 900;
}

.corner-edge::before,
.corner-edge::after {
  content: "";
  position: absolute;
  width: 40px;
  height: 40px;
  border: 2px solid var(--prim); /* beliebige Farbe */
}

.corner-edge::before {
  top: 3%;
  left: 3%;
  border-right: none;
  border-bottom: none;
}

.corner-edge::after {
  bottom: 3%;
  right: 3%;
  border-top: none;
  border-left: none;
}

.info-knowledge {
  height: fit-content;
}

.us-burst-badge{
  position: absolute;
  left: 88%;
  top: 88%;
}
