/* Interactive controls for the Metaworking landing page. */
.brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn,
.brz .brz-popup2 a.brz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 52px;
  padding: 13px 22px;
  border: 1px solid rgba(78, 62, 177, .2) !important;
  border-radius: 15px !important;
  background: linear-gradient(135deg, #7968ec, #5541c3) !important;
  box-shadow: 0 8px 18px rgba(76, 61, 168, .16), 0 2px 5px rgba(26, 21, 70, .07) !important;
  color: #fff !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 14px;
  font-weight: 800 !important;
  line-height: 1.25;
  letter-spacing: -.015em !important;
  text-align: center;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, border-color .2s ease !important;
  -webkit-tap-highlight-color: transparent;
}

.brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn .brz-span,
.brz .brz-popup2 a.brz-btn .brz-span { color: inherit !important; }

.brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn .brz-icon-svg,
.brz .brz-popup2 a.brz-btn .brz-icon-svg {
  flex: none;
  transition: transform .2s ease;
}

.brz :is(#garanty, #pay, #reviews, #cta) a.brz-btn[href^="https://telegram.me"],
.brz .brz-popup2 a.brz-btn[href^="https://telegram.me"] {
  border-color: #259ad3 !important;
  background: linear-gradient(135deg, #36b8e9, #197fca) !important;
  box-shadow: 0 8px 18px rgba(24, 137, 200, .2), 0 2px 5px rgba(24, 137, 200, .08) !important;
}

.brz :is(#garanty, #pay, #reviews, #cta) a.brz-btn[href^="viber:"],
.brz .brz-popup2 a.brz-btn[href^="viber:"] {
  border-color: #7552cf !important;
  background: linear-gradient(135deg, #9471e8, #6945bd) !important;
  box-shadow: 0 8px 18px rgba(105, 69, 189, .2), 0 2px 5px rgba(105, 69, 189, .08) !important;
}

.brz :is(#work, #reviews, #faq, #friends) a.brz-btn[data-brz-link-type="popup"],
.brz #first-display a.brz-btn[data-brz-link-type="popup"] {
  border-color: #50d6a2 !important;
  background: linear-gradient(135deg, #84efc8, #4bd7a0) !important;
  box-shadow: 0 8px 20px rgba(35, 173, 120, .22), 0 2px 5px rgba(35, 173, 120, .08) !important;
  color: #143a3b !important;
}

.brz #first-display .brz-btn.brz-css-qjxsg {
  border-color: rgba(255, 255, 255, .56) !important;
  background: rgba(255, 255, 255, .11) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .12) !important;
  color: #fff !important;
  backdrop-filter: blur(8px);
}

.brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn:active,
.brz .brz-popup2 a.brz-btn:active { transform: translateY(1px) scale(.99) !important; }

@media (hover: hover) {
  .brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn:hover,
  .brz .brz-popup2 a.brz-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 30px rgba(53, 49, 136, .24) !important;
    filter: brightness(1.055);
  }
  .brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn:hover .brz-icon-svg,
  .brz .brz-popup2 a.brz-btn:hover .brz-icon-svg { transform: translateX(2px); }
}

.brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn:focus-visible,
.brz .brz-popup2 a.brz-btn:focus-visible,
.brz #reviews .review-zoom:focus-visible,
.brz #reviews .brz-slick-slider__arrow:focus-visible,
.brz #faq .brz-accordion__nav:focus-visible,
.brz .brz-popup2__close:focus-visible,
.brz .brz-mm-menu__icon:focus-visible {
  outline: 3px solid #f7be67 !important;
  outline-offset: 4px !important;
}

/* The whole review card opens the viewer. Give its visible cue a full touch target. */
.brz #reviews .review-zoom__hint {
  min-height: 44px;
  margin-top: 14px;
  padding: 10px 20px;
  border: 1px solid #d1cafa;
  border-radius: 13px;
  background: linear-gradient(135deg, #fff, #f4f0ff);
  box-shadow: 0 7px 17px rgba(69, 52, 149, .11);
  color: #4f3db7;
  font: 800 12px/1.2 Montserrat, Arial, sans-serif;
  letter-spacing: 0;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

.brz #reviews .review-zoom:hover .review-zoom__hint,
.brz #reviews .review-zoom:focus-visible .review-zoom__hint {
  transform: translateY(-2px);
  border-color: #5944c4;
  background: linear-gradient(135deg, #7765e3, #5541c3);
  box-shadow: 0 12px 24px rgba(72, 53, 166, .22);
  color: #fff;
}

/* Keep carousel controls together below the cards and clear of the heading. */
.brz #reviews .brz-carousel__slider.slick-initialized {
  margin-bottom: 80px !important;
  overflow: visible !important;
}
.brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow {
  top: auto !important;
  bottom: -60px !important;
  width: 48px !important;
  height: 48px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ddd8f5;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 8px 18px rgba(49, 38, 118, .13) !important;
  color: #5843bd !important;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease !important;
}
.brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow-prev {
  left: calc(50% - 56px) !important;
  right: auto !important;
  transform: rotate(180deg) !important;
}
.brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow-next {
  right: calc(50% - 56px) !important;
  left: auto !important;
  transform: none !important;
  border-color: #604dc9;
  background: linear-gradient(135deg, #7866e4, #5340bd) !important;
  box-shadow: 0 8px 18px rgba(74, 53, 159, .25) !important;
  color: #fff !important;
}
.brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow svg {
  width: 19px;
  height: 19px;
}
@media (hover: hover) {
  .brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow-prev:hover {
    transform: translateY(-2px) rotate(180deg) !important;
    background: #f4f0ff !important;
    box-shadow: 0 13px 24px rgba(49, 38, 118, .18) !important;
  }
  .brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow-next:hover {
    transform: translateY(-2px) !important;
    background: linear-gradient(135deg, #8777ed, #614dce) !important;
    box-shadow: 0 13px 24px rgba(74, 53, 159, .3) !important;
  }
}
.brz #reviews .brz-carousel__slider > .brz-slick-slider__arrow:active { filter: brightness(.94); }

/* One text link in the review section also acts as a call to action. */
.brz #reviews .brz-rich-text a.link--external {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #d9d2f5;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 5px 14px rgba(65, 52, 130, .07);
  color: #5140af !important;
  font: 800 12px/1.2 Montserrat, Arial, sans-serif;
  text-decoration: none !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.brz #reviews .brz-rich-text a.link--external u { text-decoration: none; color: inherit; }
.brz #reviews .brz-rich-text a.link--external::after { content: " ↗"; margin-left: 6px; font-size: 15px; }
.brz #reviews .brz-rich-text a.link--external:hover {
  transform: translateY(-2px);
  border-color: #8b79df;
  box-shadow: 0 9px 20px rgba(65, 52, 130, .14);
}

.brz #faq .brz-accordion__nav { cursor: pointer; }
.brz #faq .brz-accordion__item:not(.brz-accordion__item--active) .brz-accordion__nav:hover { background: #f2efff !important; }
.brz .brz-popup2 .brz-container__wrap .brz-popup2__close {
  display: flex !important;
  align-items: center;
  justify-content: center;
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
  bottom: auto !important;
  width: 44px;
  height: 44px;
  border: 1px solid #e1def3;
  border-radius: 12px;
  background: #f7f5ff;
  box-shadow: 0 4px 12px rgba(35, 32, 92, .08);
  color: #4b438b !important;
  cursor: pointer;
  z-index: 5;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.brz .brz-popup2 .brz-container__wrap .brz-popup2__close .brz-icon-svg {
  font-size: 18px !important;
}
.brz .brz-popup2 .brz-container__wrap .brz-popup2__close:hover {
  background: #6350ca;
  color: #fff !important;
  transform: rotate(90deg);
}
.brz .brz-mm-menu__icon { border-radius: 11px; transition: background .2s ease, color .2s ease; }
.brz .brz-mm-menu__icon:hover { background: rgba(255, 255, 255, .13); }

@media (max-width: 767px) {
  .brz :is(#first-display, #garanty, #work, #pay, #reviews, #faq, #cta, #friends) a.brz-btn,
  .brz .brz-popup2 a.brz-btn { min-height: 50px; padding: 12px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .brz a.brz-btn,
  .brz #reviews .review-zoom__hint,
  .brz #reviews .brz-slick-slider__arrow,
  .brz #reviews .brz-rich-text a.link--external,
  .brz .brz-popup2__close,
  .brz .brz-mm-menu__icon { transition: none !important; }
  .brz a.brz-btn:hover,
  .brz #reviews .review-zoom:hover .review-zoom__hint,
  .brz #reviews .brz-slick-slider__arrow:hover,
  .brz #reviews .brz-rich-text a.link--external:hover,
  .brz .brz-popup2__close:hover { transform: none !important; }
}