/* Leistungsübersicht */
[id=paket-optionen] .col-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1em;
}
@media (max-width: 50em) {
  [id=paket-optionen] .col-wrapper {
    grid-template-columns: 1fr 1fr;
  }
  [id=paket-optionen] .col-wrapper .m_card:last-of-type {
    justify-self: center;
    grid-column: 1/-1;
  }
}
@media (max-width: 36em) {
  [id=paket-optionen] .col-wrapper {
    grid-template-columns: 1fr;
  }
}

.c_packages input[type=checkbox] {
  --switch-color: var(--color-6);
  filter: unset;
}

[data-package-option=true] input[type=checkbox] {
  --switch-color: var(--brand-accent-400);
}

.col-wrapper .m_card {
  --gap: 1px;
}
@media (min-width: 65em) {
  .col-wrapper .m_card {
    --card-rows: 18em auto;
  }
}
@media (max-width: 64.999em) {
  .col-wrapper .m_card {
    --card-columns: 1fr;
    --card-layout: "h" "b";
  }
}
.col-wrapper .m_card[data-banderole]::before {
  position: absolute;
  content: attr(data-banderole);
  z-index: 11;
  background-color: var(--brand-accent-900);
  transform: rotate(45deg);
  right: -26px;
  top: 23px;
  width: 120px;
  display: flex;
  justify-content: center;
  height: 1.5em;
}
.col-wrapper .m_card[data-banderole]::before > span {
  padding-top: 0.275ex;
}
.col-wrapper .premium-plus {
  background-color: var(--brand-secondary-900);
}
.col-wrapper .card-title {
  --row-layout: 50px auto 1fr auto;
  justify-items: center;
  line-height: 1;
  gap: 1rem;
  position: sticky;
  top: 0;
  background-color: inherit;
  z-index: 10;
}
.col-wrapper .card-title img {
  height: 50px;
  width: auto;
  grid-row: 1;
}
.col-wrapper .card-title h2 {
  grid-row: 2;
  margin-bottom: 0;
}
.col-wrapper .card-title .price-1,
.col-wrapper .card-title .price-2 {
  grid-row: 3;
}
.col-wrapper .card-title .btn {
  grid-row: 4;
}
.col-wrapper .card-title > span {
  align-self: center;
}
.col-wrapper .card-title > span b {
  font-size: var(--font-size-4);
}
.col-wrapper .card-title > .btn {
  place-self: end center;
}
.col-wrapper .leistungsubersicht > .box {
  box-shadow: none;
}

/* auf desktop erste spalte mit eigenschaften nicht zentrieren */
@media (min-width: 65em) {
  .col-wrapper :first-child .feature-list > p {
    display: grid;
    grid-template-columns: 1fr auto;
  }
}
@media (max-width: 64.999em) {
  .col-wrapper .feature-list > p {
    display: grid;
    grid-template-columns: auto max-content;
    grid-template-areas: "h f";
  }
  .col-wrapper .feature-list > p b {
    display: flex;
    grid-area: h;
    gap: 1.5ex;
  }
  .col-wrapper .feature-list > p .check {
    grid-area: f;
    margin-left: 1ex;
  }
}
@media (max-width: 29.99em) {
  .col-wrapper .feature-list > p {
    grid-template-columns: auto max-content;
    hyphens: none;
  }
}
.feature-list {
  grid-auto-rows: calc(var(--font-size) + 2 * var(--spacing));
  align-content: start;
  padding: 0;
  margin-bottom: -4px; /* damit die letzte border abgeschnitten wird*/
}
.feature-list .check {
  display: block;
  height: 1.5em;
  width: 1.5em;
  background-image: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="rgb(44, 144, 168)" fill="none" stroke-width="4" stroke-linecap="round"><polyline points="20 6 9 17 4 12" /></svg>');
}
@media (min-width: 65em) {
  .feature-list .check {
    margin-left: auto;
    margin-right: auto;
  }
}
.feature-list > p {
  display: flex;
  align-items: center;
  padding: 0.625ex 1ex;
  margin-top: 0;
  margin-bottom: 0;
  border-top: 1px solid lightgrey;
  gap: 1ex;
}
.feature-list > p:has(.tooltip), .feature-list > p:has([data-show=lg]) {
  cursor: pointer;
}
.feature-list > p:last-child {
  border-bottom: 1px solid lightgrey;
}
@media (min-width: 65em) {
  .feature-list > p {
    justify-content: center;
  }
}
.feature-list .tooltip {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 1ex;
  font-weight: 800;
  border: 1px solid var(--border-color);
  border-radius: 100%;
  width: 1.5em;
  height: 1.5em;
}

