.bonus-comparison {
  container-type: inline-size;
  margin: 24px 0 36px;
}
@media (max-width: 992px) {
  .bonus-comparison {
    margin-bottom: 10px;
  }
}
.bonus-comparison .bonus-comparison__title {
  font-family: "Bangers", cursive;
  font-size: 42px;
  line-height: 45px;
  text-align: center;
  color: #FDE655;
  margin: 0 0 10px;
  font-weight: 400;
}
.bonus-comparison .bonus-comparison__list {
  font-family: "Red Hat Display", sans-serif;
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
}
.bonus-comparison .bonus-comparison-item {
  background-color: #FFFDFF;
  padding: 16px;
  border-radius: 24px;
  display: grid;
  grid-column-gap: 16px;
  grid-template-areas: "logo bonus coins cta";
  grid-template-columns: 120px 1fr 213px 240px;
  align-items: center;
  color: #350B53;
}
@container (max-width: 992px) {
  .bonus-comparison .bonus-comparison-item {
    grid-template-areas: "logo bonus cta";
    grid-template-columns: 120px 1fr 235px;
  }
}
@container (max-width: 600px) {
  .bonus-comparison .bonus-comparison-item {
    padding: 10px 8px;
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: minmax(88px, 25%) 1fr;
    grid-template-areas: "logo bonus" "logo cta";
    align-items: stretch;
  }
}
@container (max-width: 340px) {
  .bonus-comparison .bonus-comparison-item {
    grid-template-columns: minmax(80px, 25%) 1fr;
  }
}
@container (min-width: 992px) {
  .bonus-comparison .bonus-comparison-item.bonus-comparison-item--four-cols {
    grid-template-areas: "logo bonus cta";
    grid-template-columns: 120px 1fr 240px;
  }
}
.bonus-comparison .bonus-comparison-item__link {
  text-decoration: none;
  cursor: pointer;
}
.bonus-comparison .bonus-comparison-item__logo-wrapper {
  grid-area: logo;
  position: relative;
}
.bonus-comparison .operator-logo {
  min-height: 90px;
  overflow: hidden;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.bonus-comparison .operator-logo__bonus-label {
  background-color: #FFE600;
  width: 100%;
  max-width: 88px;
  position: absolute;
  left: calc(50% - 44px);
  bottom: 6px;
  font-size: 8px;
  display: inline-block;
  text-align: center;
  font-weight: 800;
  line-height: 11px;
  padding: 2px 6px;
  border-radius: 50px;
}
@container (max-width: 600px) {
  .bonus-comparison .operator-logo__bonus-label {
    max-width: 66px;
    left: calc(50% - 33px);
  }
}
.bonus-comparison .operator-logo__img {
  max-width: 80%;
  height: auto;
  object-fit: contain;
}
.bonus-comparison .bonus-comparison-item__bonus {
  grid-area: bonus;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
@container (max-width: 600px) {
  .bonus-comparison .bonus-comparison-item__bonus {
    gap: 4px;
  }
}
.bonus-comparison .bonus-section__bonus-type {
  font-weight: 800;
  font-size: 12px;
  line-height: 16px;
  border-radius: 50px;
  padding: 2px 6px;
  background-color: rgba(169, 93, 253, 0.4);
}
@container (max-width: 600px) {
  .bonus-comparison .bonus-section__bonus-type {
    font-size: 9px;
    line-height: 12px;
  }
}
.bonus-comparison .bonus-section__link {
  margin: 0;
  font-weight: 800;
  font-size: 24px;
  line-height: 32px;
  color: #350B53;
  transition: 0.25s all;
}
.bonus-comparison .bonus-section__link:hover {
  color: #d00393;
}
.bonus-comparison .bonus-section__link:hover .text--lavender {
  color: #d00393;
}
@container (max-width: 600px) {
  .bonus-comparison .bonus-section__link {
    font-size: 20px;
    line-height: 26px;
  }
}
.bonus-comparison .bonus-highlight-scs {
  color: #A95DFD;
}
.bonus-comparison .bonus-comparison__coins-wrapper {
  display: flex;
  grid-area: coins;
  gap: 16px;
}
@container (max-width: 992px) {
  .bonus-comparison .bonus-comparison__coins-wrapper {
    display: none;
  }
}
.bonus-comparison .bonus-comparison-item__gold-coins {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  max-width: 92px;
}
.bonus-comparison .bonus-comparison-item__social-coins {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  max-width: 121px;
}
.bonus-comparison .bonus-comparison-item__label {
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
  color: #02062B;
}
.bonus-comparison .bonus-comparison-item__value {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  color: #02062B;
}
.bonus-comparison .bonus-comparison-item__cta-wrapper {
  grid-area: cta;
  display: flex;
  gap: 8px;
}
.bonus-comparison .cta_wrapper__rating-label {
  background-color: rgba(255, 230, 0, 0.2);
  padding: 10px 8px 10px 35px;
  border-radius: 60px;
  font-weight: 800;
  font-size: 16px;
  line-height: 21px;
  position: relative;
}
@container (max-width: 600px) {
  .bonus-comparison .cta_wrapper__rating-label {
    padding: 8px 35px 8px;
    max-width: 77px;
  }
}
.bonus-comparison .cta_wrapper__rating-label:after {
  content: "";
  position: absolute;
  background-image: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_i_310_291)'%3E%3Cpath d='M11.8635 0.496771C11.4778 -0.165496 10.521 -0.165495 10.1353 0.496772L7.18015 5.57041C7.03885 5.81301 6.80207 5.98504 6.52768 6.04445L0.789185 7.28711C0.0401325 7.44931 -0.25552 8.35924 0.255135 8.93074L4.16726 13.3091C4.35433 13.5184 4.44477 13.7968 4.41649 14.0761L3.82502 19.9177C3.74782 20.6803 4.52185 21.2426 5.22319 20.9336L10.5961 18.5659C10.8531 18.4527 11.1457 18.4527 11.4026 18.5659L16.7756 20.9336C17.4769 21.2426 18.251 20.6803 18.1738 19.9177L17.5823 14.0761C17.554 13.7968 17.6445 13.5184 17.8315 13.3091L21.7436 8.93074C22.2543 8.35924 21.9586 7.44931 21.2096 7.28711L15.4711 6.04445C15.1967 5.98504 14.9599 5.81301 14.8186 5.57041L11.8635 0.496771Z' fill='url(%23paint0_linear_310_291)'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_i_310_291' x='0' y='0' width='21.9988' height='26.02' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='8'/%3E%3CfeGaussianBlur stdDeviation='2.5'/%3E%3CfeComposite in2='hardAlpha' operator='arithmetic' k2='-1' k3='1'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0'/%3E%3CfeBlend mode='normal' in2='shape' result='effect1_innerShadow_310_291'/%3E%3C/filter%3E%3ClinearGradient id='paint0_linear_310_291' x1='10.9994' y1='-0.986816' x2='10.9994' y2='24.0132' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FDE655'/%3E%3Cstop offset='1' stop-color='%23FD6355'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
  height: 22px;
  width: 22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  left: 10px;
  top: calc(50% - 12.5px);
}
@container (max-width: 600px) {
  .bonus-comparison .cta_wrapper__rating-label:after {
    top: calc(50% - 13px);
  }
}
.bonus-comparison .cta_wrapper-cta-link {
  background: #FFE600;
  flex-grow: 1;
  border-radius: 40px;
  padding: 8px 21px;
  display: flex;
  justify-content: center;
  transition: 0.25s all;
  align-items: center;
  gap: 6px;
  max-width: 158px;
  margin-left: auto;
}
.bonus-comparison .cta_wrapper-cta-link:hover {
  background-color: #d00393;
}
@container (max-width: 600px) {
  .bonus-comparison .cta_wrapper-cta-link {
    max-width: 161px;
  }
}
@container (max-width: 340px) {
  .bonus-comparison .cta_wrapper-cta-link {
    padding: 8px 12px;
  }
}
@container (max-width: 340px) {
  .bonus-comparison .cta_wrapper-cta-link svg {
    display: none;
  }
}
.bonus-comparison .cta_wrapper-cta-link__text {
  color: #02062B;
  font-size: 14px;
  line-height: 24px;
  font-weight: 700;
  position: relative;
}
.bonus-comparison .text--lavender {
  transition: 0.25s all;
  color: #A95DFD;
}

/*# sourceMappingURL=bonus-comparison.css.map */