/* === MEDIA === */

@media (min-width: 767.98px) {
  body {
    font-size: 16px;
  }

  table tr,
  .table tr {
    display: block;
    border-bottom: 1px solid #D5AB3B;
  }

  table tr:not(:last-child),
  .table tr:not(:last-child) {
    margin-bottom: 6px;
  }

  table th,
  .table th {
    width: 280px;
    text-align: left;
  }

  table td,
  .table td {
    width: -webkit-calc(100% - 260px);
    width: -moz-calc(100% - 260px);
    width: calc(100% - 260px);
  }

  .header__menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
  }

  .header__menu:not(:last-child) {
    margin-right: 20px;
  }

  .header-menu__button {
    display: none;
  }

  .header-menu__list a {
    white-space: nowrap;
  }

  .header-menu-sub__dropdown a {
    white-space: nowrap;
  }

  .cover__button {
    min-width: 273px;
  }

  .cover-rating-text__wrap > span {
    font-size: 24px;
  }

  .bonus__wrapper {
    max-width: 560px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 560px;
    -moz-box-flex: 0;
    flex: 0 1 560px;
  }

  .bonus__title:not(:last-child) {
    margin-bottom: 20px;
  }

  .bonus__text:not(:last-child) {
    margin-bottom: 12px;
  }

  .bonus__button {
    min-width: 273px;
  }

  .bonus-cards__list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    justify-content: space-between;
    margin-top: -20px;
  }

  .bonus-cards-list__item {
    margin-top: 20px;
  }

  .bonus-cards-list-item__article h1,
  .bonus-cards-list-item__article h2,
  .bonus-cards-list-item__article h3,
  .bonus-cards-list-item__article h4,
  .bonus-cards-list-item__article h5,
  .bonus-cards-list-item__article h6 {
    font-size: 24px;
  }

  .games-list-item__button {
    font-size: 16px;
  }

  .download__section {
    min-height: 182px;
  }

  .footer__section {
    padding-top: 30px;
    padding-bottom: 40px;
  }

  .footer__top {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .footer__top:not(:last-child) {
    margin-bottom: 28px;
  }

  .footer__middle {
    padding: 20px 15px;
  }

  .footer-middle__logo {
    margin-right: 40px;
  }

  .footer-middle__article {
    margin-right: 20px;
  }
}

@media (min-width: 991.98px) {
  .cover__content {
    min-height: 440px;
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .cover__wrapper {
    margin: 0 auto;
  }

  .cover__breadcrumbs:not(:last-child) {
    margin-bottom: 8px;
  }

  .bonus__section {
    min-height: 424px;
    padding: 20px 32px;
  }

  .faq__title.l {
    font-size: 48px;
  }

  .faq__list li > button {
    font-size: 24px;
  }

  .bonus-cards-list-item__article h1:not(:last-child),
  .bonus-cards-list-item__article h2:not(:last-child),
  .bonus-cards-list-item__article h3:not(:last-child),
  .bonus-cards-list-item__article h4:not(:last-child),
  .bonus-cards-list-item__article h5:not(:last-child),
  .bonus-cards-list-item__article h6:not(:last-child) {
    margin-bottom: 12px;
  }

  .bonus-cards-list-item__article > *:not(:last-child) {
    margin-bottom: 32px;
  }

  .bonus-cards-list-item__article > *:not(h1, h2, h3, h4, h5, h6) {
    max-width: 269px;
    margin: 0 auto;
  }

  .download__section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    justify-content: space-between;
    padding: 20px 20px;
  }

  .download__logo {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 297px;
    -moz-box-flex: 0;
    flex: 0 1 297px;
    margin-right: 10px;
    margin-left: 10px;
  }

  .download__button {
    max-width: 273px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 273px;
    -moz-box-flex: 0;
    flex: 0 0 273px;
  }
}

@media (min-width: 1270px) {
  .bonus__image {
    margin-right: 128px;
  }

  .download__section {
    padding: 20px 30px;
  }

  .download__image {
    margin-left: 45px;
  }
}

@media (max-width: 1270px) {
  .cover__image {
    right: -135px;
    width: 336px;
    height: 352px;
  }

  .cover__image.left {
    right: unset;
    left: -135px;
  }
}

