/* Unified premium visual layer for all public pages.
   Visual-only overrides. No layout/logic changes. */

:root {
  --primary: #2a5bff;
  --primary-2: #2148d6;
  --accent: #ff9f5a;
  --premium-text: #15202d;
  --premium-muted: #4f5f72;
  --premium-link: #2a57db;
  --premium-link-hover: #1f44b0;
  --premium-border: rgba(255, 255, 255, 0.62);
  --premium-glass-a: rgba(255, 255, 255, 0.68);
  --premium-glass-b: rgba(248, 252, 255, 0.42);
  --premium-shadow-lg: 0 20px 50px rgba(15, 23, 42, 0.14);
  --premium-shadow-md: 0 12px 28px rgba(15, 23, 42, 0.1);
}

body {
  background:
    radial-gradient(160% 120% at 50% -20%, rgba(244, 249, 255, 0.99) 0%, rgba(232, 241, 255, 0.9) 44%, rgba(226, 235, 252, 0.94) 100%),
    linear-gradient(168deg, #edf3ff 0%, #e7efff 48%, #dfe8fb 100%);
  color: var(--premium-text);
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: -26%;
  pointer-events: none;
  will-change: transform, opacity;
}

body::before {
  z-index: -1;
  background:
    radial-gradient(circle at 14% 26%, rgba(255, 255, 255, 0.74) 0%, rgba(255, 255, 255, 0) 54%),
    radial-gradient(circle at 86% 18%, rgba(160, 194, 255, 0.44) 0%, rgba(160, 194, 255, 0) 52%),
    radial-gradient(circle at 44% 78%, rgba(134, 163, 255, 0.28) 0%, rgba(134, 163, 255, 0) 48%);
  filter: blur(96px);
  opacity: 0.6;
  animation: premiumBodyGlowA 28s ease-in-out infinite alternate;
}

body::after {
  z-index: -2;
  background:
    radial-gradient(circle at 72% 68%, rgba(106, 151, 255, 0.26) 0%, rgba(106, 151, 255, 0) 46%),
    radial-gradient(circle at 22% 76%, rgba(113, 191, 255, 0.22) 0%, rgba(113, 191, 255, 0) 42%),
    radial-gradient(circle at 54% 12%, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 56%);
  filter: blur(108px);
  opacity: 0.54;
  animation: premiumBodyGlowB 34s ease-in-out infinite alternate;
}

main.page {
  position: relative;
  isolation: isolate;
}

main.page::before,
main.page::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(1300px, 98vw);
  pointer-events: none;
  z-index: -1;
  border-radius: 56px;
  will-change: transform, opacity;
}

main.page::before {
  top: -28px;
  height: clamp(380px, 58vw, 760px);
  transform: translateX(-50%);
  background:
    radial-gradient(84% 70% at 48% 8%, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0) 74%),
    radial-gradient(58% 56% at 20% 36%, rgba(120, 220, 200, 0.18) 0%, rgba(120, 220, 200, 0) 70%),
    radial-gradient(60% 56% at 82% 26%, rgba(120, 170, 255, 0.16) 0%, rgba(120, 170, 255, 0) 70%);
  filter: blur(70px);
  opacity: 0.58;
  animation: premiumPageHazeA 24s ease-in-out infinite alternate;
}

main.page::after {
  top: 86px;
  height: clamp(340px, 52vw, 720px);
  transform: translateX(-50%);
  background:
    radial-gradient(68% 64% at 50% 44%, rgba(236, 243, 252, 0.5) 0%, rgba(236, 243, 252, 0) 74%),
    radial-gradient(50% 58% at 72% 74%, rgba(120, 220, 200, 0.14) 0%, rgba(120, 220, 200, 0) 68%),
    radial-gradient(48% 54% at 24% 70%, rgba(120, 170, 255, 0.12) 0%, rgba(120, 170, 255, 0) 70%);
  filter: blur(80px);
  opacity: 0.46;
  animation: premiumPageHazeB 30s ease-in-out infinite alternate;
}

header {
  border-color: var(--premium-border);
  background:
    linear-gradient(128deg, rgba(255, 255, 255, 0.72), rgba(246, 251, 255, 0.44)),
    var(--glass-noise);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.84);
  backdrop-filter: blur(16px) saturate(132%);
  -webkit-backdrop-filter: blur(16px) saturate(132%);
}

header.is-nav-warmup {
  transition: none !important;
}

header.is-scrolled {
  border-color: rgba(255, 255, 255, 0.72);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.site-ticker {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 22px 22px 0 0;
  border-bottom-color: rgba(222, 231, 243, 0.8);
  background:
    linear-gradient(100deg, rgba(19, 138, 120, 0.1), rgba(120, 170, 255, 0.1)),
    radial-gradient(120% 100% at 0% 50%, rgba(255, 255, 255, 0.56) 0%, rgba(255, 255, 255, 0) 65%);
}

.site-ticker::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0));
  transform: translateX(-100%);
  animation: premiumTickerSweep 18s linear infinite;
  pointer-events: none;
  z-index: 0;
}

.site-ticker.is-warmup::before {
  opacity: 0 !important;
  animation: none !important;
}

.site-ticker > * {
  position: relative;
  z-index: 1;
}

#siteTicker {
  display: grid !important;
}

.site-ticker__marquee {
  display: grid;
  gap: 2px;
}

.site-ticker__lead {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  font-size: 11px;
  letter-spacing: 0.01em;
  color: #4d637d;
  white-space: nowrap;
}

.site-ticker__item {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.005em;
  color: #2b4662;
  padding: 2px 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  border: 1px solid rgba(213, 229, 244, 0.92);
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.05);
}

.site-ticker__item-prefix {
  font-weight: 700;
}

.site-ticker__item--real .site-ticker__item-prefix {
  color: #2a57db;
}

.site-ticker__item--system .site-ticker__item-prefix {
  color: #8a5b1a;
}

.site-ticker__stats {
  border-color: rgba(199, 221, 239, 0.95);
  background: linear-gradient(130deg, rgba(255, 255, 255, 0.94), rgba(240, 249, 255, 0.82));
  gap: 8px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.site-ticker__stat-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #4d637d;
}

.site-ticker__stat strong {
  font-size: 14px;
  color: #0f5f7f;
}

@keyframes premiumTickerSweep {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(100%);
  }
}

.nav > nav a {
  color: #1a2635;
}

.nav > nav a.active,
.nav > nav a:hover {
  background: rgba(255, 255, 255, 0.52);
}

@media (min-width: 1101px) {
  .nav {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 18px;
    row-gap: 12px;
  }

  .nav > nav {
    justify-self: center;
    width: max-content;
    max-width: 100%;
  }

  .nav > .lang-switch,
  .nav > .header-tools {
    justify-self: end;
    margin-left: 0;
  }

  .nav > .header-tools .lang-switch {
    margin-left: 0;
  }
}

.lang-current,
.lang-dropdown,
.header-cart-panel,
.header-cart,
.header-mini-item {
  border-color: rgba(255, 255, 255, 0.72);
}

.nav > .lang-switch {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
}

.lang-current {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.8), rgba(247, 252, 255, 0.52));
}

.lang-dropdown {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.84), rgba(246, 251, 255, 0.58)), var(--glass-noise);
}

.about,
.contact,
.container,
.faq,
.how,
.pricing,
.reviews,
.activation-video {
  border-color: var(--premium-border);
  background:
    linear-gradient(145deg, var(--premium-glass-a), var(--premium-glass-b)),
    var(--glass-noise);
  box-shadow: var(--premium-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(18px) saturate(132%);
  -webkit-backdrop-filter: blur(18px) saturate(132%);
}

.about:hover,
.contact:hover,
.container:hover,
.faq:hover,
.how:hover,
.pricing:hover,
.reviews:hover,
.activation-video:hover {
  box-shadow: 0 22px 52px rgba(15, 23, 42, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.reviews-security-banner {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid rgba(198, 212, 228, 0.86);
  border-radius: 16px;
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.9), rgba(244, 250, 255, 0.72)),
    var(--glass-noise);
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  align-items: start;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.reviews-security-banner__cat {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 24px;
  border: 1px solid rgba(197, 213, 231, 0.88);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.94), rgba(240, 247, 255, 0.8));
}

.reviews-security-banner__title {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  color: #223247;
}

.reviews-security-banner__text {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: #5a6c82;
}

