/* ============================================================
   mobile.css — 2026-05-18 v3 (full mobile-first redesign)
   Scope: ≤767px only. Loaded via <link media="(max-width:767px)">.
   Strategy: hide desktop-only blocks via [data-mobile-only] machinery,
   show purpose-built mobile blocks. Everything !important to defeat
   styles.css specificity.
   ============================================================ */

/* ========== GLOBAL ========== */
html, body {
  overflow-x: hidden !important;
  -webkit-text-size-adjust: 100% !important;
  width: 100vw !important;
  max-width: 100vw !important;
}
body {
  min-width: 0 !important;
  max-width: 100vw !important;
  padding-top: 0 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  background: #0E121B !important;
}
*, *::before, *::after { box-sizing: border-box !important; }
img, svg, video {
  max-width: 100% !important;
  height: auto !important;
}

/* ========== MOBILE-ONLY VISIBILITY ========== */
[data-mobile-only] { display: block !important; }
.cases__mobile, .choose__mobile, .solutions__mobile {
  display: block !important;
}

/* Hide desktop versions — surgical (not parents that contain mobile blocks) */
.cases .card-view,
.cases .tabs,
.cases__title,
.choose__variants,
.choose__table,
.choose__wallet,
.solutions .tabs {
  display: none !important;
}
.cases > .header-3,
.choose > .header-3,
.solutions > .header-3,
.solutions .container > .header-3 {
  display: block !important;
}

/* ========== TYPOGRAPHY ========== */
h1, .h1 { font-size: 28px !important; line-height: 1.2 !important; margin: 0 0 12px !important; }
h2, .h2 { font-size: 22px !important; line-height: 1.25 !important; margin: 0 0 12px !important; }
h3, .h3 { font-size: 18px !important; line-height: 1.3 !important; margin: 0 0 8px !important; }
h4, .h4 { font-size: 16px !important; }
h5, .h5 { font-size: 15px !important; }
h6, .h6 { font-size: 14px !important; }
.header-3__title { font-size: 22px !important; line-height: 1.25 !important; }
.header-3__sub-title { font-size: 14px !important; line-height: 1.5 !important; }
.header-main__sub-title, .header-product__sub-title {
  font-size: 14px !important; line-height: 1.5 !important;
}

/* ========== CONTAINERS ========== */
.container {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 16px !important;
  margin: 0 !important;
}
.wide-back {
  width: 100% !important;
  max-width: 100% !important;
  padding: 24px 16px !important;
  border-radius: 12px !important;
}
section { padding: 32px 0 !important; }

