@charset "UTF-8";

/* src/css/components/blocks/_Keypoints.scss */

.hwc-BlockKeypoints-heading {
  text-align: center;
  margin-bottom: 2.5rem;
}

.hwc-BlockKeypoints-heading:has(.hwc-Button) {
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.hwc-BlockKeypoints-items {
  --item-per-line: 4;
  --gap: 3rem;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 3rem;
  gap: var(--gap);
  justify-content: center;
}

.hwc-BlockKeypoints-item {
  flex: 1 0 calc(100% / var(--item-per-line) - var(--gap) * (var(--item-per-line) - 1) / var(--item-per-line));
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hwc-BlockKeypoints-item .icon {
  flex: 0 0 193px;
  width: 193px;
  height: 197px;
  aspect-ratio: 193/197;
  background: no-repeat center center url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='193' height='198' viewBox='0 0 193 198' fill='none'%3E%3Cpath d='M68.2275 5.19885C81.4606 -0.78964 96.3189 -0.231676 105.832 0.324829C109.161 0.493168 111.94 0.61471 114.108 0.387329C122.672 -0.173283 122.68 5.5077 133.771 7.8092C144.909 10.701 150.843 15.2161 157.88 22.1686C165.736 28.5395 183.616 51.7855 187.095 61.9762C191.642 71.6735 192.291 83.9739 192.641 91.0182C192.73 93.2551 192.732 94.9813 192.73 96.3307C192.729 96.8939 192.726 97.1587 192.727 97.1647C192.727 97.3702 192.724 97.5757 192.723 97.7809C192.785 96.1723 192.731 97.8203 192.718 101.739C192.616 109.431 191.325 115.643 190.899 119.644C189.981 127.64 190.042 131.584 184.992 140.621C179.517 149.293 178.734 154.888 174.773 159.758C169.981 163.802 171.512 165.002 145.197 183.279C130.295 192.366 116.559 195.541 105.832 196.736C96.4985 197.731 89.138 197.245 83.0908 196.518C69.6094 195.603 45.1466 181.518 30 166.342C14.4721 154.26 0.13912 118.205 0.444336 97.1647C0.261981 94.4975 0.142619 92.1356 0.0175781 90.0514C-0.360488 71.633 5.36701 72.1556 12.707 60.192C20.4375 49.1092 15.9727 32.5196 30.8389 20.7545C45.9176 10.3246 51.2377 13.8155 68.2275 5.19885Z' fill='white'/%3E%3C/svg%3E");
  background-size: cover;
  margin: 0 auto;
  color: var(--hwc-color-primary);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0.875rem;
}

.hwc-BlockKeypoints-item .icon img,
.hwc-BlockKeypoints-item .icon svg {
  display: block;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
  max-height: 143px;
}

.hwc-BlockKeypoints-item .icon path {
  fill: currentColor;
}

.hwc-BlockKeypoints-item .icon {
}

.hwc-BlockKeypoints-item .icon:has(svg) {
  padding: 1rem;
}

.hwc-BlockKeypoints-item-arrow {
  width: 1rem;
  margin-top: 1.5rem;
}

.hwc-BlockKeypoints-item:nth-child(2n+1) .icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='196' height='199' viewBox='0 0 196 199' fill='none'%3E%3Cpath d='M149.386 181.484C138.153 190.694 123.657 194 114.324 195.925C111.065 196.624 108.35 197.226 106.313 198.007C98.1866 200.765 96.7082 195.28 85.4004 195.927C73.8931 196.016 66.9923 193.191 58.396 188.297C49.1588 184.176 25.872 166.35 19.8737 157.407C12.9711 149.217 9.16064 137.504 7.00015 130.79C6.33496 128.652 5.88601 126.985 5.5384 125.682C5.39576 125.142 5.32936 124.885 5.32632 124.875C5.27314 124.676 5.22233 124.477 5.1706 124.279C5.52709 125.848 5.15202 124.243 4.15091 120.454C2.2588 112.998 1.89791 106.664 1.27309 102.689C0.0902018 94.7272 -0.988754 90.9333 1.5499 80.8978C4.59429 71.1042 3.90171 65.4966 6.46725 59.7674C10.0498 54.6216 8.26028 53.8588 28.9481 29.3935C40.991 16.759 53.4371 10.1374 63.489 6.20651C72.2471 2.82998 79.4824 1.39364 85.5117 0.531009C98.7707 -2.07423 126.045 5.19951 144.604 15.9377C162.729 23.5892 185.906 54.7058 191.057 75.1087C191.923 77.6377 192.65 79.8883 193.31 81.8691C198.442 99.5618 192.775 100.54 188.781 113.995C184.183 126.701 192.789 141.57 181.474 156.782C169.609 170.759 163.566 168.764 149.386 181.484Z' fill='white'/%3E%3C/svg%3E");
}

.hwc-BlockKeypoints-item-heading {
  margin-bottom: 0.5rem;
  font-weight: bold;
}

.hwc-BlockKeypoints-item-description {
  color: var(--hwc-color-gray);
  flex-grow: 1;
}

.hwc-BlockKeypoints-viewall {
  padding-top: 2rem;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .hwc-BlockKeypoints-items {
    --item-per-line: 2;
    --gap: 2rem;
  }
  .hwc-BlockKeypoints-heading {
    margin-bottom: 2rem;
  }
}

@media screen and (max-width: 440px) {
  .hwc-BlockKeypoints-items {
    --item-per-line: 1;
    --gap: 1rem;
  }
}

/*# sourceMappingURL=hwc-keypoints.css.map */