@media (max-width: 22.49em) {
  .m_packages {
    padding: 0;
  }
}

.m_packages > .layout > blockquote.wia-box,
.m_packages > .layout > .faq-wrapper,
.m_packages > .layout > p {
  max-width: 72ch;
  margin: 0 auto;
}

.m_packages > .layout > .faq-wrapper > .faq-item {
  margin-left: unset;
}

.m_packages > .layout > p {
  text-align: center;
}

.m_packages > .c_card-deck:not([id]),
.m_packages > .c_card-deck[id] {
  max-width: unset;
}

.m_packages {
  gap: 1.5rem !important;
}

.m_packages .rating-wrapper {
  --column-layout: 1fr 1fr;
}
.m_packages .rating-wrapper h3 {
  grid-column: 1/-1;
}
@media (max-width: 29.99em) {
  .m_packages .rating-wrapper {
    --column-layout: 1fr;
  }
}

.m_packages #experte-manuel-hartmann {
  max-width: 72ch;
  justify-self: center;
}

.m_packages figure > img {
  margin: 0 auto;
}

.m_packages:not([data-package-option]) .price-1,
.m_packages[data-package-option=false] .price-1 {
  display: inline;
}
.m_packages:not([data-package-option]) .price-2,
.m_packages[data-package-option=false] .price-2 {
  display: none;
}

.m_packages[data-package-option=true] .price-1 {
  display: none;
}
.m_packages[data-package-option=true] .price-2 {
  display: inline !important;
}

.m_packages .-deck-slim #beratung-wohnen-im-alter .card-head,
.m_packages .-deck-slim #beratung-mein-pflegejob .card-head {
  align-content: center;
}
.m_packages .-deck-slim #beratung-wohnen-im-alter .card-head img,
.m_packages .-deck-slim #beratung-mein-pflegejob .card-head img {
  height: unset;
}
@media (max-width: 36em) {
  .m_packages .-deck-slim .m_card {
    --card-layout: "h" "b" "f";
  }
  .m_packages .-deck-slim .card-body {
    grid-area: b;
    margin-top: unset;
  }
  .m_packages .-deck-slim .card-foot {
    justify-content: center;
  }
}

#style-mpj {
  --mpj-primary-400: #6034b2;
  --mpj-primary-800: #ebe6f3;
  --mpj-secondary-400: #ffbd00;
}
#style-mpj h2, #style-mpj .h3, #style-mpj .price-1, #style-mpj .price-2, #style-mpj .check {
  color: var(--mpj-primary-400);
}
#style-mpj p > a {
  color: var(--mpj-primary-400);
}
#style-mpj .check {
  background-image: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="rgb(96, 52, 178)" fill="none" stroke-width="4" stroke-linecap="round"><polyline points="20 6 9 17 4 12" /></svg>');
}
#style-mpj a.btn {
  background-color: var(--mpj-secondary-400);
  border-color: var(--mpj-secondary-400);
  color: var(--color-0);
}
#style-mpj .m_card[data-banderole]::before {
  background-color: var(--mpj-primary-800);
}

/*# sourceMappingURL=packages.css.map */