.price-card,
.faq-item,
.review,
.contact-card,
.faq-sticky,
.how-card,
.block,
.card,
.cart-box,
.header-mini-item {
  border-color: var(--premium-border);
  background:
    linear-gradient(148deg, rgba(255, 255, 255, 0.72), rgba(246, 251, 255, 0.48)),
    var(--glass-noise);
  box-shadow: var(--premium-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(14px) saturate(128%);
  -webkit-backdrop-filter: blur(14px) saturate(128%);
}

.price-card.featured {
  border-color: rgba(171, 215, 202, 0.8);
  background: linear-gradient(150deg, rgba(248, 255, 253, 0.76), rgba(239, 249, 246, 0.5)), var(--glass-noise);
}

/* Keep product cards visually stable when admin changes long texts. */
.pricing-grid {
  align-items: stretch;
}

.price-card {
  height: 100%;
}

.price-card h3 {
  min-height: 0;
  display: block;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.term {
  min-height: 1.2em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sub.sub-top-list {
  min-height: 0;
}

.sub.sub-top-list .sub-top-line {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.price-card .price-card-features {
  min-height: 0;
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}

.price-card .price-card-features li {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.price-card .price-duration {
  margin: -2px 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: var(--premium-text);
}

.price-card.has-promo-price .price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
}

.price-card__price-old {
  font-size: 22px;
  font-weight: 700;
  color: #94a3b8;
  text-decoration: line-through;
}

.price-card__price-current {
  color: var(--premium-text);
  font-weight: 800;
}

.price-card .price-actions {
  margin-top: 6px;
  display: grid;
  gap: 10px;
}

.price-card .buy-btn {
  margin-top: 0;
}

@media (max-width: 760px) {
  .sub.sub-top-list {
    min-height: 0;
  }
}

.hero p,
.pricing-header p,
.faq-header p,
.about p,
.contact p,
.policy-content p,
.block p,
.card p,
.review-text,
.how-card p,
.cart-box__header p,
.sub,
.meta span {
  color: var(--premium-muted);
}

.hero .hero-react {
  display: grid;
  gap: 14px;
  justify-items: center;
}

.hero [data-hero-react-root][data-hero-mounted="1"] > :not(.hero-react) {
  display: none !important;
}

.hero .hero-react__headline {
  display: grid;
  gap: 12px;
  justify-items: center;
}

.hero .hero-react__title {
  margin: 0;
  width: 100%;
  max-width: 980px;
  text-align: center;
  display: grid;
  gap: 10px;
}

.hero .hero-react__top {
  display: block;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2.18rem, 5vw, 4.02rem);
  line-height: 1.06;
  letter-spacing: -0.03em;
  font-weight: 700;
  color: #101010;
}

.hero .hero-react__viewport {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  min-height: clamp(66px, 7.3vw, 116px);
  overflow: hidden;
}

.hero .hero-react__word {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2.28rem, 5.25vw, 4.22rem);
  line-height: 1.02;
  letter-spacing: -0.034em;
  font-weight: 700;
  color: #101010;
  white-space: nowrap;
}

.hero .hero-react__description {
  margin: 0;
  max-width: 760px;
  text-align: center;
}

.hero .hero-react__actions {
  display: flex;
  justify-content: center;
}

.hero .hero-react__btn {
  min-width: 190px;
}

@media (max-width: 760px) {
  .hero .hero-react {
    gap: 12px;
  }

  .hero .hero-react__headline {
    gap: 10px;
  }

  .hero .hero-react__viewport {
    min-height: clamp(84px, 23vw, 112px);
    padding-inline: 2px;
  }

  .hero .hero-react__top {
    font-size: clamp(1.78rem, 9.6vw, 2.52rem);
  }

  .hero .hero-react__word {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding-inline: 4px;
    white-space: normal;
    text-wrap: balance;
    line-height: 1.08;
    font-size: clamp(1.62rem, 8.5vw, 2.3rem);
  }
}

a {
  color: var(--premium-link);
}

a:hover {
  color: var(--premium-link-hover);
}

.btn,
.buy-btn,
.faq-chat-btn {
  border-color: rgba(42, 91, 255, 0.42);
  background: linear-gradient(180deg, #189d89 0%, #214fdc 100%);
  box-shadow: 0 12px 26px rgba(19, 138, 120, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.btn:hover,
.buy-btn:hover,
.faq-chat-btn:hover {
  background: linear-gradient(180deg, #169582 0%, #117767 100%);
  box-shadow: 0 16px 30px rgba(19, 138, 120, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

.btn.secondary {
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.9);
  color: #1f2b3a;
}

.header-cart-panel__promo button,
.hero-promo-inline__btn {
  background: rgba(255, 255, 255, 0.9);
}

.cart-payment-methods {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
}

.cart-payment-methods__title {
  font-size: 12px;
  font-weight: 700;
  color: var(--premium-muted);
}

.cart-payment-method {
  position: relative;
}

.cart-payment-method input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.cart-payment-method__card {
  display: grid;
  gap: 2px;
  min-height: 56px;
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid rgba(196, 210, 226, 0.86);
  background: rgba(255, 255, 255, 0.8);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  cursor: pointer;
}

.cart-payment-method__name {
  font-size: 14px;
  font-weight: 700;
  color: var(--premium-text);
}

.cart-payment-method__desc {
  font-size: 12px;
  color: var(--premium-muted);
}

.cart-payment-method.is-active .cart-payment-method__card {
  border-color: rgba(42, 91, 255, 0.52);
  box-shadow: 0 8px 20px rgba(19, 138, 120, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.92);
  transform: translateY(-1px);
}

body.is-payment-modal-open {
  overflow: hidden;
}

body.is-product-modal-open {
  overflow: hidden;
}

.product-preview-modal {
  position: fixed;
  inset: 0;
  z-index: 2100;
  display: grid;
  place-items: center;
  padding: 20px;
}

.product-preview-modal[hidden] {
  display: none !important;
}

.product-preview-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 13, 22, 0.44);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}

.product-preview-modal__dialog {
  position: relative;
  width: min(760px, 100%);
  max-height: calc(100vh - 40px);
  overflow: auto;
  border-radius: 26px;
  border: 1px solid rgba(198, 212, 228, 0.9);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(245, 250, 255, 0.9));
  box-shadow: 0 30px 62px rgba(11, 23, 38, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px) saturate(132%);
  -webkit-backdrop-filter: blur(10px) saturate(132%);
  padding: 24px;
}

.product-preview-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(176, 192, 210, 0.76);
  background: rgba(255, 255, 255, 0.92);
  color: #334155;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.product-preview-modal__content {
  display: grid;
  gap: 18px;
}

.product-preview-modal__head {
  display: grid;
  gap: 8px;
}

.product-preview-modal__term {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(42, 91, 255, 0.34);
  background: rgba(42, 91, 255, 0.08);
  font-size: 12px;
  font-weight: 700;
  color: #0f766e;
}

.product-preview-modal__title {
  margin: 0;
  color: #0f172a;
  font-size: clamp(26px, 3.2vw, 34px);
  line-height: 1.15;
}

.product-preview-modal__price {
  color: #0f172a;
  font-size: clamp(30px, 4.2vw, 42px);
  font-weight: 800;
  line-height: 1.1;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.product-preview-modal__price-old {
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 700;
  color: #94a3b8;
  text-decoration: line-through;
}

.product-preview-modal__price-current {
  color: #0f172a;
  font-size: clamp(30px, 4.2vw, 42px);
  font-weight: 800;
  line-height: 1.1;
}

.product-preview-modal__section {
  display: grid;
  gap: 10px;
}

.product-preview-modal__checkout {
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(201, 214, 229, 0.88);
  background: rgba(255, 255, 255, 0.78);
}

.product-preview-modal__field-label {
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.product-preview-modal__field-input {
  width: 100%;
  min-height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(196, 210, 226, 0.86);
  background: rgba(255, 255, 255, 0.92);
  padding: 0 12px;
  font: 600 13px/1.2 Manrope, Arial, sans-serif;
  color: #0f172a;
}

.product-preview-modal__field-input:focus {
  outline: none;
  border-color: rgba(42, 91, 255, 0.5);
  box-shadow: 0 0 0 3px rgba(42, 91, 255, 0.14);
}

.product-preview-modal__promo-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}

.product-preview-modal__promo-apply {
  min-height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(196, 210, 226, 0.86);
  background: rgba(255, 255, 255, 0.9);
  color: #0f172a;
  font: 700 13px/1 Manrope, Arial, sans-serif;
  padding: 0 12px;
  cursor: pointer;
}

.product-preview-modal__promo-apply:hover {
  border-color: rgba(42, 91, 255, 0.5);
}

.product-preview-modal__promo-msg {
  margin: 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  min-height: 16px;
}

.product-preview-modal__section-title {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
  font-weight: 700;
}

.product-preview-modal__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.product-preview-modal__list li {
  position: relative;
  padding-left: 18px;
  color: #334155;
  font-size: 14px;
  line-height: 1.5;
}

.product-preview-modal__list li::before {
  content: "\2022";
  position: absolute;
  left: 0;
  top: 0;
  color: #148576;
  font-weight: 700;
}

.product-preview-modal__empty {
  margin: 0;
  color: #64748b;
  font-size: 14px;
  line-height: 1.5;
}

.product-preview-modal__media {
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(201, 214, 229, 0.88);
  background: rgba(246, 251, 255, 0.86);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.product-preview-modal__media img {
  display: block;
  width: 100%;
  max-height: 360px;
  object-fit: cover;
}

.product-preview-modal__media video {
  display: block;
  width: 100%;
  max-height: 420px;
  background: #0f172a;
}

.product-preview-modal__video-frame {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  background: #0f172a;
}

.product-preview-modal__video-frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.product-preview-modal__media-caption {
  margin: 0;
  padding: 10px 12px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.product-preview-modal__actions {
  margin-top: 16px;
  display: grid;
}

.product-preview-modal__pay {
  width: 100%;
  min-height: 48px;
  font-size: 15px;
}

.payment-method-modal {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: grid;
  place-items: center;
  padding: 20px;
}

.payment-method-modal[hidden] {
  display: none !important;
}

.payment-method-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 13, 22, 0.38);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.payment-method-modal__dialog {
  position: relative;
  width: min(560px, 100%);
  padding: 24px;
  border-radius: 24px;
  border: 1px solid rgba(198, 212, 228, 0.88);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(245, 250, 255, 0.88));
  box-shadow: 0 26px 56px rgba(11, 23, 38, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
}

.payment-method-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(176, 192, 210, 0.76);
  background: rgba(255, 255, 255, 0.92);
  color: #334155;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.payment-method-modal__title {
  margin: 0;
  font-size: 24px;
  line-height: 1.2;
  color: #0f172a;
}

.payment-method-modal__subtitle {
  margin: 10px 0 0;
  font-size: 14px;
  color: #64748b;
}

.payment-method-modal__list {
  margin-top: 18px;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.payment-method-modal__option {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 72px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(196, 210, 226, 0.86);
  background: rgba(255, 255, 255, 0.88);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.payment-method-modal__option:hover {
  transform: translateY(-1px);
  border-color: rgba(42, 91, 255, 0.46);
  box-shadow: 0 12px 24px rgba(19, 138, 120, 0.14);
}

.payment-method-modal__option.is-active {
  border-color: rgba(42, 91, 255, 0.52);
  box-shadow: 0 10px 22px rgba(19, 138, 120, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.payment-method-modal__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(205, 217, 232, 0.8);
}

.payment-method-modal__icon img {
  width: 28px;
  height: 28px;
  object-fit: contain;
  display: block;
}

.payment-method-modal__text {
  display: grid;
  gap: 3px;
}

.payment-method-modal__name {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.payment-method-modal__hint {
  font-size: 12px;
  color: #64748b;
}

/* Modal visual polish */
.product-preview-modal__dialog {
  width: min(860px, 100%);
  border-radius: 30px;
  border: 1px solid rgba(193, 209, 226, 0.9);
  background:
    radial-gradient(120% 110% at 0% 0%, rgba(22, 163, 148, 0.08), transparent 58%),
    radial-gradient(100% 120% at 100% 0%, rgba(59, 130, 246, 0.07), transparent 62%),
    linear-gradient(162deg, rgba(255, 255, 255, 0.97), rgba(244, 250, 255, 0.92));
  box-shadow: 0 34px 66px rgba(11, 23, 38, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.96);
  padding: 28px;
}

.product-preview-modal__head {
  gap: 10px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(194, 210, 227, 0.82);
  background: linear-gradient(152deg, rgba(255, 255, 255, 0.85), rgba(241, 250, 255, 0.58));
}

.product-preview-modal__term {
  padding: 7px 12px;
  border-color: rgba(42, 91, 255, 0.45);
  background: rgba(42, 91, 255, 0.12);
}

.product-preview-modal__title {
  letter-spacing: -0.01em;
}

.product-preview-modal__checkout {
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(191, 209, 227, 0.86);
  background: linear-gradient(158deg, rgba(255, 255, 255, 0.9), rgba(245, 252, 255, 0.74));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.product-preview-modal__field-label {
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.product-preview-modal__field-input {
  min-height: 44px;
  border-radius: 13px;
  font-weight: 700;
}

.product-preview-modal__promo-apply {
  min-height: 44px;
  border: 0;
  color: #fff;
  background: linear-gradient(135deg, #3f74ff, #3b6dff 56%, #1a78af);
  box-shadow: 0 12px 24px rgba(42, 91, 255, 0.25);
}

.product-preview-modal__promo-apply:hover {
  border-color: transparent;
  transform: translateY(-1px);
}

.product-preview-modal__promo-apply:focus-visible,
.product-preview-modal__pay:focus-visible,
.payment-method-modal__option:focus-visible,
.product-preview-modal__close:focus-visible,
.payment-method-modal__close:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(42, 91, 255, 0.2);
}

.product-preview-modal__list li::before {
  content: "\2713";
  top: 1px;
  color: #3b6dff;
}

.product-preview-modal__actions {
  margin-top: 20px;
}

.product-preview-modal__pay {
  min-height: 54px;
  border: 0;
  border-radius: 16px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #fff;
  background: linear-gradient(135deg, #396fff, #2654e4 48%, #1c739f);
  box-shadow: 0 16px 28px rgba(18, 126, 109, 0.3);
}

.product-preview-modal__pay:hover {
  transform: translateY(-1px);
}

.payment-method-modal__dialog {
  width: min(820px, 100%);
  padding: 30px 28px 24px;
  border-radius: 24px;
  border: 1px solid rgba(186, 200, 216, 0.9);
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(14, 165, 233, 0.07), transparent 56%),
    radial-gradient(100% 120% at 100% 0%, rgba(15, 23, 42, 0.08), transparent 64%),
    linear-gradient(162deg, rgba(255, 255, 255, 0.97), rgba(245, 249, 253, 0.94));
  box-shadow: 0 30px 68px rgba(11, 23, 38, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(12px) saturate(122%);
  -webkit-backdrop-filter: blur(12px) saturate(122%);
}

.payment-method-modal__title {
  font-size: clamp(28px, 3.6vw, 36px);
  letter-spacing: -0.02em;
}

.payment-method-modal__subtitle {
  margin-top: 10px;
  font-size: 15px;
  color: #5f6e80;
}

.payment-method-modal__list {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.payment-method-modal__option {
  position: relative;
  grid-template-columns: 72px 1fr;
  min-height: 104px;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid rgba(152, 168, 186, 0.34);
  background: linear-gradient(158deg, rgba(255, 255, 255, 0.9), rgba(243, 248, 253, 0.78));
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: all .25s ease;
}

.payment-method-modal__option::after {
  content: "";
  position: absolute;
  top: 12px;
  right: 12px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1px solid rgba(148, 163, 184, 0.6);
  background: rgba(255, 255, 255, 0.72);
  transition: all .25s ease;
}

.payment-method-modal__option:hover {
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.34);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.12);
}

.payment-method-modal__option.is-active {
  border-color: rgba(15, 23, 42, 0.42);
  background: linear-gradient(158deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 255, 0.92));
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.14), 0 0 20px rgba(15, 23, 42, 0.14);
}

.payment-method-modal__option.is-active::after {
  border-color: rgba(15, 23, 42, 0.65);
  background: #0f172a;
  box-shadow: 0 0 0 4px rgba(15, 23, 42, 0.12);
}

.payment-method-modal__logo {
  width: 64px;
  height: 64px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 6px 10px rgba(13, 36, 64, 0.12));
}

.payment-method-modal__name {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.payment-method-modal__hint {
  font-size: 13px;
  color: #607084;
}

footer {
  border-top-color: rgba(215, 225, 237, 0.86);
  color: var(--premium-muted);
}

/* SEO static pages */
.seo-article {
  position: relative;
  isolation: isolate;
  margin-top: 26px;
  margin-bottom: 56px;
  border: 1px solid var(--premium-border);
  border-radius: 28px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.74), rgba(247, 251, 255, 0.46)),
    var(--glass-noise);
  box-shadow: var(--premium-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(14px) saturate(126%);
  -webkit-backdrop-filter: blur(14px) saturate(126%);
}

.seo-note {
  border-color: rgba(19, 138, 120, 0.26);
  background: rgba(19, 138, 120, 0.08);
}

.seo-related {
  border-color: rgba(222, 230, 241, 0.9);
  background: rgba(255, 255, 255, 0.84);
}

.page-overlay {
  background: rgba(242, 247, 252, 0.72);
}

@keyframes premiumBodyGlowA {
  0% { transform: translate3d(-6%, -4%, 0) scale(0.98); }
  50% { transform: translate3d(5%, 4%, 0) scale(1.08); }
  100% { transform: translate3d(8%, -3%, 0) scale(1.04); }
}

@keyframes premiumBodyGlowB {
  0% { transform: translate3d(5%, -4%, 0) scale(0.98); }
  50% { transform: translate3d(-4%, 5%, 0) scale(1.09); }
  100% { transform: translate3d(-8%, -2%, 0) scale(1.04); }
}

@keyframes premiumPageHazeA {
  0% { opacity: 0.44; transform: translate(-52%, -3%) scale(0.96); }
  50% { opacity: 0.68; transform: translate(-48%, 2%) scale(1.08); }
  100% { opacity: 0.58; transform: translate(-51%, -1%) scale(1.03); }
}

@keyframes premiumPageHazeB {
  0% { opacity: 0.34; transform: translate(-49%, 2%) scale(0.96); }
  50% { opacity: 0.56; transform: translate(-53%, -2%) scale(1.09); }
  100% { opacity: 0.46; transform: translate(-50%, 1%) scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after,
  main.page::before,
  main.page::after {
    animation: none !important;
  }
}

@media (max-width: 1100px) {
  body::before,
  body::after,
  main.page::before,
  main.page::after {
    animation: none;
  }

  body::before {
    opacity: 0.44;
  }

  body::after {
    opacity: 0.4;
  }

  main.page::before {
    opacity: 0.5;
  }

  main.page::after {
    opacity: 0.4;
  }
}

@media (max-width: 1100px) {
  .site-ticker {
    border-radius: 18px 18px 0 0;
  }
}

@media (max-width: 760px) {
  .site-ticker {
    border-radius: 16px 16px 0 0;
  }

  .site-ticker__lead {
    display: none;
  }

  .site-ticker__stats {
    gap: 6px;
    flex-wrap: wrap;
  }

  .reviews-security-banner {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .reviews-security-banner__cat {
    width: 38px;
    height: 38px;
    font-size: 22px;
  }

  main.page::before {
    width: min(1180px, 102vw);
    top: -14px;
    height: clamp(320px, 92vw, 580px);
    filter: blur(50px);
  }

  main.page::after {
    width: min(1120px, 100vw);
    top: 74px;
    height: clamp(300px, 84vw, 520px);
    filter: blur(56px);
  }

  .seo-article {
    margin-top: 14px;
    border-radius: 22px;
  }

  .cart-payment-method__card {
    min-height: 52px;
    padding: 10px 11px;
  }

  .payment-method-modal {
    padding: 14px;
  }

  .product-preview-modal {
    padding: 14px;
  }

  .product-preview-modal__dialog {
    max-height: calc(100vh - 28px);
    border-radius: 20px;
    padding: 18px;
  }

  .product-preview-modal__title {
    font-size: clamp(22px, 7vw, 30px);
  }

  .product-preview-modal__price {
    font-size: clamp(26px, 9vw, 34px);
  }

  .product-preview-modal__media img {
    max-height: 260px;
  }

  .product-preview-modal__promo-row {
    grid-template-columns: 1fr;
  }

  .payment-method-modal__dialog {
    padding: 20px 16px 16px;
    border-radius: 18px;
  }

  .payment-method-modal__title {
    font-size: 23px;
    padding-right: 28px;
  }

  .payment-method-modal__list {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .payment-method-modal__option {
    grid-template-columns: 56px 1fr;
    min-height: 88px;
    padding: 14px 12px;
    border-radius: 14px;
  }

  .payment-method-modal__logo {
    width: 50px;
    height: 50px;
  }

  .payment-method-modal__name {
    font-size: 16px;
  }

  .payment-method-modal__hint {
    font-size: 12px;
  }
}

/* Final modal refinement: minimal premium (overrides above) */
.product-preview-modal__backdrop,
.payment-method-modal__backdrop {
  background: rgba(8, 15, 24, 0.44);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.product-preview-modal__dialog {
  width: min(690px, 100%);
  border-radius: 22px;
  border: 1px solid rgba(184, 199, 216, 0.88);
  padding: 22px 20px 18px;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.985), rgba(247, 252, 255, 0.95));
  box-shadow: 0 24px 52px rgba(11, 23, 38, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.98);
}

.product-preview-modal__content {
  gap: 12px;
}

.product-preview-modal__description-list {
  gap: 7px;
}

.product-preview-modal__description-list li {
  color: #36495c;
  font-size: 13px;
}

.product-preview-modal__field-input {
  border-color: rgba(190, 204, 220, 0.9);
  background: #ffffff;
  font-weight: 600;
}

.product-preview-modal__field-input:focus {
  border-color: rgba(42, 91, 255, 0.56);
  box-shadow: 0 0 0 3px rgba(42, 91, 255, 0.12);
}

.product-preview-modal__promo-apply {
  border: 1px solid rgba(177, 194, 212, 0.9);
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.96), rgba(244, 250, 255, 0.86));
  color: #182739;
  box-shadow: none;
}

.product-preview-modal__promo-apply:hover {
  border-color: rgba(42, 91, 255, 0.45);
  transform: translateY(0);
}

.product-preview-modal__actions {
  margin-top: 12px;
}

.product-preview-modal__pay {
  border-radius: 14px;
  min-height: 50px;
  background: linear-gradient(135deg, #2a5bff, #214fdc);
  box-shadow: 0 14px 26px rgba(15, 123, 153, 0.24);
}

.payment-method-modal__dialog {
  width: min(640px, 100%);
  border-radius: 22px;
  border: 1px solid rgba(183, 198, 214, 0.88);
  padding: 24px 20px 18px;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.985), rgba(247, 252, 255, 0.95));
  box-shadow: 0 24px 52px rgba(11, 23, 38, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.98);
}

.payment-method-modal__title {
  font-size: clamp(25px, 3.3vw, 31px);
  letter-spacing: -0.02em;
}

.payment-method-modal__subtitle {
  margin-top: 8px;
  font-size: 14px;
  color: #5a6d80;
}

.payment-method-modal__list {
  margin-top: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.payment-method-modal__option {
  grid-template-columns: 50px 1fr;
  min-height: 76px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(190, 204, 220, 0.9);
  background: linear-gradient(152deg, rgba(255, 255, 255, 0.95), rgba(245, 250, 255, 0.84));
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.payment-method-modal__option::after {
  top: 10px;
  right: 10px;
}

.payment-method-modal__option:hover {
  transform: translateY(-1px);
  border-color: rgba(42, 91, 255, 0.42);
  box-shadow: 0 10px 20px rgba(42, 91, 255, 0.12);
}

.payment-method-modal__option.is-active {
  border-color: rgba(42, 91, 255, 0.52);
  box-shadow: 0 0 0 1px rgba(42, 91, 255, 0.18), 0 10px 22px rgba(42, 91, 255, 0.14);
}

.payment-method-modal__option.is-active::after {
  border-color: rgba(42, 91, 255, 0.75);
  background: #2a5bff;
  box-shadow: 0 0 0 4px rgba(42, 91, 255, 0.14);
}

.payment-method-modal__logo {
  width: 40px;
  height: 40px;
}

.payment-method-modal__name {
  font-size: 15px;
}

.payment-method-modal__hint {
  font-size: 12px;
}

@media (max-width: 760px) {
  .payment-method-modal__list {
    grid-template-columns: 1fr;
  }
}

/* Liquid glass buttons */
.btn,
.buy-btn,
.faq-chat-btn,
.product-preview-modal__pay,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.header-mini-remove-btn,
.cart-remove-btn,
.payment-method-modal__close,
.product-preview-modal__close {
  --liquid-tint-a: rgba(58, 108, 255, 0.76);
  --liquid-tint-b: rgba(37, 77, 214, 0.74);
  --liquid-ink: #f5fffd;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.66);
  background:
    radial-gradient(160% 120% at 0% 0%, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0.06) 56%),
    linear-gradient(136deg, var(--liquid-tint-a), var(--liquid-tint-b));
  color: var(--liquid-ink);
  text-shadow: 0 1px 0 rgba(7, 19, 31, 0.24);
  box-shadow:
    0 12px 26px rgba(8, 19, 34, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    inset 0 -10px 16px rgba(7, 19, 31, 0.16);
  backdrop-filter: blur(12px) saturate(152%);
  -webkit-backdrop-filter: blur(12px) saturate(152%);
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    border-color 0.22s ease,
    background 0.22s ease,
    filter 0.22s ease;
}

.btn::before,
.buy-btn::before,
.faq-chat-btn::before,
.product-preview-modal__pay::before,
.product-preview-modal__promo-apply::before,
.header-cart-panel__promo button::before,
.header-mini-remove-btn::before,
.cart-remove-btn::before,
.payment-method-modal__close::before,
.product-preview-modal__close::before {
  content: "";
  position: absolute;
  left: 1px;
  right: 1px;
  top: 1px;
  height: 52%;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.08));
  pointer-events: none;
}

.btn:hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.product-preview-modal__pay:hover,
.product-preview-modal__promo-apply:hover,
.header-cart-panel__promo button:hover,
.header-mini-remove-btn:hover,
.cart-remove-btn:hover,
.payment-method-modal__close:hover,
.product-preview-modal__close:hover {
  transform: translateY(-1px) scale(1.015);
  box-shadow:
    0 16px 30px rgba(8, 19, 34, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    inset 0 -10px 16px rgba(7, 19, 31, 0.18);
  filter: saturate(108%);
}

.btn:active,
.buy-btn:active,
.faq-chat-btn:active,
.product-preview-modal__pay:active,
.product-preview-modal__promo-apply:active,
.header-cart-panel__promo button:active,
.header-mini-remove-btn:active,
.cart-remove-btn:active,
.payment-method-modal__close:active,
.product-preview-modal__close:active {
  transform: translateY(0) scale(0.99);
  box-shadow:
    0 8px 16px rgba(8, 19, 34, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.66),
    inset 0 -8px 12px rgba(7, 19, 31, 0.15);
}

.btn:focus-visible,
.buy-btn:focus-visible,
.faq-chat-btn:focus-visible,
.product-preview-modal__pay:focus-visible,
.product-preview-modal__promo-apply:focus-visible,
.header-cart-panel__promo button:focus-visible,
.header-mini-remove-btn:focus-visible,
.cart-remove-btn:focus-visible,
.payment-method-modal__close:focus-visible,
.product-preview-modal__close:focus-visible {
  outline: none;
  box-shadow:
    0 12px 24px rgba(8, 19, 34, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 0 0 3px rgba(42, 91, 255, 0.24);
}

.btn:not(.secondary),
.buy-btn,
.faq-chat-btn,
.product-preview-modal__pay {
  --liquid-tint-a: rgba(51, 107, 255, 0.8);
  --liquid-tint-b: rgba(33, 72, 214, 0.78);
  --liquid-ink: #f7fffe;
}

.btn.secondary,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.header-mini-remove-btn,
.payment-method-modal__close,
.product-preview-modal__close {
  --liquid-tint-a: rgba(255, 255, 255, 0.92);
  --liquid-tint-b: rgba(231, 241, 252, 0.72);
  --liquid-ink: #10263b;
  text-shadow: none;
  border-color: rgba(182, 199, 218, 0.9);
  box-shadow:
    0 10px 20px rgba(8, 19, 34, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 -7px 12px rgba(8, 19, 34, 0.08);
}

.cart-remove-btn {
  --liquid-tint-a: rgba(255, 247, 245, 0.95);
  --liquid-tint-b: rgba(255, 225, 220, 0.78);
  --liquid-ink: #8b2a2a;
  text-shadow: none;
  border-color: rgba(233, 171, 162, 0.94);
}

.cart-remove-btn:hover {
  border-color: rgba(216, 131, 118, 0.82);
}

.payment-method-modal__option {
  border: 1px solid rgba(255, 255, 255, 0.66);
  background:
    radial-gradient(120% 110% at 0% 0%, rgba(255, 255, 255, 0.52), rgba(255, 255, 255, 0.12) 62%),
    linear-gradient(145deg, rgba(244, 251, 255, 0.82), rgba(229, 243, 252, 0.6));
  box-shadow:
    0 12px 24px rgba(8, 19, 34, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    inset 0 -8px 14px rgba(9, 20, 34, 0.08);
  backdrop-filter: blur(13px) saturate(150%);
  -webkit-backdrop-filter: blur(13px) saturate(150%);
}

.payment-method-modal__option:hover {
  transform: translateY(-2px) scale(1.01);
  border-color: rgba(42, 91, 255, 0.44);
  box-shadow:
    0 16px 28px rgba(8, 19, 34, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.payment-method-modal__option.is-active {
  border-color: rgba(42, 91, 255, 0.58);
  background:
    radial-gradient(120% 110% at 0% 0%, rgba(255, 255, 255, 0.64), rgba(255, 255, 255, 0.16) 62%),
    linear-gradient(145deg, rgba(232, 240, 255, 0.9), rgba(220, 233, 255, 0.78));
  box-shadow:
    0 0 0 1px rgba(42, 91, 255, 0.22),
    0 16px 30px rgba(29, 56, 160, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.payment-method-modal__option.is-active::after {
  border-color: rgba(42, 91, 255, 0.78);
  background: #2a5bff;
  box-shadow: 0 0 0 4px rgba(42, 91, 255, 0.16);
}

/* Global animated gradient background */
body.home-gradient-page {
  background: linear-gradient(42deg, #edf3ff 0%, #dfe9ff 44%, #e9f2ff 100%);
}

body.home-gradient-page::before,
body.home-gradient-page::after,
body.home-gradient-page main.page::before,
body.home-gradient-page main.page::after {
  opacity: 0 !important;
  animation: none !important;
}

body.home-gradient-page header,
body.home-gradient-page main.page,
body.home-gradient-page footer {
  position: relative;
  z-index: 1;
}

.home-gradient-bg {
  --home-blending: hard-light;
  --home-size: 82vmax;
  --home-pointer-x: 0px;
  --home-pointer-y: 0px;
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.home-gradient-bg__layer,
.home-gradient-bg__pointer {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--home-size);
  height: var(--home-size);
  margin-left: calc(var(--home-size) / -2);
  margin-top: calc(var(--home-size) / -2);
  border-radius: 50%;
  mix-blend-mode: var(--home-blending);
  will-change: transform, opacity;
}

.home-gradient-bg__layer--1 {
  background: radial-gradient(circle at center, rgba(59, 130, 246, 0.34) 0%, rgba(59, 130, 246, 0) 58%);
  animation: homeGradientFirst 18s linear infinite;
}

.home-gradient-bg__layer--2 {
  background: radial-gradient(circle at center, rgba(42, 91, 255, 0.34) 0%, rgba(42, 91, 255, 0) 58%);
  transform-origin: calc(50% - 420px) 50%;
  animation: homeGradientSecond 24s linear infinite reverse;
}

.home-gradient-bg__layer--3 {
  background: radial-gradient(circle at center, rgba(122, 199, 255, 0.32) 0%, rgba(122, 199, 255, 0) 58%);
  transform-origin: calc(50% + 380px) 50%;
  animation: homeGradientThird 22s linear infinite;
}

.home-gradient-bg__layer--4 {
  background: radial-gradient(circle at center, rgba(252, 170, 129, 0.2) 0%, rgba(252, 170, 129, 0) 58%);
  transform-origin: calc(50% - 260px) calc(50% - 180px);
  opacity: 0.74;
  animation: homeGradientFourth 28s linear infinite;
}

.home-gradient-bg__layer--5 {
  background: radial-gradient(circle at center, rgba(175, 196, 255, 0.23) 0%, rgba(175, 196, 255, 0) 58%);
  transform-origin: calc(50% - 760px) calc(50% + 660px);
  opacity: 0.72;
  animation: homeGradientFifth 30s linear infinite;
}

.home-gradient-bg__pointer {
  width: 72vmax;
  height: 72vmax;
  margin-left: -36vmax;
  margin-top: -36vmax;
  background: radial-gradient(circle at center, rgba(107, 153, 255, 0.36) 0%, rgba(107, 153, 255, 0) 62%);
  filter: blur(30px);
  opacity: 0.62;
  transform: translate3d(var(--home-pointer-x), var(--home-pointer-y), 0);
}

@keyframes homeGradientFirst {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.06); }
  100% { transform: rotate(360deg) scale(1); }
}

@keyframes homeGradientSecond {
  0% { transform: rotate(0deg) scale(1.02); }
  50% { transform: rotate(180deg) scale(0.96); }
  100% { transform: rotate(360deg) scale(1.02); }
}

@keyframes homeGradientThird {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.08); }
  100% { transform: rotate(360deg) scale(1); }
}

@keyframes homeGradientFourth {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.12); }
  100% { transform: rotate(360deg) scale(1); }
}

@keyframes homeGradientFifth {
  0% { transform: rotate(0deg) scale(0.96); }
  50% { transform: rotate(180deg) scale(1.05); }
  100% { transform: rotate(360deg) scale(0.96); }
}

@media (max-width: 760px) {
  .home-gradient-bg {
    --home-size: 112vmax;
  }

  .home-gradient-bg__pointer {
    width: 90vmax;
    height: 90vmax;
    margin-left: -45vmax;
    margin-top: -45vmax;
    opacity: 0.56;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-gradient-bg__layer--1 {
    animation: lpGradFirst 72s linear infinite !important;
  }

  .home-gradient-bg__layer--2 {
    animation: lpGradSecond 78s linear infinite !important;
  }

  .home-gradient-bg__layer--3 {
    animation: lpGradThird 84s linear infinite !important;
  }

  .home-gradient-bg__layer--4 {
    animation: lpGradFourth 90s linear infinite !important;
  }

  .home-gradient-bg__layer--5 {
    animation: lpGradFifth 96s linear infinite !important;
  }

  .home-gradient-bg__pointer {
    animation: lpGradPointerPulse 22s ease-in-out infinite alternate !important;
  }
}

/* =========================================================
   Premium Dark SaaS System
   ========================================================= */
:root {
  --saas-bg: #0e1014;
  --saas-bg-2: #14161c;
  --saas-bg-3: #181b24;
  --saas-glass: rgba(20, 22, 28, 0.6);
  --saas-glass-soft: rgba(20, 22, 28, 0.52);
  --saas-glass-border: rgba(255, 255, 255, 0.06);
  --saas-glass-highlight: rgba(255, 255, 255, 0.08);
  --saas-text: #ffffff;
  --saas-text-muted: #aab0c0;
  --saas-accent: #5865f2;
  --saas-accent-2: #4facfe;
  --saas-accent-strong: #4e5de9;
  --saas-accent-glow: rgba(79, 172, 254, 0.18);

  --bg: var(--saas-bg);
  --bg-alt: var(--saas-bg-2);
  --card: var(--saas-bg-2);
  --text: var(--saas-text);
  --muted: var(--saas-text-muted);
  --border: var(--saas-glass-border);
  --primary: var(--saas-accent);
  --primary-2: var(--saas-accent-strong);
  --accent: var(--saas-accent-2);
  --focus: #7f9eff;

  --premium-text: var(--saas-text);
  --premium-muted: var(--saas-text-muted);
  --premium-link: #9cbcff;
  --premium-link-hover: #d2dfff;
}

body {
  background:
    radial-gradient(circle at 20% 30%, rgba(88, 101, 242, 0.08), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(79, 172, 254, 0.06), transparent 45%),
    #0e1014;
  color: var(--saas-text);
}

body.home-gradient-page {
  background:
    radial-gradient(circle at 20% 30%, rgba(88, 101, 242, 0.08), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(79, 172, 254, 0.06), transparent 45%),
    #0e1014;
  color: var(--saas-text);
}

body::before,
body::after {
  inset: -34%;
  filter: blur(120px);
  opacity: 0.08;
}

body::before {
  background:
    radial-gradient(circle at 22% 28%, rgba(88, 101, 242, 0.1) 0%, rgba(88, 101, 242, 0) 54%),
    radial-gradient(circle at 78% 66%, rgba(79, 172, 254, 0.08) 0%, rgba(79, 172, 254, 0) 58%);
  animation: saasBlobA 34s ease-in-out infinite alternate;
}

body::after {
  background:
    radial-gradient(circle at 18% 76%, rgba(88, 101, 242, 0.08) 0%, rgba(88, 101, 242, 0) 56%),
    radial-gradient(circle at 84% 24%, rgba(79, 172, 254, 0.06) 0%, rgba(79, 172, 254, 0) 58%);
  opacity: 0.06;
  animation: saasBlobB 42s ease-in-out infinite alternate;
}

main.page::before,
main.page::after {
  opacity: 0 !important;
  animation: none !important;
}

/* Animated gradient layer on all pages that load app.min.js */
body.home-gradient-page::before,
body.home-gradient-page::after {
  opacity: 0.08 !important;
  filter: blur(120px) !important;
}

.home-gradient-bg {
  --home-blending: normal;
  --home-size: 86vmax;
}

.home-gradient-bg__layer--1 {
  background: radial-gradient(circle at center, rgba(88, 101, 242, 0.08) 0%, rgba(88, 101, 242, 0) 58%);
  opacity: 0.08;
}

.home-gradient-bg__layer--2 {
  background: radial-gradient(circle at center, rgba(79, 172, 254, 0.07) 0%, rgba(79, 172, 254, 0) 58%);
  opacity: 0.07;
}

.home-gradient-bg__layer--3 {
  background: radial-gradient(circle at center, rgba(88, 101, 242, 0.06) 0%, rgba(88, 101, 242, 0) 58%);
  opacity: 0.06;
}

.home-gradient-bg__layer--4 {
  background: radial-gradient(circle at center, rgba(79, 172, 254, 0.05) 0%, rgba(79, 172, 254, 0) 58%);
  opacity: 0.05;
}

.home-gradient-bg__layer--5 {
  background: radial-gradient(circle at center, rgba(88, 101, 242, 0.05) 0%, rgba(88, 101, 242, 0) 58%);
  opacity: 0.05;
}

.home-gradient-bg__pointer {
  background: radial-gradient(circle at center, rgba(79, 172, 254, 0.08) 0%, rgba(79, 172, 254, 0) 64%);
  filter: blur(120px);
  opacity: 0.08;
}

header,
.hero,
.pricing,
.how,
.faq,
.about,
.contact,
.reviews,
.container,
.seo-article,
.cart-box,
.price-card,
.how-card,
.faq-item,
.faq-sticky,
.contact-card,
.review,
.block,
.card,
.header-cart,
.header-cart-panel,
.header-mini-item,
.lang-current,
.lang-dropdown {
  border: 1px solid var(--saas-glass-border) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.hero,
.pricing,
.how,
.faq {
  position: relative;
  isolation: isolate;
}

.hero::before,
.pricing::before,
.how::before,
.faq::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.08;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(circle, rgba(79, 172, 254, 0.22) 0%, rgba(79, 172, 254, 0) 70%);
}

.hero::before {
  top: -180px;
  right: -140px;
}

.pricing::before {
  top: -170px;
  left: -130px;
}

.how::before {
  top: -180px;
  right: -120px;
}

.faq::before {
  top: -160px;
  left: -120px;
}

.hero > *,
.pricing > *,
.how > *,
.faq > * {
  position: relative;
  z-index: 1;
}

.hero h1,
.hero-react__top,
.hero-react__word,
.pricing-header h2,
.faq-header h2,
.how-title,
.price-card h3,
.about h1,
.contact h1,
.reviews-header h1,
.container h1,
.block h2,
.card h2 {
  color: var(--saas-text) !important;
}

.hero p,
.hero-react__description,
.pricing-header p,
.faq-header p,
.about p,
.contact p,
.review-text,
.block p,
.card p,
.sub,
.meta span {
  color: var(--saas-text-muted) !important;
}

.nav > nav a,
.lang-item,
.payment-method-modal__hint,
.product-preview-modal__promo-msg {
  color: #c4cce0 !important;
}

.site-ticker {
  border-color: rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.site-ticker::before {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(133, 166, 255, 0.06), rgba(255, 255, 255, 0)) !important;
}

.site-ticker__lead,
.site-ticker__stat-label {
  color: #9aa9c6 !important;
}

.site-ticker__item {
  color: #dbe7ff !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.site-ticker__item--real .site-ticker__item-prefix {
  color: #8fb2ff !important;
}

.site-ticker__item--system .site-ticker__item-prefix {
  color: #f8c888 !important;
}

.site-ticker__stats {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.site-ticker__stat strong {
  color: #dce8ff !important;
}

.reviews-security-banner {
  border-color: rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.reviews-security-banner__cat {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

.reviews-security-banner__title {
  color: #e7efff !important;
}

.reviews-security-banner__text {
  color: #aab0c0 !important;
}

.btn,
.buy-btn,
.faq-chat-btn,
.product-preview-modal__pay,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.payment-method-modal__close,
.product-preview-modal__close {
  --liquid-tint-a: #5865f2;
  --liquid-tint-b: #4facfe;
  --liquid-ink: #ffffff;
  background: linear-gradient(135deg, var(--liquid-tint-a), var(--liquid-tint-b)) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  text-shadow: none;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn:hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.product-preview-modal__pay:hover,
.product-preview-modal__promo-apply:hover,
.header-cart-panel__promo button:hover,
.payment-method-modal__close:hover,
.product-preview-modal__close:hover {
  filter: brightness(1.05);
  transform: translateY(-2px);
  box-shadow:
    0 12px 26px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.btn.secondary,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.header-mini-remove-btn,
.payment-method-modal__close,
.product-preview-modal__close {
  --liquid-tint-a: rgba(20, 22, 28, 0.6);
  --liquid-tint-b: rgba(20, 22, 28, 0.6);
  --liquid-ink: #d7dff3;
  background: rgba(20, 22, 28, 0.6) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  text-shadow: none;
}

.btn.secondary:hover,
.product-preview-modal__promo-apply:hover,
.header-cart-panel__promo button:hover,
.header-mini-remove-btn:hover,
.payment-method-modal__close:hover,
.product-preview-modal__close:hover {
  filter: none;
  transform: none;
  background: rgba(20, 22, 28, 0.68) !important;
}

.cart-remove-btn {
  --liquid-tint-a: rgba(255, 111, 141, 0.24);
  --liquid-tint-b: rgba(255, 90, 116, 0.2);
  --liquid-ink: #ffd7e1;
  border-color: rgba(255, 130, 152, 0.46) !important;
  text-shadow: none;
}

.payment-method-modal__option {
  border-color: rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.payment-method-modal__option:hover {
  border-color: rgba(88, 101, 242, 0.3) !important;
  transform: translateY(-2px);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.payment-method-modal__option.is-active {
  border-color: rgba(88, 101, 242, 0.42) !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.payment-method-modal__option.is-active::after {
  border-color: rgba(88, 101, 242, 0.65) !important;
  background: #5865f2 !important;
  box-shadow: 0 0 0 3px rgba(88, 101, 242, 0.12) !important;
}

.payment-method-modal__dialog,
.product-preview-modal__dialog {
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.product-preview-modal__term {
  border-color: rgba(88, 101, 242, 0.3) !important;
  background: rgba(88, 101, 242, 0.1) !important;
  color: #c7d2ff !important;
}

.product-preview-modal__title,
.product-preview-modal__price,
.product-preview-modal__price-current,
.product-preview-modal__section-title,
.payment-method-modal__title,
.payment-method-modal__name {
  color: var(--saas-text) !important;
}

.product-preview-modal__price-old,
.product-preview-modal__field-label,
.product-preview-modal__list li,
.product-preview-modal__empty,
.product-preview-modal__description-list li,
.payment-method-modal__subtitle {
  color: var(--saas-text-muted) !important;
}

.product-preview-modal__list li::before {
  color: #9fb2ff !important;
}

.product-preview-modal__checkout {
  border-color: rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
}

.product-preview-modal__field-input {
  border-color: rgba(255, 255, 255, 0.1) !important;
  background: rgba(16, 18, 24, 0.64) !important;
  color: #eef4ff !important;
}

.product-preview-modal__field-input::placeholder {
  color: rgba(170, 176, 192, 0.7) !important;
}

.payment-method-modal__option {
  color: #dce6ff !important;
}

.payment-method-modal__icon {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

.cart-payment-method__card {
  border-color: rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.cart-payment-method.is-active .cart-payment-method__card {
  border-color: rgba(88, 101, 242, 0.42) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.seo-note {
  border-color: rgba(88, 101, 242, 0.26) !important;
  background: rgba(88, 101, 242, 0.08) !important;
  color: #c9d9ff !important;
}

.seo-related {
  border-color: rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  background: rgba(20, 22, 28, 0.6) !important;
}

.page-overlay {
  background: rgba(8, 12, 19, 0.62) !important;
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after,
  .home-gradient-bg__layer,
  .home-gradient-bg__pointer {
    animation: none !important;
    transform: none !important;
  }

  .btn,
  .buy-btn,
  .faq-chat-btn,
  .product-preview-modal__pay,
  .product-preview-modal__promo-apply,
  .header-cart-panel__promo button,
  .payment-method-modal__close,
  .product-preview-modal__close {
    transition: none !important;
    transform: none !important;
  }
}

@keyframes saasBlobA {
  0% { transform: translate3d(-2%, -2%, 0) scale(1); }
  50% { transform: translate3d(2%, 2%, 0) scale(1.06); }
  100% { transform: translate3d(3%, -1%, 0) scale(1.04); }
}

@keyframes saasBlobB {
  0% { transform: translate3d(2%, -1%, 0) scale(1); }
  50% { transform: translate3d(-2%, 2%, 0) scale(1.05); }
  100% { transform: translate3d(-3%, -2%, 0) scale(1.04); }
}

/* =========================================================
   Quiet Luxury Dark SaaS System
   ========================================================= */
:root {
  --bg: #0b0d12;
  --bg-soft: #10131a;
  --surface: rgba(18, 22, 30, 0.78);
  --surface-2: rgba(22, 27, 36, 0.92);
  --border: rgba(255, 255, 255, 0.08);
  --border-soft: rgba(255, 255, 255, 0.05);
  --text: #f5f7fb;
  --text-soft: #a7b0c0;
  --accent: #7c8cff;
  --accent-hover: #95a3ff;
  --accent-soft: rgba(124, 140, 255, 0.16);

  --primary: var(--accent);
  --primary-2: var(--accent-hover);
  --premium-text: var(--text);
  --premium-muted: var(--text-soft);
  --premium-link: #b8c2ff;
  --premium-link-hover: #d4dcff;

  --glass-fill: var(--surface);
  --glass-border: var(--border-soft);
  --glass-border-strong: var(--border);
}

html,
body {
  color: var(--text) !important;
  background:
    radial-gradient(circle at 24% 14%, rgba(124, 140, 255, 0.08), transparent 42%),
    radial-gradient(circle at 72% 74%, rgba(124, 140, 255, 0.05), transparent 48%),
    #0b0d12 !important;
}

body::before,
body::after {
  filter: blur(120px) !important;
  opacity: 0.07 !important;
  animation: none !important;
}

body::before {
  background:
    radial-gradient(circle at 20% 30%, rgba(124, 140, 255, 0.1) 0%, rgba(124, 140, 255, 0) 48%),
    radial-gradient(circle at 80% 18%, rgba(124, 140, 255, 0.07) 0%, rgba(124, 140, 255, 0) 52%) !important;
}

body::after {
  background:
    radial-gradient(circle at 18% 82%, rgba(124, 140, 255, 0.06) 0%, rgba(124, 140, 255, 0) 52%),
    radial-gradient(circle at 84% 66%, rgba(124, 140, 255, 0.05) 0%, rgba(124, 140, 255, 0) 54%) !important;
}

main.page::before,
main.page::after {
  opacity: 0 !important;
}

.home-gradient-bg {
  --home-blending: normal;
}

.home-gradient-bg__layer,
.home-gradient-bg__pointer {
  filter: blur(120px) !important;
}

.home-gradient-bg__layer--1,
.home-gradient-bg__layer--2,
.home-gradient-bg__layer--3,
.home-gradient-bg__layer--4,
.home-gradient-bg__layer--5,
.home-gradient-bg__pointer {
  background: radial-gradient(circle at center, rgba(124, 140, 255, 0.08) 0%, rgba(124, 140, 255, 0) 62%) !important;
  opacity: 0.08 !important;
}

header {
  border: 1px solid var(--border-soft) !important;
  border-radius: 16px !important;
  background: rgba(14, 17, 24, 0.74) !important;
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

header.is-scrolled {
  background: rgba(14, 17, 24, 0.88) !important;
  border-color: var(--border) !important;
  box-shadow:
    0 12px 34px rgba(0, 0, 0, 0.44),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

header .logo-img {
  filter: brightness(1.2) contrast(1.08) saturate(0.95) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.45));
}

.nav > nav a {
  position: relative;
  padding: 8px 10px;
  color: var(--text-soft) !important;
  background: transparent !important;
  border-radius: 10px;
  transition: color 0.2s ease, background-color 0.2s ease;
}

.nav > nav a::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 4px;
  height: 1.5px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--accent), var(--accent-hover));
  opacity: 0;
  transform: scaleX(0.7);
  transform-origin: center;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.nav > nav a:hover {
  color: #e6ebff !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

.nav > nav a:hover::after,
.nav > nav a.active::after {
  opacity: 1;
  transform: scaleX(1);
}

.nav > nav a.active {
  color: var(--text) !important;
}

.lang-current {
  border: 1px solid var(--border-soft) !important;
  background: rgba(20, 24, 32, 0.88) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

.lang-dropdown {
  border: 1px solid var(--border-soft) !important;
  border-radius: 12px !important;
  background: var(--surface-2) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45) !important;
}

.lang-item {
  color: var(--text-soft) !important;
}

.lang-item:hover {
  color: var(--text) !important;
  background: var(--accent-soft) !important;
}

.site-ticker,
.site-ticker__stats {
  border-color: var(--border-soft) !important;
  background: rgba(15, 18, 25, 0.72) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.site-ticker::before {
  opacity: 0.35;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(124, 140, 255, 0.12), rgba(255, 255, 255, 0)) !important;
}

.site-ticker__lead,
.site-ticker__item,
.site-ticker__stat-label {
  color: var(--text-soft) !important;
}

.site-ticker__item {
  border-color: var(--border-soft) !important;
  background: rgba(255, 255, 255, 0.02) !important;
}

.site-ticker__stat strong {
  color: var(--text) !important;
}

.hero,
.pricing,
.how,
.faq,
.about,
.contact,
.reviews,
.seo-article,
.price-card,
.how-card,
.faq-item,
.faq-sticky,
.contact-card,
.review,
.cart-box,
.header-mini-item,
.header-cart-panel,
.payment-method-modal__dialog,
.product-preview-modal__dialog,
.activation-video {
  border: 1px solid var(--border-soft) !important;
  border-radius: 16px !important;
  background: var(--surface) !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.hero::before,
.hero::after,
.pricing::before,
.how::before,
.faq::before {
  opacity: 0.08 !important;
}

.hero h1,
.hero-react__top,
.hero-react__word {
  color: var(--text) !important;
  letter-spacing: -0.028em;
}

.hero h1 {
  font-size: clamp(2.2rem, 5.2vw, 4.2rem) !important;
  line-height: 1.04;
}

.hero p,
.hero-react__description,
.pricing-header p,
.faq-header p,
.how-card p,
.about p,
.contact p,
.review-text,
.faq-answer p,
.faq-sticky p,
.sub,
.meta span {
  color: var(--text-soft) !important;
}

.pricing-header h2,
.faq-header h2,
.how-title,
.about h1,
.contact h1,
.reviews-header h1,
.container h1,
.price-card h3 {
  color: var(--text) !important;
}

.price-card.featured {
  border-color: rgba(124, 140, 255, 0.34) !important;
  background: linear-gradient(180deg, rgba(124, 140, 255, 0.08), rgba(18, 22, 30, 0.78)) !important;
}

.price,
.price-card__price-current {
  color: var(--text) !important;
}

.price-card__price-old {
  color: #8a94a8 !important;
}

.price-card .price-card-features li,
.price-card ul li {
  color: var(--text-soft) !important;
}

.badge {
  border: 1px solid rgba(124, 140, 255, 0.32) !important;
  background: rgba(124, 140, 255, 0.16) !important;
  color: #dde3ff !important;
  box-shadow: none !important;
}

.badge.best,
.badge.new,
.badge.hit,
.badge.sale,
.badge.popular,
.badge.limited,
.badge.gift,
.badge.pro {
  border: 1px solid rgba(124, 140, 255, 0.32) !important;
  background: rgba(124, 140, 255, 0.16) !important;
  color: #dde3ff !important;
}

.faq-item.active {
  border-color: rgba(124, 140, 255, 0.32) !important;
}

.faq-question {
  color: var(--text) !important;
}

.faq-icon {
  border-color: #7f8ba2 !important;
}

.faq-item.active .faq-icon {
  border-color: var(--accent) !important;
}

.btn:not(.secondary),
.buy-btn,
.faq-chat-btn,
.product-preview-modal__pay {
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background: linear-gradient(135deg, #5865f2, #4facfe) !important;
  color: #f8faff !important;
  text-shadow: none !important;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.btn:not(.secondary):hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.product-preview-modal__pay:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.05);
  box-shadow:
    0 12px 26px rgba(0, 0, 0, 0.44),
    inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.btn.secondary,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.header-mini-remove-btn,
.payment-method-modal__close,
.product-preview-modal__close {
  border: 1px solid var(--border) !important;
  background: rgba(20, 24, 32, 0.84) !important;
  color: #d9e1f3 !important;
  text-shadow: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.btn.secondary:hover,
.product-preview-modal__promo-apply:hover,
.header-cart-panel__promo button:hover,
.header-mini-remove-btn:hover,
.payment-method-modal__close:hover,
.product-preview-modal__close:hover {
  background: rgba(26, 31, 42, 0.92) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  transform: translateY(-1px) !important;
  filter: none !important;
}

.payment-method-modal__option,
.cart-payment-method__card {
  border: 1px solid var(--border-soft) !important;
  background: var(--surface-2) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.payment-method-modal__option:hover,
.cart-payment-method.is-active .cart-payment-method__card {
  border-color: rgba(124, 140, 255, 0.34) !important;
  background: rgba(26, 31, 42, 0.94) !important;
}

.payment-method-modal__option.is-active::after {
  background: var(--accent) !important;
  border-color: rgba(124, 140, 255, 0.66) !important;
}

.product-preview-modal__checkout,
.seo-related,
.page-overlay {
  background: rgba(12, 15, 22, 0.74) !important;
}

.product-preview-modal__field-input,
.header-cart-panel__promo input,
.header-cart-panel__email input,
.cart-email input {
  border: 1px solid var(--border-soft) !important;
  background: rgba(14, 18, 26, 0.84) !important;
  color: var(--text) !important;
}

.product-preview-modal__field-input::placeholder,
.header-cart-panel__promo input::placeholder,
.header-cart-panel__email input::placeholder,
.cart-email input::placeholder {
  color: #7f8aa0;
}

footer {
  border-top: 1px solid var(--border-soft) !important;
  color: var(--text-soft) !important;
}

/* =========================================================
   Selective Liquid Glass Accents (Production-safe)
   Inspired by liquid-glass-studio, adapted for landing UX
   ========================================================= */
:root {
  --liquid-glass-fill: linear-gradient(
    160deg,
    rgba(236, 242, 255, 0.22) 0%,
    rgba(138, 158, 255, 0.2) 30%,
    rgba(91, 113, 230, 0.28) 100%
  );
  --liquid-glass-fill-soft: linear-gradient(
    160deg,
    rgba(236, 242, 255, 0.08) 0%,
    rgba(138, 158, 255, 0.07) 38%,
    rgba(91, 113, 230, 0.1) 100%
  );
  --liquid-glass-border: rgba(225, 234, 255, 0.28);
  --liquid-glass-border-soft: rgba(205, 217, 255, 0.16);
  --liquid-glass-sheen: rgba(255, 255, 255, 0.44);
  --liquid-glass-core: rgba(126, 145, 255, 0.58);
  --liquid-glass-shadow: 0 10px 24px rgba(7, 12, 26, 0.44);
}

/* keep large surfaces calm; no liquid overlays there */
.hero,
.pricing,
.how,
.faq,
.price-card,
.how-card,
.faq-item,
.faq-sticky {
  isolation: isolate;
}

/* primary premium controls */
.btn:not(.secondary),
.buy-btn,
.faq-chat-btn,
.product-preview-modal__pay {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--liquid-glass-border) !important;
  background: var(--liquid-glass-fill) !important;
  color: #f8faff !important;
  box-shadow:
    var(--liquid-glass-shadow),
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 0 -8px 18px rgba(22, 36, 88, 0.24) !important;
  backdrop-filter: blur(9px) saturate(130%);
  -webkit-backdrop-filter: blur(9px) saturate(130%);
  transition:
    transform 0.24s ease,
    box-shadow 0.24s ease,
    filter 0.24s ease,
    border-color 0.24s ease !important;
}

.btn:not(.secondary)::before,
.buy-btn::before,
.faq-chat-btn::before,
.product-preview-modal__pay::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      120% 72% at 14% 0%,
      var(--liquid-glass-sheen) 0%,
      rgba(255, 255, 255, 0) 58%
    ),
    radial-gradient(
      120% 130% at 85% 100%,
      rgba(161, 181, 255, 0.34) 0%,
      rgba(161, 181, 255, 0) 66%
    );
  opacity: 0.86;
  pointer-events: none;
}

.btn:not(.secondary)::after,
.buy-btn::after,
.faq-chat-btn::after,
.product-preview-modal__pay::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  pointer-events: none;
}

.btn:not(.secondary) > *,
.buy-btn > *,
.faq-chat-btn > *,
.product-preview-modal__pay > * {
  position: relative;
  z-index: 1;
}

.btn:not(.secondary):hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.product-preview-modal__pay:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.05) saturate(1.05);
  border-color: rgba(236, 242, 255, 0.38) !important;
  box-shadow:
    0 14px 28px rgba(7, 12, 26, 0.52),
    inset 0 1px 0 rgba(255, 255, 255, 0.52),
    inset 0 -10px 20px rgba(25, 41, 103, 0.26) !important;
}

.btn:not(.secondary):active,
.buy-btn:active,
.faq-chat-btn:active,
.product-preview-modal__pay:active {
  transform: translateY(-1px) scale(0.995) !important;
}

/* secondary controls: subtle glass only */
.btn.secondary,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.header-mini-remove-btn,
.payment-method-modal__close,
.product-preview-modal__close {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--liquid-glass-border-soft) !important;
  background: var(--liquid-glass-fill-soft) !important;
  box-shadow:
    0 6px 16px rgba(7, 12, 26, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  backdrop-filter: blur(8px) saturate(118%);
  -webkit-backdrop-filter: blur(8px) saturate(118%);
}

.btn.secondary:hover,
.product-preview-modal__promo-apply:hover,
.header-cart-panel__promo button:hover,
.header-mini-remove-btn:hover,
.payment-method-modal__close:hover,
.product-preview-modal__close:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(218, 228, 255, 0.24) !important;
  filter: brightness(1.04);
}

/* liquid glass active nav pill */
.nav > nav a {
  overflow: hidden;
}

.nav > nav a::after {
  display: none !important;
}

.nav > nav a.active {
  border: 1px solid var(--liquid-glass-border-soft) !important;
  background: var(--liquid-glass-fill-soft) !important;
  color: #edf2ff !important;
  box-shadow:
    0 7px 18px rgba(7, 12, 26, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  backdrop-filter: blur(8px) saturate(115%);
  -webkit-backdrop-filter: blur(8px) saturate(115%);
}

.nav > nav a.active::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    115% 68% at 18% 4%,
    rgba(255, 255, 255, 0.3) 0%,
    rgba(255, 255, 255, 0) 62%
  );
  pointer-events: none;
}

.nav > nav a:hover:not(.active) {
  background: rgba(255, 255, 255, 0.035) !important;
}

/* badges / status pills */
.badge,
.badge.best,
.badge.new,
.badge.hit,
.badge.sale,
.badge.popular,
.badge.limited,
.badge.gift,
.badge.pro,
.site-ticker__item {
  position: relative;
  overflow: hidden;
  border-color: var(--liquid-glass-border-soft) !important;
  background: var(--liquid-glass-fill-soft) !important;
  box-shadow:
    0 4px 12px rgba(7, 12, 26, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  backdrop-filter: blur(7px) saturate(112%);
  -webkit-backdrop-filter: blur(7px) saturate(112%);
}

.badge::before,
.site-ticker__item::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    150% 88% at 8% 0%,
    rgba(255, 255, 255, 0.25) 0%,
    rgba(255, 255, 255, 0) 62%
  );
  pointer-events: none;
}

.site-ticker__item-prefix {
  color: rgba(224, 233, 255, 0.84) !important;
}

/* optional small floating control */
.lang-current {
  border-color: var(--liquid-glass-border-soft) !important;
  background: rgba(24, 31, 44, 0.72) !important;
  box-shadow:
    0 8px 18px rgba(6, 10, 22, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  backdrop-filter: blur(8px) saturate(112%);
  -webkit-backdrop-filter: blur(8px) saturate(112%);
}

@media (prefers-reduced-motion: reduce) {
  .btn:not(.secondary),
  .buy-btn,
  .faq-chat-btn,
  .product-preview-modal__pay,
  .btn.secondary,
  .product-preview-modal__promo-apply,
  .header-cart-panel__promo button,
  .header-mini-remove-btn,
  .payment-method-modal__close,
  .product-preview-modal__close,
  .nav > nav a.active {
    transition: none !important;
    transform: none !important;
    filter: none !important;
  }
}

/* =========================================================
   Light Premium Glass Theme (Final Visual Override)
   ========================================================= */
:root {
  --lp-bg: #f6f7fb;
  --lp-bg-soft: #eef2fb;
  --lp-text: #161f2f;
  --lp-text-soft: #5f6b81;
  --lp-text-muted: #7b879c;
  --lp-border: rgba(173, 186, 213, 0.38);
  --lp-border-soft: rgba(186, 198, 224, 0.34);
  --lp-surface-hero: rgba(255, 255, 255, 0.58);
  --lp-surface-main: rgba(255, 255, 255, 0.5);
  --lp-surface-card: rgba(255, 255, 255, 0.68);
  --lp-shadow-lg: 0 14px 44px rgba(31, 41, 55, 0.08);
  --lp-shadow-md: 0 10px 30px rgba(31, 41, 55, 0.07);
  --lp-accent: #6478ff;
  --lp-accent-2: #79b4ff;
  --lp-accent-soft: rgba(122, 147, 255, 0.16);
  --lp-accent-soft-2: rgba(121, 180, 255, 0.12);

  --liquid-glass-fill: linear-gradient(
    158deg,
    rgba(255, 255, 255, 0.32) 0%,
    rgba(145, 169, 255, 0.3) 32%,
    rgba(107, 160, 255, 0.44) 100%
  );
  --liquid-glass-fill-soft: linear-gradient(
    158deg,
    rgba(255, 255, 255, 0.72) 0%,
    rgba(226, 234, 255, 0.7) 42%,
    rgba(214, 230, 255, 0.62) 100%
  );
  --liquid-glass-border: rgba(131, 156, 255, 0.4);
  --liquid-glass-border-soft: rgba(187, 202, 235, 0.56);
  --liquid-glass-sheen: rgba(255, 255, 255, 0.78);
  --liquid-glass-shadow: 0 12px 28px rgba(78, 97, 145, 0.22);

  /* compatibility aliases for previous dark-theme variables */
  --saas-bg: var(--lp-bg);
  --saas-bg-2: #f0f4fc;
  --saas-bg-3: #ebf1fb;
  --saas-glass: var(--lp-surface-main);
  --saas-glass-soft: rgba(255, 255, 255, 0.56);
  --saas-glass-border: rgba(186, 198, 224, 0.42);
  --saas-glass-highlight: rgba(255, 255, 255, 0.72);
  --saas-text: var(--lp-text);
  --saas-text-muted: var(--lp-text-soft);
  --saas-accent: var(--lp-accent);
  --saas-accent-2: var(--lp-accent-2);
  --saas-accent-strong: #5972ff;
  --saas-accent-glow: rgba(122, 147, 255, 0.2);

  --bg: var(--lp-bg);
  --bg-soft: var(--lp-bg-soft);
  --bg-alt: var(--lp-bg-soft);
  --card: var(--lp-surface-card);
  --surface: var(--lp-surface-main);
  --surface-2: rgba(249, 252, 255, 0.82);
  --text: var(--lp-text);
  --text-soft: var(--lp-text-soft);
  --muted: var(--lp-text-soft);
  --border: rgba(173, 186, 213, 0.42);
  --border-soft: rgba(186, 198, 224, 0.38);
  --primary: var(--lp-accent);
  --primary-2: #6a8fff;
  --accent: var(--lp-accent);
  --accent-hover: #7b9aff;
  --accent-soft: var(--lp-accent-soft);

  --premium-text: var(--lp-text);
  --premium-muted: var(--lp-text-soft);
  --premium-link: #3f5ca3;
  --premium-link-hover: #2f477f;
  --premium-border: rgba(255, 255, 255, 0.66);
  --premium-glass-a: rgba(255, 255, 255, 0.72);
  --premium-glass-b: rgba(237, 244, 255, 0.62);
  --premium-shadow-lg: var(--lp-shadow-lg);
  --premium-shadow-md: var(--lp-shadow-md);

  --glass-fill: var(--lp-surface-main);
  --glass-border: rgba(186, 198, 224, 0.42);
  --glass-border-strong: rgba(173, 186, 213, 0.52);
}

html,
body {
  color: var(--lp-text) !important;
  background:
    radial-gradient(circle at 18% 14%, rgba(170, 190, 255, 0.18), transparent 46%),
    radial-gradient(circle at 76% 72%, rgba(210, 225, 255, 0.14), transparent 50%),
    radial-gradient(circle at 60% 24%, rgba(255, 220, 235, 0.1), transparent 45%),
    var(--lp-bg) !important;
}

body::before,
body::after {
  opacity: 0.72 !important;
  filter: blur(168px) saturate(116%) !important;
}

body::before {
  background:
    radial-gradient(circle at 22% 26%, rgba(170, 190, 255, 0.38) 0%, rgba(170, 190, 255, 0) 58%),
    radial-gradient(circle at 78% 20%, rgba(210, 225, 255, 0.32) 0%, rgba(210, 225, 255, 0) 60%) !important;
  animation: lpFloatA 44s ease-in-out infinite !important;
}

body::after {
  background:
    radial-gradient(circle at 20% 82%, rgba(210, 225, 255, 0.34) 0%, rgba(210, 225, 255, 0) 60%),
    radial-gradient(circle at 84% 66%, rgba(255, 220, 235, 0.24) 0%, rgba(255, 220, 235, 0) 58%) !important;
  animation: lpFloatB 52s ease-in-out infinite !important;
}

main.page::before,
main.page::after {
  opacity: 0 !important;
}

.home-gradient-bg {
  --home-blending: normal;
}

.home-gradient-bg__layer,
.home-gradient-bg__pointer {
  filter: blur(164px) saturate(112%) !important;
  opacity: 0.16 !important;
}

.home-gradient-bg__layer--1 {
  background: radial-gradient(circle at center, rgba(170, 190, 255, 0.44) 0%, rgba(170, 190, 255, 0) 66%) !important;
  animation-duration: 50s !important;
}

.home-gradient-bg__layer--2 {
  background: radial-gradient(circle at center, rgba(210, 225, 255, 0.4) 0%, rgba(210, 225, 255, 0) 64%) !important;
  animation-duration: 58s !important;
}

.home-gradient-bg__layer--3 {
  background: radial-gradient(circle at center, rgba(255, 220, 235, 0.32) 0%, rgba(255, 220, 235, 0) 64%) !important;
  animation-duration: 62s !important;
}

.home-gradient-bg__layer--4 {
  background: radial-gradient(circle at center, rgba(188, 209, 255, 0.34) 0%, rgba(188, 209, 255, 0) 66%) !important;
  animation-duration: 70s !important;
}

.home-gradient-bg__layer--5,
.home-gradient-bg__pointer {
  background: radial-gradient(circle at center, rgba(214, 228, 255, 0.3) 0%, rgba(214, 228, 255, 0) 66%) !important;
  animation-duration: 74s !important;
}

header {
  position: sticky;
  top: 14px;
  z-index: 80;
  border: 1px solid rgba(255, 255, 255, 0.58) !important;
  border-radius: 16px !important;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.68) 0%,
    rgba(255, 255, 255, 0.56) 100%
  ) !important;
  box-shadow:
    0 8px 24px rgba(31, 41, 55, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
}

header.is-scrolled {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.74) 0%,
    rgba(255, 255, 255, 0.62) 100%
  ) !important;
  border-color: rgba(255, 255, 255, 0.66) !important;
  box-shadow:
    0 12px 30px rgba(31, 41, 55, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

header .logo-img {
  filter: contrast(1.08) brightness(0.96) saturate(0.96) !important;
}

.nav > nav a {
  color: var(--lp-text-soft) !important;
  border-radius: 12px;
  padding: 8px 12px;
  transition: color 0.22s ease, background-color 0.22s ease, border-color 0.22s ease !important;
}

.nav > nav a::after {
  display: none !important;
}

.nav > nav a:hover {
  color: #2a3446 !important;
  background: rgba(255, 255, 255, 0.48) !important;
}

.nav > nav a.active {
  color: #202b3f !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  background: linear-gradient(
    162deg,
    rgba(255, 255, 255, 0.7) 0%,
    rgba(230, 238, 255, 0.62) 100%
  ) !important;
  box-shadow:
    0 8px 20px rgba(31, 41, 55, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
  backdrop-filter: blur(12px) saturate(132%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(132%) !important;
}

.nav > nav a.active::before {
  background: radial-gradient(
    110% 76% at 18% 2%,
    rgba(255, 255, 255, 0.52) 0%,
    rgba(255, 255, 255, 0) 64%
  ) !important;
}

.lang-current {
  border: 1px solid rgba(255, 255, 255, 0.66) !important;
  background: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.7) 0%,
    rgba(236, 243, 255, 0.62) 100%
  ) !important;
  color: #273349 !important;
  box-shadow:
    0 8px 18px rgba(31, 41, 55, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(12px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(130%) !important;
}

.lang-dropdown {
  border: 1px solid rgba(255, 255, 255, 0.68) !important;
  background: rgba(250, 252, 255, 0.88) !important;
  box-shadow: var(--lp-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.76) !important;
}

.lang-item {
  color: var(--lp-text-soft) !important;
}

.lang-item:hover {
  color: #25324a !important;
  background: rgba(121, 161, 255, 0.12) !important;
}

.hero {
  background: var(--lp-surface-hero) !important;
  border: 1px solid rgba(255, 255, 255, 0.66) !important;
  box-shadow: var(--lp-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(20px) saturate(148%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(148%) !important;
}

.pricing,
.how,
.faq,
.about,
.contact,
.reviews,
.seo-article,
.activation-video,
.header-mini-item,
.header-cart-panel,
.payment-method-modal__dialog,
.product-preview-modal__dialog {
  background: var(--lp-surface-main) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  box-shadow: var(--lp-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.68) !important;
  backdrop-filter: blur(18px) saturate(144%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(144%) !important;
}

.price-card,
.how-card,
.faq-item,
.faq-sticky,
.contact-card,
.review,
.cart-box,
.cart-payment-method__card {
  background: var(--lp-surface-card) !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  box-shadow: var(--lp-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
  backdrop-filter: blur(14px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(135%) !important;
}

.price-card.featured {
  border-color: rgba(122, 147, 255, 0.44) !important;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.84) 0%,
    rgba(234, 242, 255, 0.76) 100%
  ) !important;
  box-shadow:
    0 14px 34px rgba(121, 144, 207, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

.hero h1,
.hero-react__top,
.hero-react__word,
.pricing-header h2,
.faq-header h2,
.how-title,
.about h1,
.contact h1,
.reviews-header h1,
.container h1,
.price-card h3,
.faq-question {
  color: var(--lp-text) !important;
}

.hero p,
.hero-react__description,
.pricing-header p,
.faq-header p,
.how-card p,
.about p,
.contact p,
.review-text,
.faq-answer p,
.faq-sticky p,
.sub,
.meta span,
.price-card .price-card-features li,
.price-card ul li {
  color: var(--lp-text-soft) !important;
}

.price,
.price-card__price-current {
  color: #1b2436 !important;
}

.price-card__price-old {
  color: #8d97aa !important;
}

.faq-item.active {
  border-color: rgba(122, 147, 255, 0.5) !important;
}

.faq-icon {
  border-color: rgba(118, 130, 153, 0.72) !important;
}

.faq-item.active .faq-icon {
  border-color: #6f85ff !important;
}

.site-ticker,
.site-ticker__stats {
  border-color: rgba(255, 255, 255, 0.68) !important;
  background: rgba(255, 255, 255, 0.52) !important;
  box-shadow: 0 8px 18px rgba(31, 41, 55, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(14px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
}

.site-ticker::before {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0),
    rgba(122, 147, 255, 0.16),
    rgba(255, 255, 255, 0)
  ) !important;
  opacity: 0.44 !important;
}

.site-ticker__lead,
.site-ticker__item,
.site-ticker__stat-label {
  color: #5d6a83 !important;
}

.site-ticker__stat strong {
  color: #232f46 !important;
}

.badge,
.badge.best,
.badge.new,
.badge.hit,
.badge.sale,
.badge.popular,
.badge.limited,
.badge.gift,
.badge.pro {
  color: #32425f !important;
  border-color: rgba(181, 197, 232, 0.62) !important;
  background: linear-gradient(
    160deg,
    rgba(255, 255, 255, 0.78) 0%,
    rgba(232, 240, 255, 0.72) 100%
  ) !important;
  box-shadow:
    0 6px 16px rgba(76, 94, 136, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(10px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(130%) !important;
}

.btn:not(.secondary),
.buy-btn,
.faq-chat-btn,
.product-preview-modal__pay {
  border: 1px solid rgba(114, 139, 255, 0.44) !important;
  background: linear-gradient(
    145deg,
    rgba(110, 131, 255, 0.92) 0%,
    rgba(109, 172, 255, 0.92) 100%
  ) !important;
  color: #fbfcff !important;
  box-shadow:
    0 14px 28px rgba(91, 118, 191, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.44),
    inset 0 -10px 16px rgba(74, 109, 202, 0.24) !important;
  text-shadow: 0 1px 0 rgba(34, 52, 95, 0.24);
}

.btn:not(.secondary)::before,
.buy-btn::before,
.faq-chat-btn::before,
.product-preview-modal__pay::before {
  opacity: 0.94 !important;
  background:
    radial-gradient(
      130% 76% at 12% 0%,
      rgba(255, 255, 255, 0.74) 0%,
      rgba(255, 255, 255, 0) 62%
    ),
    radial-gradient(
      120% 120% at 88% 100%,
      rgba(176, 203, 255, 0.42) 0%,
      rgba(176, 203, 255, 0) 70%
    ) !important;
}

.btn:not(.secondary):hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.product-preview-modal__pay:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.04) saturate(1.04) !important;
  box-shadow:
    0 16px 30px rgba(84, 111, 184, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    inset 0 -10px 16px rgba(75, 112, 204, 0.26) !important;
}

.btn.secondary,
.product-preview-modal__promo-apply,
.header-cart-panel__promo button,
.header-mini-remove-btn,
.payment-method-modal__close,
.product-preview-modal__close {
  border: 1px solid rgba(182, 196, 228, 0.64) !important;
  background: linear-gradient(
    160deg,
    rgba(255, 255, 255, 0.74) 0%,
    rgba(235, 242, 255, 0.68) 100%
  ) !important;
  color: #2a3750 !important;
  box-shadow:
    0 8px 18px rgba(76, 94, 136, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(12px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(130%) !important;
}

.btn.secondary:hover,
.product-preview-modal__promo-apply:hover,
.header-cart-panel__promo button:hover,
.header-mini-remove-btn:hover,
.payment-method-modal__close:hover,
.product-preview-modal__close:hover {
  transform: translateY(-1px) !important;
  background: linear-gradient(
    160deg,
    rgba(255, 255, 255, 0.86) 0%,
    rgba(238, 245, 255, 0.8) 100%
  ) !important;
  border-color: rgba(168, 184, 221, 0.74) !important;
}

.product-preview-modal__checkout,
.seo-related {
  background: rgba(255, 255, 255, 0.56) !important;
}

.page-overlay {
  background: rgba(29, 39, 57, 0.24) !important;
}

.product-preview-modal__field-input,
.header-cart-panel__promo input,
.header-cart-panel__email input,
.cart-email input {
  border: 1px solid rgba(182, 197, 228, 0.66) !important;
  background: rgba(255, 255, 255, 0.82) !important;
  color: #1f2a3d !important;
}

.product-preview-modal__field-input::placeholder,
.header-cart-panel__promo input::placeholder,
.header-cart-panel__email input::placeholder,
.cart-email input::placeholder {
  color: #8692a8 !important;
}

footer {
  border-top: 1px solid rgba(182, 198, 230, 0.52) !important;
  background: rgba(255, 255, 255, 0.42) !important;
  color: #66748d !important;
  backdrop-filter: blur(12px) saturate(126%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(126%) !important;
}

footer .footer-link {
  color: #566684 !important;
}

footer .footer-link:hover {
  color: #2d3d5b !important;
}

@keyframes lpFloatA {
  0% { transform: translate3d(-2%, -1%, 0) scale(1); }
  50% { transform: translate3d(2%, 2%, 0) scale(1.04); }
  100% { transform: translate3d(3%, -2%, 0) scale(1.03); }
}

@keyframes lpFloatB {
  0% { transform: translate3d(2%, -2%, 0) scale(1); }
  50% { transform: translate3d(-2%, 2%, 0) scale(1.04); }
  100% { transform: translate3d(-3%, -1%, 0) scale(1.03); }
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after,
  .home-gradient-bg__layer,
  .home-gradient-bg__pointer {
    animation: none !important;
    transform: none !important;
  }
}

/* =========================================================
   Visual Hotfixes: ticker edges, inner-page spacing, badges, footer
   ========================================================= */

/* richer but still soft ambient gradient */
body::before {
  background:
    radial-gradient(circle at 12% 14%, rgba(158, 184, 255, 0.4) 0%, rgba(158, 184, 255, 0) 58%),
    radial-gradient(circle at 72% 18%, rgba(163, 223, 255, 0.32) 0%, rgba(163, 223, 255, 0) 62%),
    radial-gradient(circle at 88% 74%, rgba(255, 206, 228, 0.28) 0%, rgba(255, 206, 228, 0) 60%) !important;
  animation-duration: 56s !important;
}

body::after {
  background:
    radial-gradient(circle at 20% 80%, rgba(195, 210, 255, 0.34) 0%, rgba(195, 210, 255, 0) 62%),
    radial-gradient(circle at 68% 64%, rgba(186, 239, 255, 0.26) 0%, rgba(186, 239, 255, 0) 58%),
    radial-gradient(circle at 50% 8%, rgba(255, 229, 241, 0.22) 0%, rgba(255, 229, 241, 0) 60%) !important;
  animation-duration: 64s !important;
}

.home-gradient-bg__layer,
.home-gradient-bg__pointer {
  mix-blend-mode: screen;
}

/* inner pages should not stick to header */
main.page {
  padding-top: clamp(14px, 2.2vw, 28px) !important;
}

main.page > .about:first-child,
main.page > .contact:first-child,
main.page > .container:first-child {
  margin-top: clamp(14px, 2.8vw, 34px) !important;
}

/* ensure guarantee/about/contact blocks use light system */
.container,
.block,
.card {
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  background: var(--lp-surface-card) !important;
  box-shadow: var(--lp-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.76) !important;
  backdrop-filter: blur(14px) saturate(132%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(132%) !important;
}

.container h1,
.block h2,
.card h2 {
  color: var(--lp-text) !important;
}

.intro,
.block p,
.block li,
.card p,
.card li {
  color: var(--lp-text-soft) !important;
}

/* ticker: smooth edge fade and cleaner stats pill */
.site-ticker {
  overflow: hidden !important;
}

.site-ticker__marquee {
  position: relative;
  overflow: hidden !important;
  mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
}

.site-ticker__track,
.site-ticker__loop {
  display: inline-flex !important;
  align-items: center !important;
}

.site-ticker__stats {
  padding: 7px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(174, 194, 230, 0.74) !important;
  background: linear-gradient(
    158deg,
    rgba(255, 255, 255, 0.86) 0%,
    rgba(232, 241, 255, 0.78) 100%
  ) !important;
  box-shadow:
    0 8px 18px rgba(66, 86, 130, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

.site-ticker__stat-label {
  color: #5a6d8d !important;
}

.site-ticker__stat strong {
  color: #274167 !important;
}

/* product badges should be compact, not full-card width */
.price-card {
  position: relative;
}

.price-card .badge,
.price-card .badge.best,
.price-card .badge.new,
.price-card .badge.hit,
.price-card .badge.sale,
.price-card .badge.popular,
.price-card .badge.limited,
.price-card .badge.gift,
.price-card .badge.pro {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  max-width: calc(100% - 28px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 6px 12px !important;
  line-height: 1.1;
  border-radius: 999px !important;
  z-index: 3;
}

/* prettier footer container */
footer {
  width: min(1240px, calc(100% - 24px)) !important;
  margin: 18px auto 22px !important;
  padding: 14px 18px 16px !important;
  border: 1px solid rgba(184, 202, 236, 0.56) !important;
  border-radius: 16px !important;
  background: linear-gradient(
    162deg,
    rgba(255, 255, 255, 0.68) 0%,
    rgba(236, 243, 255, 0.58) 100%
  ) !important;
  box-shadow:
    0 12px 24px rgba(69, 89, 132, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

footer .footer-links-primary,
footer .footer-links-secondary {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  text-align: center;
}

footer .footer-links-secondary {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed rgba(170, 188, 220, 0.56);
}

footer .footer-copy {
  margin-top: 10px;
  display: block;
}

#how {
  scroll-margin-top: 104px;
}

#pricing {
  scroll-margin-top: 104px;
}

#faq {
  scroll-margin-top: 104px;
}

#payment {
  scroll-margin-top: 104px;
}

@media (max-width: 760px) {
  #how,
  #pricing,
  #faq {
    scroll-margin-top: 132px;
  }

  #payment {
    scroll-margin-top: 124px;
  }

  footer .footer-links-primary,
  footer .footer-links-secondary {
    gap: 6px;
    font-size: 12px;
    line-height: 1.45;
  }

  footer .footer-links-secondary {
    margin-top: 8px;
    padding-top: 8px;
  }

  .site-ticker__marquee {
    mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
  }

  .price-card .badge,
  .price-card .badge.best,
  .price-card .badge.new,
  .price-card .badge.hit,
  .price-card .badge.sale,
  .price-card .badge.popular,
  .price-card .badge.limited,
  .price-card .badge.gift,
  .price-card .badge.pro {
    left: 14px !important;
    right: auto !important;
  }
}

/* =========================================================
   Aceternity-Inspired Gradient Engine (Production Adaptation)
   Source style: background-gradient-animation (21st.dev)
   ========================================================= */
:root {
  --gradient-background-start: #f6f8ff;
  --gradient-background-end: #ecf2ff;
  --gradient-first: 110, 132, 255;
  --gradient-second: 96, 208, 186;
  --gradient-third: 255, 164, 198;
  --gradient-fourth: 255, 208, 142;
  --gradient-fifth: 188, 148, 255;
  --gradient-pointer: 126, 144, 255;
  --gradient-size: min(96vmax, 1280px);
  --gradient-blending: soft-light;
}

html,
body {
  background:
    linear-gradient(40deg, var(--gradient-background-start), var(--gradient-background-end)) !important;
}

body::before,
body::after {
  opacity: 0.4 !important;
  filter: blur(148px) saturate(122%) !important;
}

.home-gradient-bg {
  position: fixed !important;
  inset: -12% -8% -12% -8% !important;
  z-index: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  --home-pointer-x: 0px;
  --home-pointer-y: 0px;
}

.home-gradient-bg__layer,
.home-gradient-bg__pointer {
  position: absolute !important;
  width: var(--gradient-size) !important;
  height: var(--gradient-size) !important;
  top: calc(50% - (var(--gradient-size) / 2)) !important;
  left: calc(50% - (var(--gradient-size) / 2)) !important;
  border-radius: 999px !important;
  mix-blend-mode: var(--gradient-blending) !important;
  will-change: transform, opacity;
  filter: blur(102px) saturate(130%) !important;
}

.home-gradient-bg__layer--1 {
  background:
    radial-gradient(
      circle at center,
      rgba(var(--gradient-first), 0.6) 0%,
      rgba(var(--gradient-first), 0) 58%
    ) !important;
  transform-origin: center center !important;
  animation: lpGradFirst 32s ease-in-out infinite !important;
  opacity: 0.64 !important;
}

.home-gradient-bg__layer--2 {
  background:
    radial-gradient(
      circle at center,
      rgba(var(--gradient-second), 0.56) 0%,
      rgba(var(--gradient-second), 0) 58%
    ) !important;
  transform-origin: calc(50% - 380px) calc(50% - 90px) !important;
  animation: lpGradSecond 36s ease-in-out infinite !important;
  opacity: 0.56 !important;
}

.home-gradient-bg__layer--3 {
  background:
    radial-gradient(
      circle at center,
      rgba(var(--gradient-third), 0.68) 0%,
      rgba(var(--gradient-third), 0) 60%
    ) !important;
  transform-origin: calc(50% + 360px) calc(50% - 80px) !important;
  animation: lpGradThird 42s ease-in-out infinite !important;
  opacity: 0.66 !important;
}

.home-gradient-bg__layer--4 {
  background:
    radial-gradient(
      circle at center,
      rgba(var(--gradient-fourth), 0.64) 0%,
      rgba(var(--gradient-fourth), 0) 60%
    ) !important;
  transform-origin: calc(50% - 180px) calc(50% + 220px) !important;
  animation: lpGradFourth 48s ease-in-out infinite !important;
  opacity: 0.62 !important;
}

.home-gradient-bg__layer--5 {
  background:
    radial-gradient(
      circle at center,
      rgba(var(--gradient-fifth), 0.62) 0%,
      rgba(var(--gradient-fifth), 0) 62%
    ) !important;
  transform-origin: calc(50% - 720px) calc(50% + 680px) !important;
  animation: lpGradFifth 54s ease-in-out infinite !important;
  opacity: 0.58 !important;
}

.home-gradient-bg__pointer {
  width: 140% !important;
  height: 140% !important;
  top: -20% !important;
  left: -20% !important;
  background:
    radial-gradient(
      circle at center,
      rgba(var(--gradient-pointer), 0.64) 0%,
      rgba(var(--gradient-pointer), 0) 56%
    ) !important;
  opacity: 0.74 !important;
  transform: translate3d(
    calc(var(--home-pointer-x) * 0.58),
    calc(var(--home-pointer-y) * 0.58),
    0
  ) !important;
  animation: lpGradPointerPulse 8s ease-in-out infinite alternate !important;
}

@keyframes lpGradFirst {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(10%, -6%, 0) scale(1.1); }
  100% { transform: translate3d(-8%, 6%, 0) scale(1.06); }
}

@keyframes lpGradSecond {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-9%, 10%, 0) scale(1.1); }
  100% { transform: translate3d(7%, -8%, 0) scale(1.06); }
}

@keyframes lpGradThird {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(9%, 8%, 0) scale(1.12); }
  100% { transform: translate3d(-8%, -6%, 0) scale(1.07); }
}

@keyframes lpGradFourth {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-7%, 9%, 0) scale(1.1); }
  100% { transform: translate3d(8%, -5%, 0) scale(1.06); }
}

@keyframes lpGradFifth {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(8%, -8%, 0) scale(1.12); }
  100% { transform: translate3d(-7%, 7%, 0) scale(1.06); }
}

@keyframes lpGradPointerPulse {
  0% { opacity: 0.3; }
  100% { opacity: 0.5; }
}

@media (prefers-reduced-motion: reduce) {
  .home-gradient-bg__layer,
  .home-gradient-bg__pointer {
    animation: none !important;
    transform: none !important;
  }
}

/* Fallback override: keep ambient body gradients alive even with home-gradient-page class */
body.home-gradient-page::before {
  opacity: 0.34 !important;
  animation: premiumBodyGlowA 26s ease-in-out infinite alternate !important;
}

body.home-gradient-page::after {
  opacity: 0.28 !important;
  animation: premiumBodyGlowB 34s ease-in-out infinite alternate !important;
}

/* Hard fallback so the background is always visibly animated */
body.home-gradient-page,
body.home-gradient-page main.page {
  background-size: 180% 180% !important;
  animation: lpBaseGradientShift 24s ease-in-out infinite alternate !important;
}

body.home-gradient-page {
  background:
    radial-gradient(
      118% 92% at 8% 14%,
      rgba(var(--gradient-first), 0.23) 0%,
      rgba(var(--gradient-first), 0) 66%
    ),
    radial-gradient(
      108% 92% at 88% 12%,
      rgba(var(--gradient-second), 0.21) 0%,
      rgba(var(--gradient-second), 0) 66%
    ),
    radial-gradient(
      100% 90% at 52% 88%,
      rgba(var(--gradient-third), 0.3) 0%,
      rgba(var(--gradient-third), 0) 64%
    ),
    radial-gradient(
      96% 84% at 22% 78%,
      rgba(var(--gradient-fourth), 0.28) 0%,
      rgba(var(--gradient-fourth), 0) 64%
    ),
    radial-gradient(
      92% 82% at 78% 74%,
      rgba(var(--gradient-fifth), 0.26) 0%,
      rgba(var(--gradient-fifth), 0) 64%
    ),
    radial-gradient(
      88% 76% at 48% 44%,
      rgba(255, 246, 222, 0.28) 0%,
      rgba(255, 246, 222, 0) 70%
    ),
    linear-gradient(40deg, var(--gradient-background-start), var(--gradient-background-end)) !important;
  background-size: 190% 190%, 176% 176%, 164% 164%, 156% 156%, 148% 148%, 138% 138%, 100% 100% !important;
}

body.home-gradient-page main.page {
  background: transparent !important;
  animation: none !important;
}

body.home-gradient-page::before {
  opacity: 0.44 !important;
  background:
    radial-gradient(circle at 14% 26%, rgba(255, 170, 204, 0.34) 0%, rgba(255, 170, 204, 0) 58%),
    radial-gradient(circle at 78% 18%, rgba(118, 206, 190, 0.28) 0%, rgba(118, 206, 190, 0) 60%),
    radial-gradient(circle at 50% 86%, rgba(255, 224, 168, 0.24) 0%, rgba(255, 224, 168, 0) 64%) !important;
  animation: premiumBodyGlowA 16s ease-in-out infinite alternate !important;
}

body.home-gradient-page::after {
  opacity: 0.38 !important;
  background:
    radial-gradient(circle at 20% 78%, rgba(168, 146, 255, 0.3) 0%, rgba(168, 146, 255, 0) 62%),
    radial-gradient(circle at 82% 68%, rgba(112, 190, 255, 0.24) 0%, rgba(112, 190, 255, 0) 62%),
    radial-gradient(circle at 52% 12%, rgba(255, 201, 160, 0.22) 0%, rgba(255, 201, 160, 0) 64%) !important;
  animation: premiumBodyGlowB 20s ease-in-out infinite alternate !important;
}

body.home-gradient-page main.page::before {
  opacity: 0.56 !important;
  background:
    radial-gradient(76% 64% at 26% 24%, rgba(255, 210, 176, 0.22) 0%, rgba(255, 210, 176, 0) 70%),
    radial-gradient(68% 58% at 78% 32%, rgba(138, 200, 255, 0.2) 0%, rgba(138, 200, 255, 0) 70%) !important;
  animation: premiumPageHazeA 14s ease-in-out infinite alternate !important;
}

body.home-gradient-page main.page::after {
  opacity: 0.46 !important;
  background:
    radial-gradient(70% 62% at 70% 76%, rgba(255, 172, 206, 0.2) 0%, rgba(255, 172, 206, 0) 70%),
    radial-gradient(62% 56% at 24% 68%, rgba(168, 148, 255, 0.2) 0%, rgba(168, 148, 255, 0) 70%) !important;
  animation: premiumPageHazeB 18s ease-in-out infinite alternate !important;
}

@keyframes lpBaseGradientShift {
  0% {
    background-position: 0% 0%, 100% 0%, 50% 100%, 12% 90%, 88% 86%, 52% 44%, 0% 0%;
  }
  50% {
    background-position: 34% 18%, 66% 18%, 50% 64%, 24% 58%, 72% 58%, 46% 54%, 0% 0%;
  }
  100% {
    background-position: 100% 28%, 0% 28%, 48% 0%, 32% 18%, 66% 16%, 52% 44%, 0% 0%;
  }
}

/* Resume activation shortcut: align with site buttons and avoid support widget overlap */
.gptishka-resume-activation {
  position: fixed;
  right: 20px;
  bottom: 92px;
  z-index: 10040;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  background: linear-gradient(135deg, var(--primary, #2a5bff), var(--primary-2, #2148d6));
  box-shadow:
    0 14px 30px rgba(33, 72, 214, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
  color: #ffffff;
  font: 700 13px/1 "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  text-decoration: none;
  letter-spacing: 0.01em;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.gptishka-resume-activation:hover,
.gptishka-resume-activation:focus-visible {
  transform: translateY(-1px);
  filter: saturate(108%);
  box-shadow:
    0 18px 34px rgba(33, 72, 214, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.34);
  color: #ffffff;
}

@media (max-width: 640px) {
  .gptishka-resume-activation {
    right: 10px;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px));
    min-height: 42px;
    padding: 0 14px;
    border-radius: 11px;
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gptishka-resume-activation {
    transition: none;
  }
}

/* =========================================================
   Final Visual Tuning: Brighter Buttons + Rich Multi-Color Gradient
   ========================================================= */
:root {
  --lp-btn-a: #5f8dff;
  --lp-btn-b: #63ccff;
  --lp-btn-c: #887dff;
  --lp-btn-shadow: 0 14px 28px rgba(73, 111, 255, 0.3);
  --lp-btn-shadow-hover: 0 18px 34px rgba(73, 111, 255, 0.38);
  --gradient-background-start: #f5f8ff;
  --gradient-background-end: #eef4ff;
  --gradient-first: 92, 122, 255;
  --gradient-second: 92, 220, 232;
  --gradient-third: 255, 158, 197;
  --gradient-fourth: 255, 209, 132;
  --gradient-fifth: 166, 136, 255;
  --gradient-pointer: 142, 122, 255;
  --gradient-size: min(112vmax, 1500px);
  --gradient-blending: screen;
}

/* Primary buttons should feel lighter and more premium */
.btn:not(.secondary),
.buy-btn,
.faq-chat-btn,
.redeem-btn-primary,
.gptishka-resume-activation,
.support-widget__fab,
.support-widget__cta,
#manualSupportBtn.redeem-btn-primary {
  border-color: rgba(140, 173, 255, 0.56) !important;
  background: linear-gradient(132deg, var(--lp-btn-a) 0%, var(--lp-btn-c) 44%, var(--lp-btn-b) 100%) !important;
  color: #ffffff !important;
  box-shadow: var(--lp-btn-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
  text-shadow: none !important;
}

.btn:not(.secondary):hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.redeem-btn-primary:hover,
.gptishka-resume-activation:hover,
.support-widget__fab:hover,
.support-widget__cta:hover,
#manualSupportBtn.redeem-btn-primary:hover {
  filter: saturate(108%) brightness(1.04) !important;
  box-shadow: var(--lp-btn-shadow-hover), inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

/* Richer, less flat ambient gradient */
body.home-gradient-page {
  background:
    radial-gradient(118% 96% at 8% 10%, rgba(var(--gradient-first), 0.32) 0%, rgba(var(--gradient-first), 0) 66%),
    radial-gradient(116% 96% at 92% 10%, rgba(var(--gradient-second), 0.28) 0%, rgba(var(--gradient-second), 0) 68%),
    radial-gradient(104% 92% at 54% 90%, rgba(var(--gradient-third), 0.3) 0%, rgba(var(--gradient-third), 0) 68%),
    radial-gradient(92% 84% at 20% 78%, rgba(var(--gradient-fourth), 0.28) 0%, rgba(var(--gradient-fourth), 0) 66%),
    radial-gradient(92% 84% at 80% 74%, rgba(var(--gradient-fifth), 0.26) 0%, rgba(var(--gradient-fifth), 0) 66%),
    linear-gradient(40deg, var(--gradient-background-start), var(--gradient-background-end)) !important;
  background-size: 196% 196%, 182% 182%, 170% 170%, 160% 160%, 152% 152%, 100% 100% !important;
  animation: lpBaseGradientShiftRich 18s ease-in-out infinite alternate !important;
}

body.home-gradient-page::before {
  opacity: 0.5 !important;
  background:
    radial-gradient(circle at 14% 24%, rgba(255, 172, 206, 0.38) 0%, rgba(255, 172, 206, 0) 58%),
    radial-gradient(circle at 78% 16%, rgba(108, 220, 234, 0.3) 0%, rgba(108, 220, 234, 0) 60%),
    radial-gradient(circle at 50% 86%, rgba(255, 214, 141, 0.3) 0%, rgba(255, 214, 141, 0) 64%) !important;
  filter: blur(118px) saturate(132%) !important;
}

body.home-gradient-page::after {
  opacity: 0.44 !important;
  background:
    radial-gradient(circle at 20% 78%, rgba(174, 146, 255, 0.34) 0%, rgba(174, 146, 255, 0) 62%),
    radial-gradient(circle at 82% 66%, rgba(112, 190, 255, 0.28) 0%, rgba(112, 190, 255, 0) 62%),
    radial-gradient(circle at 52% 12%, rgba(255, 200, 160, 0.26) 0%, rgba(255, 200, 160, 0) 64%) !important;
  filter: blur(124px) saturate(128%) !important;
}

.home-gradient-bg__layer,
.home-gradient-bg__pointer {
  filter: blur(90px) saturate(136%) !important;
}

.home-gradient-bg__pointer {
  background:
    radial-gradient(circle at center, rgba(var(--gradient-pointer), 0.72) 0%, rgba(var(--gradient-pointer), 0) 58%) !important;
  opacity: 0.82 !important;
  transform: translate3d(
    calc(var(--home-pointer-x) * 0.72),
    calc(var(--home-pointer-y) * 0.72),
    0
  ) !important;
  animation: lpGradPointerPulse 6s ease-in-out infinite alternate !important;
}

@keyframes lpBaseGradientShiftRich {
  0% {
    background-position: 0% 0%, 100% 0%, 50% 100%, 10% 92%, 90% 86%, 0% 0%;
  }
  50% {
    background-position: 36% 18%, 64% 18%, 50% 62%, 24% 56%, 74% 58%, 0% 0%;
  }
  100% {
    background-position: 100% 26%, 0% 26%, 48% 0%, 32% 16%, 66% 18%, 0% 0%;
  }
}

/* =========================================================
   Pulse Beams on Hover (Aceternity-inspired, lightweight)
   ========================================================= */
:root {
  --lp-pulse-beam-a: rgba(135, 196, 255, 0);
  --lp-pulse-beam-b: rgba(255, 255, 255, 0.76);
  --lp-pulse-beam-c: rgba(174, 148, 255, 0.62);
  --lp-pulse-beam-d: rgba(135, 196, 255, 0.34);
}

.lp-pulse-beam-target {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
}

.gptishka-resume-activation.lp-pulse-beam-target {
  position: fixed !important;
}

.lp-pulse-beam-target .lp-pulse-beams {
  position: absolute;
  inset: -28%;
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transform: translate3d(-14%, 0, 0) scale(1.07);
  mix-blend-mode: screen;
  filter: blur(0.2px) saturate(124%);
  background:
    linear-gradient(
      116deg,
      transparent 6%,
      var(--lp-pulse-beam-a) 26%,
      rgba(255, 255, 255, 0.22) 39%,
      var(--lp-pulse-beam-b) 50%,
      var(--lp-pulse-beam-d) 60%,
      transparent 74%
    ),
    linear-gradient(
      64deg,
      transparent 14%,
      rgba(174, 148, 255, 0) 34%,
      var(--lp-pulse-beam-c) 52%,
      rgba(174, 148, 255, 0) 70%
    ),
    radial-gradient(34% 62% at 26% 52%, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
  transition: opacity 0.24s ease, transform 0.34s ease;
}

.lp-pulse-beam-target:hover .lp-pulse-beams,
.lp-pulse-beam-target:focus-visible .lp-pulse-beams {
  opacity: 0.9;
  transform: translate3d(0, 0, 0) scale(1);
  animation:
    lpPulseBeamsSweep 1.55s cubic-bezier(0.32, 0, 0.2, 1) infinite,
    lpPulseBeamsBreath 2.4s ease-in-out infinite;
}

.lp-pulse-beam-target:active .lp-pulse-beams {
  opacity: 0.82;
  animation-duration: 1.08s, 1.7s;
}

@keyframes lpPulseBeamsSweep {
  0% {
    background-position: -240% 0, -200% 0, 0 0;
  }
  100% {
    background-position: 240% 0, 190% 0, 0 0;
  }
}

@keyframes lpPulseBeamsBreath {
  0%,
  100% {
    filter: blur(0.2px) saturate(120%);
  }
  50% {
    filter: blur(0.45px) saturate(154%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lp-pulse-beam-target .lp-pulse-beams {
    transition: opacity 0.2s ease, transform 0.2s ease;
  }

  .lp-pulse-beam-target:hover .lp-pulse-beams,
  .lp-pulse-beam-target:focus-visible .lp-pulse-beams {
    opacity: 0.55;
    animation: none;
  }
}

/* Fallback for pages that do not execute app.min.js */
:where(
  a.btn,
  button.btn,
  .buy-btn,
  .faq-chat-btn,
  .redeem-btn,
  .redeem-btn-primary,
  .support-widget__fab,
  .support-widget__cta,
  .btn-primary,
  .btn-secondary
):not(.lp-pulse-beam-target) {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
}

:where(
  a.btn,
  button.btn,
  .buy-btn,
  .faq-chat-btn,
  .redeem-btn,
  .redeem-btn-primary,
  .support-widget__fab,
  .support-widget__cta,
  .btn-primary,
  .btn-secondary
):not(.lp-pulse-beam-target)::after {
  content: "";
  position: absolute;
  inset: -28%;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  mix-blend-mode: screen;
  background:
    linear-gradient(
      116deg,
      transparent 8%,
      rgba(255, 255, 255, 0) 28%,
      rgba(255, 255, 255, 0.22) 40%,
      rgba(255, 255, 255, 0.76) 50%,
      rgba(142, 198, 255, 0.36) 61%,
      rgba(142, 198, 255, 0) 74%
    ),
    linear-gradient(
      62deg,
      transparent 16%,
      rgba(174, 148, 255, 0) 36%,
      rgba(174, 148, 255, 0.62) 52%,
      rgba(174, 148, 255, 0) 70%
    );
  transition: opacity 0.22s ease;
}

:where(
  a.btn,
  button.btn,
  .buy-btn,
  .faq-chat-btn,
  .redeem-btn,
  .redeem-btn-primary,
  .support-widget__fab,
  .support-widget__cta,
  .btn-primary,
  .btn-secondary
):not(.lp-pulse-beam-target):hover::after,
:where(
  a.btn,
  button.btn,
  .buy-btn,
  .faq-chat-btn,
  .redeem-btn,
  .redeem-btn-primary,
  .support-widget__fab,
  .support-widget__cta,
  .btn-primary,
  .btn-secondary
):not(.lp-pulse-beam-target):focus-visible::after {
  opacity: 0.88;
  animation: lpPulseBeamsSweep 1.45s cubic-bezier(0.32, 0, 0.2, 1) infinite;
}

/* =========================================================
   UX Hotfixes: nav layering, smoother transitions, softer buttons
   ========================================================= */
:root {
  --lp-btn-a: rgba(95, 141, 255, 0.78);
  --lp-btn-b: rgba(99, 204, 255, 0.74);
  --lp-btn-c: rgba(136, 125, 255, 0.76);
  --lp-btn-shadow: 0 10px 22px rgba(73, 111, 255, 0.2);
  --lp-btn-shadow-hover: 0 14px 28px rgba(73, 111, 255, 0.26);
}

header {
  z-index: 400 !important;
  overflow: visible !important;
}

.nav,
.header-tools,
.lang-switch {
  position: relative;
  overflow: visible !important;
}

.lang-dropdown {
  z-index: 500 !important;
}

.gptishka-resume-activation {
  position: fixed !important;
  right: 20px !important;
  bottom: 92px !important;
  align-self: auto !important;
  flex: none !important;
  left: auto !important;
  width: auto !important;
  min-width: 0 !important;
  inline-size: max-content !important;
  max-width: calc(100vw - 24px) !important;
  display: inline-flex !important;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .gptishka-resume-activation {
    right: 10px !important;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: calc(100vw - 20px) !important;
    white-space: nowrap;
  }
}

.btn:not(.secondary),
.buy-btn,
.faq-chat-btn,
.redeem-btn-primary,
.gptishka-resume-activation,
.support-widget__fab,
.support-widget__cta,
#manualSupportBtn.redeem-btn-primary {
  border-color: rgba(170, 196, 255, 0.58) !important;
  background: linear-gradient(
    132deg,
    var(--lp-btn-a) 0%,
    var(--lp-btn-c) 44%,
    var(--lp-btn-b) 100%
  ) !important;
  box-shadow: var(--lp-btn-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
  backdrop-filter: blur(10px) saturate(128%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(128%) !important;
}

.btn.secondary,
.redeem-btn:not(.redeem-btn-primary),
.header-cart-panel__promo button,
.header-mini-remove-btn,
.cart-remove-btn,
.payment-method-modal__option {
  background: rgba(255, 255, 255, 0.56) !important;
  border-color: rgba(172, 191, 224, 0.58) !important;
  color: #2d3f59 !important;
  box-shadow: 0 8px 20px rgba(21, 46, 88, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.62) !important;
  backdrop-filter: blur(10px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(125%) !important;
}

.btn:not(.secondary):hover,
.buy-btn:hover,
.faq-chat-btn:hover,
.redeem-btn-primary:hover,
.gptishka-resume-activation:hover,
.support-widget__fab:hover,
.support-widget__cta:hover,
#manualSupportBtn.redeem-btn-primary:hover {
  filter: saturate(106%) brightness(1.03) !important;
  box-shadow: var(--lp-btn-shadow-hover), inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

html.is-entering header,
html.is-leaving header {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

html.is-entering main.page,
html.is-entering footer {
  opacity: 1;
  transform: none;
}

html.is-entering.is-entering-active main.page,
html.is-entering.is-entering-active footer {
  opacity: 1;
  transform: none;
  transition: none;
}

.page-overlay {
  inset: 0 !important;
  z-index: 95 !important;
  background: rgba(24, 37, 58, 0.26) !important;
  backdrop-filter: blur(0px) saturate(102%) !important;
  -webkit-backdrop-filter: blur(0px) saturate(102%) !important;
  transition: opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1), backdrop-filter 0.34s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

html.is-entering .page-overlay,
html.is-leaving .page-overlay {
  opacity: 1 !important;
  backdrop-filter: blur(4px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(4px) saturate(108%) !important;
}

html.is-entering.is-entering-active .page-overlay {
  opacity: 0 !important;
  backdrop-filter: blur(0px) saturate(102%) !important;
  -webkit-backdrop-filter: blur(0px) saturate(102%) !important;
}

html.is-leaving main.page,
html.is-leaving footer {
  opacity: 0.24;
  transform: translateY(4px);
  transition: opacity 0.24s ease, transform 0.24s ease;
}

@media (prefers-reduced-motion: reduce) {
  html.is-entering main.page,
  html.is-entering footer,
  html.is-leaving main.page,
  html.is-leaving footer {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  html.is-entering .page-overlay,
  html.is-entering.is-entering-active .page-overlay,
  html.is-leaving .page-overlay {
    opacity: 0 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: none !important;
  }
}

@media (max-width: 900px) {
  html.is-entering main.page,
  html.is-entering footer,
  html.is-leaving main.page,
  html.is-leaving footer {
    transform: none !important;
  }

  html.is-entering.is-entering-active main.page,
  html.is-entering.is-entering-active footer {
    transition: opacity 0.32s ease !important;
  }

  html.is-leaving main.page,
  html.is-leaving footer {
    opacity: 0.36 !important;
    transition: opacity 0.22s ease !important;
  }

  .page-overlay {
    transition: opacity 0.26s ease, backdrop-filter 0.26s ease !important;
  }
}

/* Final safety override for floating resume CTA sizing */
.gptishka-resume-activation {
  inline-size: fit-content !important;
  width: fit-content !important;
  max-inline-size: calc(100vw - 24px) !important;
}

/* =========================================================
   Performance-Safe Overrides (mobile + weaker devices)
   ========================================================= */
body.home-gradient-page-lite {
  background:
    radial-gradient(140% 95% at 10% -10%, rgba(135, 170, 255, 0.22), transparent 58%),
    radial-gradient(130% 92% at 88% 8%, rgba(132, 236, 255, 0.16), transparent 62%),
    radial-gradient(120% 96% at 52% 100%, rgba(255, 158, 212, 0.12), transparent 68%),
    linear-gradient(180deg, #f6f9ff 0%, #eef4ff 52%, #f7fbff 100%) !important;
}

body.home-gradient-page-lite::before,
body.home-gradient-page-lite::after,
body.home-gradient-page-lite main.page::before,
body.home-gradient-page-lite main.page::after {
  display: none !important;
  animation: none !important;
}

/* Desktop: reduce GPU pressure from animated ambient background */
body.home-gradient-page .home-gradient-bg__layer--4,
body.home-gradient-page .home-gradient-bg__layer--5 {
  display: none !important;
}

body.home-gradient-page .home-gradient-bg__layer {
  filter: blur(84px) saturate(116%) !important;
}

body.home-gradient-page .home-gradient-bg__pointer {
  filter: blur(74px) saturate(120%) !important;
  opacity: 0.52 !important;
}

@media (max-width: 900px) {
  #siteTicker {
    display: grid !important;
  }

  body.home-gradient-page {
    background:
      radial-gradient(130% 92% at 12% -8%, rgba(138, 169, 255, 0.18), transparent 58%),
      radial-gradient(120% 88% at 86% 12%, rgba(140, 232, 255, 0.13), transparent 60%),
      linear-gradient(180deg, #f8faff 0%, #f1f6ff 52%, #f9fbff 100%) !important;
  }

  .home-gradient-bg {
    display: none !important;
  }

  header,
  .hero,
  .pricing,
  .how,
  .faq,
  .about,
  .contact,
  .reviews,
  .container,
  .activation-video,
  .price-card,
  .faq-item,
  .faq-sticky,
  .review,
  .cart-box,
  .contact-card,
  .block,
  .card {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 6px 18px rgba(17, 35, 70, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
  }

  .btn:not(.secondary),
  .buy-btn,
  .faq-chat-btn,
  .redeem-btn-primary,
  .gptishka-resume-activation,
  .support-widget__fab,
  .support-widget__cta,
  #manualSupportBtn.redeem-btn-primary {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  main.page {
    padding-top: 10px !important;
  }

  .hero {
    margin: 16px auto 36px !important;
    padding: 20px 15px !important;
  }

  .hero h1 {
    font-size: clamp(1.72rem, 8vw, 2.2rem) !important;
    line-height: 1.08 !important;
  }

  .hero p {
    font-size: 0.98rem !important;
    line-height: 1.56 !important;
    margin-bottom: 20px !important;
  }

  .pricing,
  .how,
  .faq,
  .about,
  .contact,
  .reviews,
  .container,
  .activation-video {
    margin-bottom: 42px !important;
    padding: 16px !important;
  }

  .price-card {
    padding: 18px !important;
  }

  .gptishka-resume-activation {
    right: 10px !important;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    max-width: calc(100vw - 20px) !important;
    font-size: 13px !important;
  }
}

/* =========================================================
   Mobile Header + Overflow + Ticker Stabilization
   ========================================================= */
html,
body {
  max-width: 100%;
  overflow-x: clip !important;
  overscroll-behavior-x: none;
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden !important;
  }
}

main.page,
header,
footer {
  max-width: 100%;
  overflow-x: clip;
}

@media (max-width: 900px) {
  header {
    top: 8px !important;
    width: calc(100% - 12px) !important;
    margin-top: 0 !important;
    border-radius: 14px !important;
  }

  .nav {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
    padding: 8px 10px !important;
  }

  .nav > nav {
    grid-column: 1 / -1 !important;
    order: 3 !important;
    width: 100% !important;
    margin-top: 2px !important;
    padding-top: 6px !important;
    border-top: 1px solid rgba(169, 191, 223, 0.34) !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .nav > nav::-webkit-scrollbar {
    display: none !important;
  }

  .nav > nav a {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    padding: 7px 9px !important;
    border-radius: 9px !important;
  }

  .header-tools {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    margin: 0 !important;
    order: 1 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .nav > .lang-switch,
  .header-tools .lang-switch {
    margin: 0 !important;
    align-self: center !important;
  }

  header .logo-link {
    grid-column: 1 !important;
    align-self: center !important;
  }

  header .logo-img {
    height: 40px !important;
  }

  .lang-current {
    height: 34px !important;
    padding: 0 9px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    gap: 6px !important;
  }

  .lang-current span:not(.arrow) {
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .lang-dropdown {
    right: 0 !important;
    top: calc(100% + 6px) !important;
    min-width: 146px !important;
  }

  .site-ticker {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    padding: 6px 10px !important;
    min-height: 40px !important;
    border-radius: 14px 14px 0 0 !important;
  }

  .site-ticker__marquee {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .site-ticker__track {
    animation-duration: 120s !important;
  }

  .site-ticker__item {
    font-size: 11px !important;
    padding: 1px 6px !important;
    max-width: 148px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .site-ticker__sep {
    margin: 0 8px !important;
  }

  .site-ticker__stats {
    padding: 4px 8px !important;
    gap: 4px !important;
    font-size: 10px !important;
    border-radius: 999px !important;
  }

  .site-ticker__stat strong {
    font-size: 11px !important;
  }

  main.page::before,
  main.page::after {
    width: min(980px, 100vw) !important;
    max-width: 100vw !important;
  }
}

@media (max-width: 760px) {
  .site-ticker__stats {
    display: inline-flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    width: auto !important;
    max-width: calc(100% - 10px) !important;
    padding: 5px 10px !important;
    gap: 6px !important;
    white-space: nowrap !important;
  }

  .site-ticker__stat {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    white-space: nowrap !important;
  }

  .site-ticker__stat-label {
    display: inline !important;
    visibility: visible !important;
    opacity: 0.82 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    white-space: nowrap !important;
  }

  .site-ticker__stat strong {
    font-size: 12px !important;
    line-height: 1.1 !important;
  }
}

@media (max-width: 640px) {
  .nav {
    padding: 7px 9px !important;
  }

  header .logo-img {
    height: 36px !important;
  }

  .header-tools {
    gap: 6px !important;
  }

  .lang-current {
    height: 32px !important;
    padding: 0 8px !important;
  }

  .lang-current span:not(.arrow) {
    max-width: 56px;
  }

  .site-ticker {
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 6px 8px !important;
  }

  .site-ticker__marquee {
    min-height: 19px !important;
    min-width: 0 !important;
  }

  .site-ticker__track {
    animation-duration: 132s !important;
  }

  .site-ticker__item {
    font-size: 10px !important;
    padding: 1px 5px !important;
    max-width: 132px !important;
  }

  .site-ticker__stats {
    justify-self: end !important;
    justify-content: flex-end !important;
    align-self: center !important;
    width: auto !important;
    max-width: min(48vw, 192px) !important;
    overflow: hidden !important;
    padding: 4px 8px !important;
    font-size: 9px !important;
    gap: 4px !important;
    white-space: nowrap !important;
  }

  .site-ticker__stat {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    white-space: nowrap !important;
  }

  .site-ticker__stat-label {
    display: inline-block !important;
    max-width: 92px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: bottom !important;
    font-size: 9px !important;
    opacity: 0.84 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
  }

  .site-ticker__stat strong {
    font-size: 11px !important;
    letter-spacing: 0.015em !important;
  }
}

/* =========================================================
   Soft Progressive Page Reveal
   ========================================================= */
main.page > .soft-reveal-item {
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  filter: saturate(97%) blur(0.2px);
  transition:
    opacity 0.56s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.56s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.56s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--soft-reveal-delay, 0ms);
  will-change: opacity, transform;
}

main.page > .soft-reveal-item.is-soft-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: none;
}

@media (max-width: 900px) {
  main.page > .soft-reveal-item {
    transform: translate3d(0, 10px, 0);
    transition-duration: 0.44s;
  }
}

@media (prefers-reduced-motion: reduce) {
  main.page > .soft-reveal-item {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}

@media (max-width: 760px) {
  header,
  header.is-scrolled {
    background: linear-gradient(
      138deg,
      rgba(255, 255, 255, 0.98) 0%,
      rgba(248, 251, 255, 0.96) 100%
    ) !important;
    border-color: rgba(210, 222, 239, 0.9) !important;
    box-shadow:
      0 10px 22px rgba(31, 41, 55, 0.08),
      inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* Payment method modal final alignment guard */
.payment-method-modal {
  z-index: 12000 !important;
}

.payment-method-modal__dialog {
  position: relative !important;
  z-index: 2 !important;
}

.payment-method-modal__title {
  padding-right: 42px !important;
}

.payment-method-modal__close {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  inset-inline-start: auto !important;
  inset-inline-end: 12px !important;
  margin-left: 0 !important;
  z-index: 3 !important;
  transform: none !important;
}

/* Softer hover for payment system choices */
.payment-method-modal__option:hover {
  background: linear-gradient(
    160deg,
    rgba(255, 255, 255, 0.96) 0%,
    rgba(244, 249, 255, 0.92) 100%
  ) !important;
  border-color: rgba(150, 172, 208, 0.56) !important;
  box-shadow:
    0 8px 18px rgba(28, 45, 78, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
  filter: none !important;
}

/* Product card modal close button alignment guard */
.product-preview-modal {
  z-index: 12000 !important;
}

.product-preview-modal__dialog {
  position: relative !important;
  z-index: 2 !important;
}

.product-preview-modal__head {
  padding-right: 44px !important;
}

.product-preview-modal__close {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  inset-inline-start: auto !important;
  inset-inline-end: 12px !important;
  margin: 0 !important;
  z-index: 3 !important;
  transform: none !important;
}