@media (max-width: 991.98px) {
  .cover__content {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .cover__rating {
    margin: 0 auto;
  }

  .cover__wrapper {
    max-width: 100%;
  }

  .cover__image {
    display: none;
  }

  .cover__small-text {
    margin: 0 auto;
  }

  .bonus__text {
    font-size: 20px;
  }

  .bonus__image {
    margin-top: -32px;
    margin-bottom: -32px;
  }

  .facts__title:not(:last-child) {
    margin-bottom: 16px;
  }

  .faq__list li > button {
    padding: 15px 70px 15px 20px;
  }

  .faq__list li > button span {
    width: 30px;
    height: 30px;
  }

  .bonus-cards-list__item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 48.7903225806%;
    -moz-box-flex: 0;
    flex: 0 1 48.7903225806%;
  }

  .download__section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
    text-align: center;
  }

  .download__image {
    display: none;
  }

  .download__logo {
    margin: 0 auto 20px;
  }
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }

  .content {
    padding-left: 10px;
    padding-right: 10px;
  }

  .page__content {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .page__content > *:not(:last-child) {
    margin-bottom: 10px;
  }

  #burger {
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    position: relative;
    z-index: 10;
    display: block;
    width: 48px;
    height: 48px;
    padding: 2px;
    cursor: pointer;
    border: 1px solid #fff;
  }

  #burger span,
  #burger::before,
  #burger::after {
    position: absolute;
    left: 50%;
    width: 60%;
    height: 2px;
    content: "";
    background-color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }

  #burger::before {
    top: 31%;
  }

  #burger::after {
    bottom: 31%;
  }

  #burger span {
    top: -webkit-calc(50% - 1px);
    top: -moz-calc(50% - 1px);
    top: calc(50% - 1px);
  }

  .menu-open #burger span {
    -webkit-transform: translateX(-50%) scale(0);
    -moz-transform: translateX(-50%) scale(0);
    -o-transform: translateX(-50%) scale(0);
    transform: translateX(-50%) scale(0);
  }

  .menu-open #burger::before {
    top: -webkit-calc(50% - 1px);
    top: -moz-calc(50% - 1px);
    top: calc(50% - 1px);
    -webkit-transform: translateX(-50%) rotate(-45deg);
    -moz-transform: translateX(-50%) rotate(-45deg);
    -o-transform: translateX(-50%) rotate(-45deg);
    transform: translateX(-50%) rotate(-45deg);
  }

  .menu-open #burger::after {
    bottom: -webkit-calc(50% - 1px);
    bottom: -moz-calc(50% - 1px);
    bottom: calc(50% - 1px);
    -webkit-transform: translateX(-50%) rotate(45deg);
    -moz-transform: translateX(-50%) rotate(45deg);
    -o-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg);
  }

  .button {
    padding: 10px 24px;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 .title {
    font-size: 24px;
  }

  h1:before,
  h1:after,
  h2:before,
  h2:after,
  h3:before,
  h3:after,
  h4:before,
  h4:after,
  h5:before,
  h5:after,
  h6 .title:before,
  h6 .title:after {
    width: 78.4px;
    height: 15.4px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 78.4px;
    -moz-box-flex: 0;
    flex: 0 0 78.4px;
  }

  h1,
  .title.xxl {
    font-size: 40px;
  }

  h2,
  .title.xl {
    font-size: 32px;
  }

  h3,
  .title.l {
    font-size: 26px;
  }

  h4,
  .title.m {
    font-size: 21px;
  }

  .section {
    padding: 15px;
  }

  .breadcrumbs {
    font-size: 14px;
  }

  table tr,
  .table tr {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    padding: 10px;
  }

  table tr,
  .table tr {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
    width: 80%;
    margin: 0 auto;
    text-align: center;
  }

  table tr:not(:last-child),
  .table tr:not(:last-child) {
    margin-bottom: 20px;
  }

  table th > div:first-of-type,
  .table th > div:first-of-type {
    margin-right: 10px;
  }

  .header__menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: -webkit-calc(100vh - 78px);
    max-height: -moz-calc(100vh - 78px);
    max-height: calc(100vh - 78px);
    padding: 20px;
    overflow-y: auto;
    text-align: center;
    background-color: var(--color-bg, #1c191a);
    -webkit-box-shadow: 0 5px 5px 0 rgba(255, 255, 255, 0.2);
    -moz-box-shadow: 0 5px 5px 0 rgba(255, 255, 255, 0.2);
    box-shadow: 0 5px 5px 0 rgba(255, 255, 255, 0.2);
    -webkit-transform: translateY(-200vh);
    -moz-transform: translateY(-200vh);
    -o-transform: translateY(-200vh);
    transform: translateY(-200vh);
    opacity: 0;
    visibility: hidden;
  }

  .menu-open .header__menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }

  .header__menu > *:not(:last-child) {
    margin-bottom: 20px;
  }

  .header-menu__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
  }

  .header-menu__list a {
    font-size: 18px;
    padding: 10px 24px 10px 52px;
  }

  .header-menu__list a:before {
    right: unset;
    left: 6px;
  }

  .header-menu__sub {
    display: none;
  }

  .header-menu-sub__dropdown a {
    padding: 15px;
    font-size: 18px;
  }

  .header-buttons__button {
    display: none;
  }

  .bonus__section {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
    text-align: center;
  }

  .bonus__section > *:not(:last-child) {
    margin-bottom: 20px;
  }

  .bonus__text {
    font-size: 18px;
  }

  .bonus__image {
    max-height: 188px;
    max-width: 156px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 188px;
    -moz-box-flex: 0;
    flex: 0 1 188px;
    margin: 0 auto -20px;
  }

  .facts__title {
    text-align: center;
  }

  .faq__list li:not(:last-child) {
    margin-bottom: 10px;
  }

  .faq__list li > div {
    padding: 15px;
  }

  .bonus-cards__list > *:not(:last-child) {
    margin-bottom: 20px;
  }

  .bonus-cards-list-item__article h1,
  .bonus-cards-list-item__article h2,
  .bonus-cards-list-item__article h3,
  .bonus-cards-list-item__article h4,
  .bonus-cards-list-item__article h5,
  .bonus-cards-list-item__article h6 {
    font-size: 20px;
  }

  .games-list__item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 48.3870967742%;
    -moz-box-flex: 0;
    flex: 0 1 48.3870967742%;
  }

  .games-list-item__wrapper {
    padding: 10px;
  }

  .footer__top {
    overflow-x: auto;
  }

  .footer__top li {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    flex: 0 0 auto;
  }

  .footer__middle {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
  }

  .footer__middle > *:not(:last-child) {
    margin-bottom: 10px;
  }

  .footer-middle__years {
    font-size: 20px;
    width: 60px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 60px;
    -moz-box-flex: 0;
    flex: 0 0 60px;
    height: 60px;
  }
}