/* ========== TOP NAV (with hamburger) ========== */
.top {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  padding: 10px 12px !important;
  gap: 8px !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 999 !important;
  background: rgba(14, 18, 27, 0.95) !important;
  backdrop-filter: blur(8px) !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
.top__logo { flex-shrink: 0 !important; }
.top__logo img { height: 22px !important; width: auto !important; }
.top__nav {
  display: none !important;            /* desktop nav hidden on mobile */
}
.top__buttons {
  display: flex !important;
  gap: 6px !important;
  margin-left: auto !important;
  align-items: center !important;
}
.top__buttons .btn {
  padding: 7px 12px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
}
.top__buttons .btn-primary { /* Telegram mini-app */
  display: none !important;            /* hide on mobile, available in drawer */
}
.top__buttons .btn-secondary { /* Get your card — solid violet, no glow */
  background: #6C52FF !important;
  color: #fff !important;
  border: none !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}
.top__buttons .btn-secondary:hover {
  background: #5A45E5 !important;
  box-shadow: none !important;
}
.top__buttons .btn-secondary:active,
.top__buttons .btn-secondary:focus {
  box-shadow: none !important;
  outline: none !important;
}

/* Lang toggle compact */
.lang-toggle {
  position: static !important;
  margin: 0 !important;
  padding: 2px !important;
  flex-shrink: 0 !important;
}
.lang-toggle__option {
  padding: 4px 8px !important;
  font-size: 11px !important;
}

/* Burger button */
.top__burger {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  border: none !important;
  background: rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
}
.top__burger span {
  display: block !important;
  width: 18px !important;
  height: 2px !important;
  background: #fff !important;
  border-radius: 2px !important;
  transition: transform 0.2s ease, opacity 0.2s ease !important;
}

/* Drawer */
.mobile-drawer-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, 0.6) !important;
  z-index: 9998 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.25s ease !important;
}
.mobile-drawer-overlay.is-open {
  opacity: 1 !important;
  pointer-events: auto !important;
}
.mobile-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 85vw !important;
  max-width: 320px !important;
  background: #181B25 !important;
  z-index: 9999 !important;
  transform: translateX(100%) !important;
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 16px !important;
  overflow-y: auto !important;
  box-shadow: -8px 0 32px rgba(0,0,0,0.4) !important;
}
.mobile-drawer.is-open { transform: translateX(0) !important; }
.mobile-drawer__head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 24px !important;
}
.mobile-drawer__logo img { height: 22px !important; }
.mobile-drawer__close {
  width: 36px !important; height: 36px !important;
  background: rgba(255,255,255,0.06) !important;
  border: none !important; border-radius: 8px !important;
  color: #fff !important; font-size: 18px !important;
  cursor: pointer !important;
}
.mobile-drawer__nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin-bottom: 24px !important;
}
.mobile-drawer__nav a {
  padding: 14px 12px !important;
  color: #fff !important;
  font-size: 16px !important;
  text-decoration: none !important;
  border-radius: 8px !important;
  transition: background 0.15s ease !important;
}
.mobile-drawer__nav a:hover { background: rgba(255,255,255,0.06) !important; }
.mobile-drawer__cta {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 24px !important;
}
.mobile-drawer__cta .btn { width: 100% !important; }
.mobile-drawer__footer {
  margin-top: auto !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  font-size: 12px !important;
}
.mobile-drawer__footer a { color: #99A0AE !important; text-decoration: none !important; }

/* ========== HERO ========== */
.header-main {
  padding: 20px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  text-align: center !important;
}
.header-main__buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 6px !important;
}
.header-main__buttons > * {
  font-size: 11px !important;
  padding: 6px 10px !important;
}
.header-main__title {
  padding: 0 !important;
  text-align: center !important;
}
.header-main__title .h2,
.header-main__title h1.h2 {
  font-size: 26px !important;
  line-height: 1.2 !important;
}
.header-main__sub-title { font-size: 14px !important; padding: 0 !important; }
.header-main__sub-title br { display: none !important; }
.header-main__image { width: 100% !important; height: auto !important; margin: 0 auto !important; }
.btn-round { padding: 12px 24px !important; font-size: 14px !important; }

