/* Bonuses — final dark benefit vault */
.bonuses { position: relative; width: 100%; overflow: hidden; }
body[data-bonuses-version="2"] .bonuses {
  padding: clamp(110px,12vw,180px) max(4vw,calc((100vw - 1480px) / 2));
  display: grid;
  grid-template-columns: minmax(310px,.72fr) minmax(0,1.28fr);
  gap: clamp(65px,9vw,140px);
  align-items: start;
  color: #fff;
  background: #171514;
}
body[data-bonuses-version="2"] .bonuses::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .45;
  background-image: repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0,rgba(255,255,255,.025) 1px,transparent 1px,transparent 18px);
  mask-image: linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent);
}
body[data-bonuses-version="2"] .bonuses__intro {
  position: sticky;
  z-index: 2;
  top: 135px;
  margin: 0;
}
body[data-bonuses-version="2"] .bonuses__intro .section-index { color: var(--accent-text); }
body[data-bonuses-version="2"] .bonuses__intro h2 {
  max-width: 540px;
  margin: 30px 0 0;
  font-family: var(--impact);
  font-size: clamp(54px,6vw,92px);
  letter-spacing: -.075em;
  line-height: .84;
  text-transform: uppercase;
}
body[data-bonuses-version="2"] .bonuses__intro h2 em {
  color: var(--accent-text);
  font-family: var(--impact);
  font-style: normal;
}
body[data-bonuses-version="2"] .bonus-list {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  border: 0;
}
body[data-bonuses-version="2"] .bonus-list article {
  position: relative;
  min-height: 330px;
  padding: clamp(32px,4vw,58px);
  display: grid;
  grid-template-columns: 120px minmax(0,1fr);
  grid-template-rows: auto 1fr auto;
  gap: 0 30px;
  color: #fff;
  background: #211e1c;
  border: 1px solid #504844;
  border-bottom: 0;
  overflow: hidden;
  transition: background .4s ease,transform .4s var(--ease);
}
body[data-bonuses-version="2"] .bonus-list article:last-child { border-bottom: 1px solid #504844; }
body[data-bonuses-version="2"] .bonus-list article::before {
  grid-column: 1;
  grid-row: 1 / 4;
  align-self: center;
  color: transparent;
  font-family: var(--impact);
  font-size: 92px;
  line-height: 1;
  -webkit-text-stroke: 1px rgba(232,175,189,.55);
}
body[data-bonuses-version="2"] .bonus-list article:nth-child(1)::before { content: "01"; }
body[data-bonuses-version="2"] .bonus-list article:nth-child(2)::before { content: "02"; }
body[data-bonuses-version="2"] .bonus-list article:nth-child(3)::before { content: "03"; }
body[data-bonuses-version="2"] .bonus-list article:nth-child(4)::before { content: "04"; }
body[data-bonuses-version="2"] .bonus-list article > span {
  grid-column: 2;
  grid-row: 1;
  margin: 0 0 30px;
  color: var(--accent-text);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body[data-bonuses-version="2"] .bonus-list h3 {
  grid-column: 2;
  grid-row: 2;
  margin: 0 0 20px;
  font-family: var(--serif);
  font-size: clamp(35px,4vw,58px);
  font-weight: 400;
  line-height: .98;
}
body[data-bonuses-version="2"] .bonus-list p {
  grid-column: 2;
  grid-row: 3;
  max-width: 570px;
  margin: 0;
  color: #bdb3ad;
  font-size: 12px;
  line-height: 1.7;
}
body[data-bonuses-version="2"] .bonus-list b {
  position: absolute;
  right: 30px;
  top: 30px;
  color: var(--accent-text);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .09em;
  text-transform: uppercase;
}
body[data-bonuses-version="2"] .bonus-list article:hover {
  z-index: 2;
  background: var(--accent-button);
  transform: translateX(-14px);
}
body[data-bonuses-version="2"] .bonus-list article:hover p { color: #f0e3df; }
body[data-bonuses-version="2"] .bonus-list article:hover b { color: #fff; }

@media (max-width: 800px) {
  body[data-bonuses-version="2"] .bonuses {
    padding-right: 16px;
    padding-left: 16px;
    grid-template-columns: 1fr;
    gap: 60px;
  }
  body[data-bonuses-version="2"] .bonuses__intro { position: static; }
  body[data-bonuses-version="2"] .bonuses__intro h2 {
    max-width: 430px;
    font-size: 50px;
  }
  body[data-bonuses-version="2"] .bonus-list article {
    min-height: 390px;
    padding: 27px 23px;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 1fr auto;
  }
  body[data-bonuses-version="2"] .bonus-list article::before {
    grid-column: 1;
    grid-row: 1;
    margin-bottom: 45px;
    font-size: 74px;
  }
  body[data-bonuses-version="2"] .bonus-list article > span {
    grid-column: 1;
    grid-row: 2;
    margin-bottom: 18px;
  }
  body[data-bonuses-version="2"] .bonus-list h3 {
    grid-column: 1;
    grid-row: 3;
    font-size: 39px;
  }
  body[data-bonuses-version="2"] .bonus-list p {
    grid-column: 1;
    grid-row: 4;
  }
  body[data-bonuses-version="2"] .bonus-list b {
    right: 22px;
    top: 24px;
    max-width: 120px;
    text-align: right;
  }
  body[data-bonuses-version="2"] .bonus-list article:hover { transform: translateY(-6px); }
}