.hex_feature_grid {
  --hex-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='254' height='271' viewBox='0 0 254 271' fill='none'%3E%3Cpath d='M110.602 32.2874C120.502 26.5712 132.701 26.5712 142.602 32.2874L197.204 63.8122C207.105 69.5285 213.204 80.0925 213.204 91.525V154.575C213.204 166.007 207.105 176.571 197.204 182.287L142.602 213.812C132.701 219.528 120.502 219.528 110.602 213.812L55.999 182.287C46.0982 176.571 39.999 166.007 39.999 154.575V91.525C39.999 80.0925 46.0982 69.5285 55.999 63.8122L110.602 32.2874Z' fill='%232A216B'/%3E%3C/svg%3E");
  position: relative;
  padding: 120px 0 152px;
  background: linear-gradient(180deg, #2a216b 21.4%, #1c1647 55.23%);
  overflow-x: hidden;
  overflow-y: visible;
}
.hex_feature_grid__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
.hex_feature_grid__header {
  width: 100%;
  max-width: 800px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.hex_feature_grid__pill {
  margin: 0;
  padding: 6px 20px;
  border: 1px solid rgba(231, 231, 234, 0.6);
  border-radius: 32px;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #f7f7f8;
  font-size: 16px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0;
  opacity: 0.95;
  text-decoration: none;
  display: inline-flex;
}
.hex_feature_grid__title {
  margin: 0;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #f7f7f8;
  font-size: 48px;
  line-height: 60px;
  font-weight: 700;
  letter-spacing: 0;
}
.hex_feature_grid__description {
  margin: 0;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #d0d0d8;
  opacity: 0.6;
  font-size: 20px;
  line-height: 32px;
  font-weight: 500;
  max-width: 800px;
  letter-spacing: 0;
}
.hex_feature_grid__grid_viewport {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: none;
  margin-left: 0;
  overflow-x: visible;
  overflow-y: visible;
}
.hex_feature_grid__mobile_layout {
  display: none;
}
.hex_feature_grid__mobile_row {
  display: flex;
  align-items: flex-start;
}
.hex_feature_grid__grid_canvas {
  position: relative;
  width: 2648px;
  margin: 0 auto;
  padding-bottom: 140px;
}
.hex_feature_grid__row {
  display: flex;
  gap: 4px;
  align-items: flex-start;
}
.hex_feature_grid__row--top {
  width: 2444px;
  margin-left: 102px;
  margin-bottom: -24px;
}
.hex_feature_grid__row--bottom {
  width: 2648px;
  margin-bottom: -24px;
}
.hex_feature_grid__cell {
  width: 200px;
  height: 200px;
  flex: 0 0 200px;
  position: relative;
}
.hex_feature_grid__cell--featured {
  z-index: 2;
  isolation: isolate;
}
.hex_feature_grid__cell--featured::after {
  content: "";
  position: absolute;
  inset: -44px;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(circle at center, rgba(98, 88, 255, 0.58) 0%, rgba(98, 88, 255, 0.35) 38%, rgba(98, 88, 255, 0.18) 58%, rgba(98, 88, 255, 0) 78%);
  border-radius: 50%;
  filter: blur(12px);
  opacity: 0.95;
  transform: translateZ(0);
}
.hex_feature_grid__hex {
  position: relative;
  width: 100%;
  height: 100%;
  -webkit-mask: var(--hex-mask) center -18px;
  mask: var(--hex-mask) center -18px;
  -webkit-mask-size: auto;
  mask-size: auto;
}
.hex_feature_grid__hex--ghost {
  background: rgba(20, 20, 26, 0.2);
}
.hex_feature_grid__hex--ghost-dark {
  background: rgba(20, 20, 26, 0.2);
}
.hex_feature_grid__hex--filled {
  background: #2a216b;
  filter: drop-shadow(0 4px 32px rgba(0, 0, 0, 0.1)) drop-shadow(0 12px 40px rgba(0, 0, 0, 0.1));
}
.hex_feature_grid__hex--filled-bottom {
  background: linear-gradient(180deg, #3b3498 0%, #302a7f 100%);
}
.hex_feature_grid__hex--featured {
  background: linear-gradient(180deg, #6f66ff 0%, #6158fa 100%);
  transform: scale(1.415);
  transform-origin: center center;
  z-index: 12;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1), 0 4px 32px rgba(0, 0, 0, 0.1);
  filter: drop-shadow(0 0 24px rgba(98, 88, 255, 0.68)) drop-shadow(0 0 48px rgba(98, 88, 255, 0.45));
}
.hex_feature_grid__hex--featured::before {
  content: "";
  position: absolute;
  inset: -4px;
  -webkit-mask: var(--hex-mask) center/100% 100% no-repeat;
  mask: var(--hex-mask) center/100% 100% no-repeat;
  box-shadow: 0 0 72px rgba(112, 96, 255, 0.68);
  z-index: -1;
}
.hex_feature_grid__hex--featured::after {
  display: none;
}
.hex_feature_grid__tile {
  position: absolute;
  inset: 0;
  color: #f7f7f8 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 8px 16px;
  text-align: center;
}
.hex_feature_grid__tile_icon {
  width: 48px;
  height: 48px;
  border-radius: 32px;
  background: rgba(20, 20, 26, 0.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}
.hex_feature_grid__tile_icon img {
  width: 24px;
  height: 24px;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0.95;
}
.hex_feature_grid__tile_badge {
  min-height: 44px;
  padding: 12px 14px;
  border-radius: 32px;
  background: rgba(20, 20, 26, 0.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #f7f7f8 !important;
  font-size: 16px;
  line-height: 20px;
  font-weight: 700;
  letter-spacing: 0;
}
.hex_feature_grid__tile_badge--featured {
  min-height: 44px;
  padding: 12px 14px;
  border-radius: 32px;
}
.hex_feature_grid__tile_label {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: center;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #f7f7f8 !important;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  letter-spacing: 0;
}
.hex_feature_grid__tile_label strong {
  color: inherit !important;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  margin: 0;
}
.hex_feature_grid__tile_label strong span {
  color: #fff !important;
  font-size: 14px;
  line-height: 20px;
}
.hex_feature_grid__tile_label--featured {
  font-size: inherit;
  line-height: inherit;
}

@media screen and (max-width: 1280px) {
  .hex_feature_grid {
    padding: 80px 0 112px;
  }
  .hex_feature_grid__inner {
    gap: 40px;
  }
  .hex_feature_grid__header {
    max-width: 720px;
  }
  .hex_feature_grid__title {
    font-size: 48px;
    line-height: 60px;
  }
  .hex_feature_grid__description {
    font-size: 20px;
    line-height: 32px;
    max-width: 720px;
  }
  .hex_feature_grid__grid_viewport {
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: none;
    margin-left: 0;
    overflow-x: visible;
    overflow-y: visible;
  }
  .hex_feature_grid__grid_canvas {
    width: 1986px;
    padding-bottom: 96px;
  }
  .hex_feature_grid__row {
    gap: 3px;
  }
  .hex_feature_grid__row--top {
    width: 1833px;
    margin-left: 76.5px;
    margin-bottom: -18px;
  }
  .hex_feature_grid__row--bottom {
    width: 1986px;
    margin-bottom: -18px;
  }
  .hex_feature_grid__cell {
    width: 150px;
    height: 150px;
    flex-basis: 150px;
  }
  .hex_feature_grid__tile {
    gap: 9px;
    padding: 6px 12px;
  }
  .hex_feature_grid__tile_icon {
    width: 36px;
    height: 36px;
    padding: 9px;
  }
  .hex_feature_grid__tile_icon img {
    width: 18px;
    height: 18px;
  }
  .hex_feature_grid__tile_badge {
    min-height: 30px;
    padding: 9px 10px;
    font-size: 12px;
    line-height: 15px;
  }
  .hex_feature_grid__tile_label {
    font-size: 12px;
    line-height: 18px;
  }
  .hex_feature_grid__hex--featured {
    box-shadow: 0 0 30px rgba(97, 84, 255, 0.72), 0 9px 30px rgba(0, 0, 0, 0.1), 0 3px 24px rgba(0, 0, 0, 0.1);
    filter: drop-shadow(0 0 18px rgba(98, 88, 255, 0.58)) drop-shadow(0 0 36px rgba(98, 88, 255, 0.4));
  }
  .hex_feature_grid__cell--featured {
    transform: none;
  }
  .hex_feature_grid__tile--featured {
    gap: 9px;
    padding: 6px 12px;
  }
  .hex_feature_grid__tile_badge--featured {
    min-height: 30px;
    padding: 9px 10px;
    border-radius: 24px;
    font-size: 12px;
    line-height: 15px;
  }
  .hex_feature_grid__tile_label--featured {
    font-size: 12px;
    line-height: 18px;
  }
}
@media screen and (max-width: 768px) {
  .hex_feature_grid {
    --hex-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='135' viewBox='0 0 128 135' fill='none'%3E%3Cpath d='M57.2214 16.7037C62.3434 13.7465 68.654 13.7465 73.776 16.7037L102.024 33.0124C107.146 35.9696 110.301 41.4347 110.301 47.3491V79.9666C110.301 85.881 107.146 91.3461 102.024 94.3033L73.776 110.612C68.654 113.569 62.3434 113.569 57.2214 110.612L28.9738 94.3033C23.8518 91.3461 20.6965 85.881 20.6965 79.9666V47.3491C20.6965 41.4347 23.8518 35.9696 28.9738 33.0124L57.2214 16.7037Z' fill='%232A216B'/%3E%3C/svg%3E");
    padding: 80px 0 96px;
  }
  .hex_feature_grid__inner {
    gap: 40px;
  }
  .hex_feature_grid__header {
    max-width: 327px;
  }
  .hex_feature_grid__pill {
    font-size: 14px;
    line-height: 18px;
  }
  .hex_feature_grid__title {
    font-size: 28px;
    line-height: 36px;
  }
  .hex_feature_grid__description {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    max-width: 327px;
  }
  .hex_feature_grid__grid_viewport {
    display: none;
    justify-content: center;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-right: 0;
    overflow-x: visible;
    overflow-y: visible;
  }
  .hex_feature_grid__mobile_layout {
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    overflow: visible;
  }
  .hex_feature_grid__mobile_row {
    justify-content: center;
    gap: 2.069px;
  }
  .hex_feature_grid__mobile_row + .hex_feature_grid__mobile_row {
    margin-top: -12.416px;
  }
  .hex_feature_grid__mobile_row--top, .hex_feature_grid__mobile_row--middle, .hex_feature_grid__mobile_row--bottom {
    transform: none;
  }
  .hex_feature_grid__row {
    width: auto;
    margin: 0;
    gap: 2.069px;
  }
  .hex_feature_grid__row--top {
    width: 1264.8px;
    margin-left: 104.4px;
    margin-bottom: -12.416px;
  }
  .hex_feature_grid__row--bottom {
    width: 1370.7px;
    margin-left: 52.7px;
    margin-bottom: -12.416px;
  }
  .hex_feature_grid__cell {
    width: 103.466px;
    height: 103.466px;
    flex-basis: 103.466px;
  }
  .hex_feature_grid__hex {
    -webkit-mask: var(--hex-mask) center -9px;
    mask: var(--hex-mask) center -9px;
  }
  .hex_feature_grid__tile {
    gap: 6.208px;
    padding: 4.139px 8.277px;
  }
  .hex_feature_grid__tile_icon {
    width: 24.832px;
    height: 24.832px;
    padding: 6.208px;
  }
  .hex_feature_grid__tile_icon img {
    width: 12.416px;
    height: 12.416px;
  }
  .hex_feature_grid__tile_badge {
    min-height: 24.832px;
    padding: 6.208px;
    border-radius: 16.555px;
    font-size: 8.277px;
    line-height: 10.347px;
  }
  .hex_feature_grid__tile_label {
    font-size: 8.277px;
    line-height: 12.416px;
  }
  .hex_feature_grid__hex--featured {
    transform: scale(1.43);
    box-shadow: 0 0 24px rgba(98, 88, 255, 0.62), 0 8px 24px rgba(0, 0, 0, 0.1);
    filter: drop-shadow(0 0 14px rgba(98, 88, 255, 0.52)) drop-shadow(0 0 28px rgba(98, 88, 255, 0.34));
  }
  .hex_feature_grid__cell--featured {
    transform: translateY(-14px);
    z-index: 4;
  }
  .hex_feature_grid__tile--featured {
    gap: 6.208px;
    padding: 4.139px 8.277px;
  }
  .hex_feature_grid__tile_badge--featured {
    min-height: 24.832px;
    padding: 6.208px;
    border-radius: 16.555px;
    font-size: 8.277px;
    line-height: 10.347px;
  }
  .hex_feature_grid__tile_label--featured {
    font-size: 8.277px;
    line-height: 12.416px;
  }
}