:root {
  --primary: #00f5fb;
  --primary-hover: #00dce2;
  --color: currentColor;
  --secondary: #0066ff;
  --secondary-hover: #0052cc;
  --neutral: hsl(188, 73%, 90%);
  --neutral-hover: #e0e0e0;
  --ff-body: "Assistant", sans-serif;
  --ff-heading: "Assistant", sans-serif;
}
.message-content {
  ul {
    li {
      position: relative;
      padding-right: 28px;
    }

    li::before {
      content: "";
      position: absolute;
      right: 0;
      top: 0.15em;
      width: 16px;
      height: 22px;
      background: url("/cards/oded-laks-0584046715/lightning.png") center / contain no-repeat;
    }
  }
}
.ul-title {
  border-bottom: 3px solid var(--primary);
  width: fit-content;
}
header.card-header {
  color: var(--light-color);
}
.card-main-image::before {
  background: rgb(49 36 36 / 40%);
}
.btn--neutral,
.qr-wrapper,
.card-contact ul {
  color: black;
}
.card-contact .vcf {
  color: white;
}
.logo-img {
  background: white;
  border-radius: 50%;
  padding: 0.5rem;
  top: 85%;
  min-width: 150px;
}
.card-message .message-content {
  margin-top: 5rem;
}
.centered-strong {
  position: relative;
  padding: 2.5rem 1rem;
  isolation: isolate;
}

.centered-strong::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/cards/oded-laks-0584046715/lightning.png") center / contain no-repeat;

  opacity: 0.2;
  z-index: -1;
}

.centered-strong strong {
  position: relative;
}
@media (min-width: 45em) {
  .card-main-image {
    background-size: cover;
    background-position: center center;
    min-height: 80svh;
  }
  .card {
    padding-top: 0;
    gap: 2rem;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      " card-header card-header "
      " card-message card-message "
      /* " feedback feedback " */
      /* " card-gallery card-gallery " */
      /* " card-contact card-map" */
      " card-contact card-social"
      "card-contact  card-share"
      "  qr-wrapper  qr-wrapper ";
    align-self: center;
  }
  .card-social,
  .card-share {
    margin: 0;
  }
  .centered-strong strong {
    max-width: 18ch;
  }
}
@media (prefers-color-scheme: dark) {
  .logo-img {
    background: transparent;
  }
}