/*!**********************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./blocks/casino-features/style.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/**
 * Casino Features — shared styles.
 *
 * Loaded on the front end and inside the editor canvas, which is what keeps the
 * two views identical. Properties the design depends on are declared outright
 * rather than inherited: the theme dequeues `global-styles` on the front end
 * (see functions.php), so anything taken from theme.json would land in the
 * editor but not on the published page.
 */
/* The faces this block uses, served straight from the theme's assets directory —
   webpack is configured to leave these URLs alone (see webpack.config.js), so
   nothing is copied into /build. theme.json registers them too, but WP emits
   those @font-face rules through `global-styles`, which the front end dequeues. */
@font-face {
  font-family: "Poppins";
  src: url("../../assets/fonts/poppins/poppins-400-normal.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("../../assets/fonts/poppins/poppins-700-normal.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
/* ============================================================
   CASINO FEATURES
   mobile first:  < 768px   single column
                 >= 768px   2 x 2
                 >= 1320px  4 in one row (fixed 116px height)
   ============================================================ */
.casino-features {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  width: calc(100% - 64px);
  max-width: 1320px;
  margin: 24px auto 0 auto;
  padding: 10px 24px;
  opacity: 1;
  border-radius: 16px;
  background: #0a0713;
}
.casino-features *,
.casino-features *::before,
.casino-features *::after {
  box-sizing: border-box;
}
.casino-features .casino-features__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 0;
}
.casino-features .casino-features__item + .casino-features__item {
  border-top: 1px solid rgba(255, 255, 255, 0.09);
}
@media (min-width: 768px) {
  .casino-features .casino-features__item:nth-child(2) {
    border-top: 0;
  }
}
.casino-features .casino-features__item:nth-child(3), .casino-features .casino-features__item:nth-child(4) {
  padding-top: 15px;
}
.casino-features .casino-features__item {
  /* divider — off by default, switched on from 768px up */
}
.casino-features .casino-features__item::before {
  content: "";
  position: absolute;
  left: -13px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 44px;
  background: rgba(255, 255, 255, 0.09);
  display: none;
}
.casino-features {
  /* The holder keeps its 44x44 footprint whether or not an icon has been
     uploaded, so the row never reflows once one is: render.php emits an <img>
     when there is an icon and an empty <span> carrying this class when there
     is not. */
}
.casino-features .casino-features__icon {
  flex: 0 0 auto;
  display: block;
  width: 44px;
  height: 44px;
}
.casino-features .casino-features__content {
  min-width: 0;
}
.casino-features .casino-features__title {
  margin: 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 0;
  vertical-align: middle;
  color: #fff;
}
.casino-features .casino-features__description {
  margin: 8px 0 0 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 14px;
  letter-spacing: 0;
  vertical-align: middle;
  color: rgba(255, 255, 255, 0.6);
}

/* ---------- >= 768px : two columns, two rows ---------- */
@media (min-width: 768px) and (max-width: 999px) {
  .casino-features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 26px;
    padding: 32px 24px;
  }
  .casino-features .casino-features__item {
    padding: 0;
    border-top: none;
    /* only the right-hand column gets a vertical rule */
  }
  .casino-features .casino-features__item:nth-child(even)::before {
    display: block;
  }
}
/* ---------- >= 1000px : single row of four ---------- */
@media (min-width: 1000px) {
  .casino-features {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    height: 116px;
  }
  .casino-features__content {
    padding-right: 25px;
  }
  .casino-features .casino-features__item:nth-child(n+2)::before {
    display: block;
  }
  .casino-features .casino-features__item:nth-child(3), .casino-features .casino-features__item:nth-child(4) {
    padding: 20px 0;
    border-top: 0;
  }
}

/*# sourceMappingURL=style-index.css.map*/