.kwaPricingbox {
  --pb-bg-dark: var(--color-premiumblau);
  --pb-bg: var(--color-koenigsblau);
  --pb-accent: var(--color-eisblau);
  --pb-text: #fff;
  position: relative;
  overflow: hidden;
  color: var(--pb-text);
  background: var(--color-premiumblau);
  width: 100%;
}

.kwaPricingbox.rounded {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
}

.kwaPricingbox-top { 
  padding: 2rem 2rem 0; 
  display: flex;
  flex-direction: column;
  align-items: center;
}
.kwaPricingbox-name { display: inline-block; 
  padding: .85rem 2rem; 
  border-radius: .5rem; 
  background: rgba(255,255,255,.1); 
  font-size: 1.35rem; 
  font-weight: 700; 
}
.kwaPricingbox-price { 
  display: flex; 
  flex-direction: column; 
  align-items: flex-start; 
  /* gap: .5rem;  */
  margin-top: 1.25rem; 
  line-height: 1;
  width: fit-content;
}
.kwaPricingbox-from { 
  font-size: 1.25rem; 
  font-weight: 600; 
}
.kwaPricingbox-amount { 
  font-size: 4.5rem; 
  font-weight: 700; 
  display: block;
  width: 100%;
  text-align: center;
}
.kwaPricingbox-period { 
  font-size: .95rem; 
  opacity: .75;
  display: block;
  width: 100%;
  text-align: right;
}
.kwaPricingbox-body { 
  padding: 1.5rem 2rem 2rem; 
}
.kwaPricingbox-features { 
  margin: 0 0 2rem; 
  padding: 0; 
}
.kwaPricingbox-feature { display: flex; 
  align-items: center; 
  gap: .9rem; 
  padding: .85rem 0; 
  border-bottom: 1px solid rgba(255,255,255,.18); 
  font-size: 1.125rem;
}
.kwaPricingbox-feature:last-child { 
  border-bottom: 0; 
}
.kwaPricingbox-check { 
  flex: 0 0 24px; 
  width: 24px; 
  height: 24px; 
  color: var(--pb-accent); 
}

.kwaPricingbox-check path {
    stroke: var(--color-premiumblau) !important;
}

.kwaPricingbox-btn { 
  display:block }
.kwaPricingbox-col .kwaPricingbox { 
  
  height: 100%;
}
.kwaPricingbox-media { 
  position: relative; 
  overflow: hidden; 
  aspect-ratio: 16 / 9;
  height: 100%;
}

.kwaPricingbox-media.rounded {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.kwaPricingbox-image { 
  position: absolute; 
  inset: 0; 
  width: 100%; 
  height: 100%; 
  object-fit: cover; 
}

/* SECTION Hero Background Modul */

.kwaPricingbox-bg-modul {
    position: relative;
    width: 100%;
    padding: 0;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.kwaPricingbox-bg-modul .kwaPricingbox-media {
    position: relative;
    inset: 0;
    z-index: -1;
    overflow: hidden;
}

.kwaPricingbox-bg-modul .kwaPricingbox-media.rounded {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.kwaPricingbox-bg-modul .kwaPricingbox-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.kwaPricingbox-bg-modul .kwaPricingbox {
    position: relative;
    width: 100%;
    margin: 0;
}

.kwaPricingbox-bg-modul .kwaPricingbox.rounded {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

/* !SECTION Hero Background Modul */

@media (min-width: 768px) {
  /* rechte Spalte = Breite des Contents (max. 26rem), linke Spalte füllt den Rest */
  .kwaPricingbox-col { width: max-content; 
    max-width: 26rem; 
  }
  /* Bild immer so hoch wie die Pricingbox */
  .kwaPricingbox-media { 
    aspect-ratio: auto; 
  }

  .kwaPricingbox.rounded {
    border-top-right-radius: 0.4rem !important;
    border-top-left-radius: 0.4rem !important;
}

.kwaPricingbox-media.rounded {
    border-bottom-left-radius: 0.4rem !important;
    border-bottom-right-radius: 0.4rem !important;
}


  .kwaPricingbox-bg-modul {
    position: relative;
    width: 100%;
    padding: var(--space-large) 0;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.kwaPricingbox-bg-modul .kwaPricingbox-media {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
}

.kwaPricingbox-bg-modul .kwaPricingbox-media.rounded {
    border-bottom-left-radius: 0.4rem !important;
    border-bottom-right-radius: 0.4rem !important;
}

.kwaPricingbox-bg-modul .kwaPricingbox {
    position: relative;
    width: 100%;
    max-width: fit-content;
    margin: 0 var(--space-large) 0 auto;
}

.kwaPricingbox-bg-modul .kwaPricingbox.rounded {
    border-top-left-radius: 0.4rem !important;
    border-top-right-radius: 0.4rem !important;
}

}

@media (min-width: 992px) {

    .kwaPricingbox-bg-modul {
      position: relative;
      width: 100%;
      padding: var(--space-2xlarge) 0;
      isolation: isolate;
      display: flex;
      flex-direction: column;
      align-items: center;
  }

  .kwaPricingbox-bg-modul .kwaPricingbox {
    position: relative;
    width: 100%;
    max-width: fit-content;
    margin: 0 var(--space-2xlarge) 0 auto;
}
}