/* ========== BACKED BY ========== */
.backed {
  padding: 16px !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.backed__sys { flex-wrap: wrap !important; justify-content: center !important; gap: 16px !important; }
.backed__sys img { height: 20px !important; }

/* ========== CASES MOBILE ========== */
.cases__mobile {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 0 !important;
}
.cases__mobile-card {
  background: #181B25 !important;
  border-radius: 16px !important;
  padding: 20px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.cases__mobile-card-img {
  width: 100% !important;
  aspect-ratio: 1944 / 1224 !important;
  height: auto !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border-radius: 12px !important;
}
.cases__mobile-card-img[data-card="visa"] {
  background-image: url('../images/card-art-visa.png') !important;
}
.cases__mobile-card-img[data-card="mastercard"] {
  background-image: url('../images/card-art-mastercard.png') !important;
}
.cases__mobile-card-title {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #fff !important;
  background: linear-gradient(135deg, #fff 0%, #99A0AE 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.cases__mobile-card-tagline {
  font-size: 13px !important;
  color: #99A0AE !important;
  margin-top: -4px !important;
}
.cases__mobile-card-price {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #A3FFE4 !important;
}
.cases__mobile-card-desc {
  font-size: 13px !important;
  color: #CACFD8 !important;
  line-height: 1.5 !important;
}
.cases__mobile-card-facts {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}
.cases__mobile-card-facts > div {
  background: #0E121B !important;
  padding: 10px !important;
  border-radius: 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.cases__mobile-card-facts span {
  font-size: 10px !important;
  color: #99A0AE !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}
.cases__mobile-card-facts b {
  font-size: 13px !important;
  color: #fff !important;
  font-weight: 600 !important;
}
.cases__mobile-card-supports {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
  font-size: 12px !important;
}
.cases__mobile-card-supports .ok { color: #5fe3a8 !important; }
.cases__mobile-card-supports .bad { color: #ff6b6b !important; }
.cases__mobile-card-cta {
  width: 100% !important;
  text-align: center !important;
  padding: 14px !important;
}

/* ========== CHOOSE MOBILE ========== */
.choose__mobile {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
.choose__mobile-card {
  background: #181B25 !important;
  border-radius: 16px !important;
  padding: 24px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.choose__mobile-card--mc {
  background: linear-gradient(135deg, #181B25 0%, #221d3e 100%) !important;
  border: 1px solid rgba(108,82,255,0.3) !important;
}
.choose__mobile-card-tag {
  font-size: 11px !important;
  color: #5fe3a8 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 600 !important;
}
.choose__mobile-card-name {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #fff !important;
}
.choose__mobile-card-price {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #A3FFE4 !important;
  margin: 4px 0 !important;
}
.choose__mobile-card-cta {
  width: 100% !important;
  padding: 14px !important;
  text-align: center !important;
}
.choose__mobile-card-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 12px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}
.choose__mobile-card-list li {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  font-size: 13px !important;
}
.choose__mobile-card-list span { color: #99A0AE !important; }
.choose__mobile-card-list b { color: #fff !important; font-weight: 600 !important; text-align: right !important; }
.choose__mobile-card-supports {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  font-size: 13px !important;
  margin-top: 8px !important;
}
.choose__mobile-card-supports .ok { color: #5fe3a8 !important; }
.choose__mobile-card-supports .bad { color: #ff6b6b !important; }

/* ========== CONTROL (4 features) — force vertical ========== */
.control__inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  grid-template-columns: 1fr !important;
}
.control__item {
  padding: 20px 16px !important;
  background: #181B25 !important;
  border-radius: 12px !important;
  width: 100% !important;
}
.control__badges { flex-wrap: wrap !important; gap: 6px !important; }
.control::before, .control::after,
.control__item::before, .control__item::after,
.control__bg { display: none !important; }

/* ========== SECURITY — vertical list with icons ========== */
.security__tiles, .tiles-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  grid-template-columns: 1fr !important;
}
.tiles-row__item {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px !important;
  background: #181B25 !important;
  background-image: none !important;
  border-radius: 12px !important;
  position: relative !important;
}
.tiles-row__item .h5 {
  font-size: 16px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  min-width: 120px !important;
  color: #fff !important;
}
.tiles-row__item > *:not(.h5) {
  font-size: 13px !important;
  color: #99A0AE !important;
}
.tiles-row__item::before,
.tiles-row__item::after { display: none !important; }

/* ========== PLATFORM (4 cards stack) ========== */
.platform__inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  grid-template-columns: 1fr !important;
}
.platform__apple, .platform__telegram, .platform__enterprise, .platform__networks {
  width: 100% !important;
  padding: 20px 16px !important;
  box-sizing: border-box !important;
  background: #181B25 !important;
  border-radius: 12px !important;
}
.platform__wrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  grid-template-columns: 1fr !important;
}
.platform__variant-options {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  font-size: 13px !important;
}

/* ========== SOLUTIONS MOBILE (accordion via <details>) ========== */
.solutions__mobile {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.solutions__mobile-item {
  background: #181B25 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.solutions__mobile-item summary {
  list-style: none !important;
  padding: 16px !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
.solutions__mobile-item summary::-webkit-details-marker { display: none !important; }
.solutions__mobile-item summary::after {
  content: '▾' !important;
  color: #99A0AE !important;
  font-size: 14px !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
  transition: transform 0.2s ease !important;
}
.solutions__mobile-item[open] summary::after { transform: rotate(180deg) !important; }
.solutions__mobile-q {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #fff !important;
}
.solutions__mobile-badge {
  font-size: 11px !important;
  padding: 4px 10px !important;
  background: rgba(108,82,255,0.15) !important;
  color: #B9A8FF !important;
  border-radius: 999px !important;
  border: 1px solid rgba(108,82,255,0.3) !important;
}
.solutions__mobile-body {
  padding: 0 16px 16px !important;
  font-size: 13px !important;
  color: #CACFD8 !important;
  line-height: 1.5 !important;
}

/* ========== HIW (How it works) ========== */
.hiw__inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  grid-template-columns: 1fr !important;
}
.hiw__image { display: none !important; }
.v-tabs { display: flex !important; flex-direction: column !important; gap: 8px !important; }
.v-tab { padding: 16px !important; font-size: 13px !important; }

/* ========== CTA blocks ========== */
.cta__inner { padding: 24px 16px !important; }
.cta__chain { display: none !important; }
.cta__buttons {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.cta__buttons > * {
  width: 100% !important;
  text-align: center !important;
  padding: 14px !important;
}
.cta__badges {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 6px !important;
  font-size: 11px !important;
}

/* ========== TESTIMONIALS ========== */
.testimonials__advantages-wrapper {
  display: flex !important;
  flex-direction: column !important;
  padding: 20px 16px !important;
  background-image: none !important;
  background: #181B25 !important;
  gap: 12px !important;
}
.testimonials__advantages {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
  width: 100% !important;
}
.testimonials__advantages > * { font-size: 12px !important; }
.testimonials__advantages .h6 { font-size: 13px !important; margin: 0 0 4px !important; }
.testimonials__cta { padding: 24px 0 !important; }

/* ========== REFERRAL — tier cards ========== */
.referral__table {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.referral__table-row.table-header { display: none !important; }
.referral__table-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px 12px !important;
  padding: 14px 16px !important;
  background: #181B25 !important;
  border-radius: 12px !important;
  font-size: 13px !important;
  align-items: baseline !important;
}
.referral__table-row > div:first-child {
  grid-column: 1 / -1 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 4px !important;
}
.referral__table-row > div:not(:first-child)::before {
  content: attr(data-label) !important;
  font-size: 10px !important;
  color: #99A0AE !important;
  text-transform: uppercase !important;
  display: block !important;
  margin-bottom: 2px !important;
}
.referral__table-row.table-footer {
  grid-template-columns: 1fr !important;
}

/* ========== PROMO ========== */
.form-inline.form-promocode {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.form-inline.form-promocode .form-control,
.form-inline.form-promocode .btn { width: 100% !important; }

/* ========== FAQ ========== */
.faq .container { padding: 0 16px !important; }
.accordion__item { padding: 12px 16px !important; }
.accordion__title { font-size: 14px !important; line-height: 1.3 !important; }
.accordion__text { font-size: 13px !important; line-height: 1.5 !important; padding: 8px 0 0 !important; }

/* ========== CHOOSE WALLET (single column, no bg image) ========== */
.choose__wallet {
  display: none !important;            /* hidden on mobile — info already in cards above */
}

/* ========== FOOTER ========== */
.footer .container { padding: 0 16px !important; }
.footer__top {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 16px 0 !important;
  align-items: flex-start !important;
}
.footer__middle {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px 12px !important;
  padding: 16px 0 !important;
}
.footer__nav {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.footer__nav-title { font-size: 13px !important; margin: 0 0 4px !important; }
.footer__nav a { font-size: 13px !important; word-wrap: break-word !important; }
.footer__bottom {
  padding: 16px 0 !important;
  text-align: center !important;
  font-size: 11px !important;
  line-height: 1.6 !important;
}
.footer__logo img { height: 28px !important; }
.socials img, .socials svg { width: 20px !important; height: 20px !important; }

/* ========== HEADER-PRODUCT (product.html hero) ========== */
.header-product { padding: 24px 0 !important; }
.header-product__title { text-align: center !important; }
.header-product__title .h2,
.header-product__title h1.h2 { font-size: 26px !important; line-height: 1.2 !important; }
.header-product__buttons {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  align-items: stretch !important;
}
.header-product__buttons > * {
  width: 100% !important;
  justify-content: center !important;
  text-align: center !important;
}
.header-product__buttons:first-of-type {
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

/* PRODUCT page extra */
.products {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
.products__col {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}
.product { padding: 16px !important; }
.product-start__row {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
.product-start__col img { width: 100% !important; height: auto !important; }
.steps { gap: 12px !important; }
.steps__item { padding: 14px !important; }

/* ========== AI CHAT WIDGET ========== */
#ai-assistant-widget,
.ai-assistant-widget,
.assistant-widget,
[class*="assistant-widget"] {
  bottom: 12px !important;
  right: 12px !important;
  z-index: 9990 !important;
}

/* ========== BUTTONS general ========== */
.btn-lg { padding: 12px 18px !important; font-size: 14px !important; }
.btn-md { padding: 10px 14px !important; font-size: 13px !important; }

/* ========== DECORATIVE — kill everywhere ========== */
body.main-page::before,
body.main-page::after,
body.product-page::before,
body.product-page::after,
.platform__bg,
.control::before,
.control::after {
  display: none !important;
}

/* ========== SMALLEST PHONES (≤380px) ========== */
@media (max-width: 380px) {
  h1, .h1, .header-main__title h1.h2, .header-product__title h1.h2 { font-size: 22px !important; }
  h2, .h2, .header-3__title { font-size: 18px !important; }
  .testimonials__advantages { grid-template-columns: 1fr !important; }
  .cases__mobile-card-facts,
  .cases__mobile-card-supports,
  .platform__variant-options { grid-template-columns: 1fr !important; }
  .footer__middle { grid-template-columns: 1fr !important; }
  .top__buttons .btn { padding: 6px 10px !important; font-size: 11px !important; }
}

/* ========== FIXES v3.1 (2026-05-18) ========== */

/* Header-3 badges — wrap properly, no horizontal scroll */
.header-3__badges {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 8px !important;
}
.header-3__badge-item {
  font-size: 12px !important;
  padding: 8px 12px !important;
  white-space: nowrap !important;
}

/* Header-3 own padding — needed when section.header-3 is direct child (no .container) */
.header-3,
.cases > .header-3,
.choose > .header-3,
.solutions > .header-3,
.solutions .container > .header-3 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Sub-title contrast lift — avoid lavender bias on mobile screens */
.header-3__sub-title { color: #D7DCE5 !important; }

/* Platform Telegram — text was dark on dark background, fix to white */
.platform__telegram {
  background: linear-gradient(135deg, #5a4bda 0%, #6C52FF 100%) !important;
  color: #fff !important;
}
.platform__telegram h6,
.platform__telegram .h6,
.platform__telegram .platform__variant-options,
.platform__telegram .platform__variant-options i,
.platform__telegram > div {
  color: #fff !important;
}

/* Platform networks — single column 2 cols inside variant-options */
.platform__networks {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  grid-template-columns: 1fr !important;
}
.platform__networks .h4,
.platform__networks h4 {
  font-size: 18px !important;
  margin: 0 0 12px !important;
  word-break: keep-all !important;
}
.platform__networks .h4 br,
.platform__networks h4 br { display: none !important; }
.platform__networks .platform__variant-options {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  font-size: 13px !important;
}

/* Cases mobile — explicit fallback if [data-mobile-only] selector misbehaves */
.cases__mobile {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 16px !important;
}

/* ========== REFERRAL MOBILE ========== */
.referral__mobile {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 0 !important;
}
.referral__mobile-card {
  background: #181B25 !important;
  border-radius: 12px !important;
  padding: 16px !important;
}
.referral__mobile-tier {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 12px !important;
}
.referral__mobile-stats {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
}
.referral__mobile-stats > div {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.referral__mobile-stats span {
  font-size: 10px !important;
  color: #99A0AE !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}
.referral__mobile-stats b {
  font-size: 14px !important;
  color: #A3FFE4 !important;
  font-weight: 700 !important;
}
.referral__mobile-note {
  font-size: 12px !important;
  color: #99A0AE !important;
  text-align: center !important;
  padding: 12px !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,0.03) !important;
}

/* Hide desktop referral table on mobile */
.referral__table { display: none !important; }


/* CRITICAL OVERRIDE — force-show mobile blocks (defeats responsive.css hide) */
[data-mobile-only],
.cases__mobile,
.choose__mobile,
.solutions__mobile,
.referral__mobile {
  display: flex !important;
  flex-direction: column !important;
}
.top__burger { display: flex !important; }
.mobile-drawer { display: flex !important; }
.mobile-drawer-overlay { display: block !important; }


/* CARDS RAMKA — visible border around mobile card-stacks */
.choose__mobile-card,
.cases__mobile-card,
.referral__mobile-card,
.solutions__mobile-item {
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}
.choose__mobile-card--mc {
  border-color: rgba(108, 82, 255, 0.4) !important;
  box-shadow: 0 4px 24px rgba(108, 82, 255, 0.2) !important;
}


/* ========== BLOG mobile ========== */
.blog-filter {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  grid-auto-flow: row !important;
  padding: 6px !important;
}
.blog-filter > * {
  flex: 1 1 calc(50% - 4px) !important;
  min-height: 36px !important;
  font-size: 13px !important;
  padding: 6px 10px !important;
}
.blog-item-wrapper {
  padding: 16px 0 !important;
}
.blog-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  grid-template-columns: 1fr !important;
}
.blog-item__image {
  width: 100% !important;
  height: 180px !important;
}
.blog-item__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}
.blog-item__text {
  padding: 0 !important;
}
.blog-item__date {
  font-size: 12px !important;
}
.blog-item__text .h6 {
  font-size: 15px !important;
  line-height: 1.3 !important;
  margin: 6px 0 !important;
}
.blog-list.tiles {
  margin: 0 !important;
  padding: 8px 0 !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.blog-list.tiles .blog-item-wrapper {
  width: 100% !important;
  padding: 0 !important;
  flex: 1 1 100% !important;
}

/* ========== PRODUCT page extras ========== */
.product__image {
  margin-bottom: 12px !important;
}
.product__image img {
  width: 100% !important;
  height: auto !important;
  max-height: 200px !important;
  object-fit: contain !important;
}
.product__text { font-size: 13px !important; }
.product__text .h6 { font-size: 15px !important; }

.product-security .tiles-row__item {
  background-image: none !important;
}
.product-security .tiles-row__item img,
.product-security .tiles-row__item svg {
  display: none !important;  /* hide decorative pictures */
}

/* Steps icon-round bigger on mobile */
.steps__item .ico-round {
  width: 40px !important;
  height: 40px !important;
  flex-shrink: 0 !important;
}

/* Blog-detail TOC + content */
.toc {
  margin: 16px 0 !important;
  padding: 16px !important;
}
.toc__title { font-size: 14px !important; margin-bottom: 8px !important; }
.toc a { font-size: 13px !important; padding: 6px 0 !important; }
.blog-detail__content { font-size: 15px !important; line-height: 1.6 !important; }
.blog-detail__content h2 { font-size: 22px !important; margin: 24px 0 12px !important; }
.blog-detail__content h3 { font-size: 18px !important; margin: 16px 0 8px !important; }
.blog-detail__content img { max-width: 100% !important; height: auto !important; }

/* Privacy/Terms — simple content pages */
.legal-page section {
  padding: 24px 16px !important;
}


/* ========== BLOG-DETAIL content-wrapper (2-col → 1-col) ========== */
.content-wrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  grid-template-columns: 1fr !important;
}
.content-table {
  position: static !important;
  width: 100% !important;
  order: -1 !important;            /* TOC above content (or remove this if user prefers below) */
}
.content-table__inner { padding: 16px !important; }
.content-table__header { font-size: 16px !important; margin-bottom: 12px !important; padding-bottom: 12px !important; }
.content-table__nav a { font-size: 13px !important; padding: 6px 0 !important; }
.content { padding: 0 !important; }
.content p { font-size: 15px !important; line-height: 1.6 !important; }
.content .content__h {
  font-size: 18px !important;
  margin: 16px 0 8px !important;
  font-weight: 700 !important;
}
.content .indent { padding-left: 12px !important; }
.share-block { padding: 16px !important; }
.share-block .h6 { font-size: 13px !important; }

/* ========== NEWSLETTER form (blog page subscribe) ========== */
.subscribe { margin-bottom: 40px !important; }
.subscribe-wrapper {
  padding: 24px 16px !important;
  border-radius: 16px !important;
}
.form-inline.form-subscribe {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}
.form-subscribe .form-control-ico {
  width: 100% !important;
}
.form-subscribe .form-control {
  width: 100% !important;
  font-size: 14px !important;
}
.form-subscribe .btn {
  width: 100% !important;
  padding: 14px !important;
}

/* Breadcrumbs */
.breadcrumbs { padding: 12px 0 !important; font-size: 13px !important; }

/* Blog-data list (author/date/read-time) — wrap */
.blog-data {
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
  font-size: 12px !important;
}

/* Blog-detail title image */
.blog-detail__image img {
  width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
}