@media (min-width: 991.98px) {
  .bonus__image {
    flex: 0 1 400px; /* збільшуємо розмір */
    margin-right: 60px; /* зменшуємо відступ справа */
    align-self: center; /* центруємо по вертикалі */
    transform: translateX(-40px); /* зміщуємо ліворуч */
  }
  
  .bonus__image img {
    width: 100%;
    height: auto;
    max-height: none;
  }
}

@media (max-width: 767.98px) {
  .bonus__image {
    max-height: 240px; /* збільшуємо для мобільних */
    max-width: 200px;
  }
}

@media (max-width: 767.98px) and (max-width: 767.98px) {
  #burger {
    width: 40px;
    height: 40px;
  }
}

@media (max-width: 479.98px) {
  .button {
    width: 100%;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 .title {
    font-size: 16px;
  }

  h1:before,
  h1:after,
  h2:before,
  h2:after,
  h3:before,
  h3:after,
  h4:before,
  h4:after,
  h5:before,
  h5:after,
  h6 .title:before,
  h6 .title:after {
    content: none;
  }

  h1,
  .title.xxl {
    font-size: 32px;
  }

  h2,
  .title.xl {
    font-size: 24px;
  }

  h3,
  .title.l {
    font-size: 18px;
  }

  h4,
  .title.m {
    font-size: 18px;
  }

  table tr,
  .table tr {
    width: 100%;
  }

  article > *:not(h1, h2, h3, h4, h5, h6),
  .article > *:not(h1, h2, h3, h4, h5, h6) {
    text-align: justify;
  }

  article h1,
  article h2,
  article h3,
  article h4,
  article h5,
  article h6,
  .article h1,
  .article h2,
  .article h3,
  .article h4,
  .article h5,
  .article h6 {
    text-align: center;
  }

  .bonus__text {
    font-size: 14px;
  }

  .facts__title {
    text-align: center;
    display: block;
  }

  .bonus-cards-list-item__article h1,
  .bonus-cards-list-item__article h2,
  .bonus-cards-list-item__article h3,
  .bonus-cards-list-item__article h4,
  .bonus-cards-list-item__article h5,
  .bonus-cards-list-item__article h6 {
    font-size: 18px;
  }

  .games-list__item {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -moz-box-flex: 1;
    flex: 1 1 100%;
  }
}

@media (min-width: 479.98px) and (max-width: 767.98px) {
  .bonus-cards-list__item {
    width: 70%;
    margin: 20px auto 0;
  }
}

@media (any-hover: hover) {
  .button:hover {
    opacity: 0.8;
  }

  .logo:hover {
    opacity: 0.7;
  }

  .breadcrumbs a:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }

  .breadcrumbs a:hover:not([href]) {
    color: inherit;
    text-decoration: inherit;
    cursor: default;
    background-color: unset;
  }

  table a:hover,
  .table a:hover {
    text-decoration: underline;
  }

  .header-menu__list a:hover {
    opacity: 0.7;
  }

  .header-menu-sub__dropdown a:hover {
    opacity: 1;
  }

  .header-menu-sub__dropdown a:hover::before {
    width: 100%;
  }

  .header-menu-sub__dropdown a:hover svg {
    fill: #9e2b86;
  }
}