@font-face {
  font-family: "MQB Sans";
  src: url("mqb-sans.woff2") format("woff2");
  font-weight: 100 1000;
  font-display: swap;
}
:root {
  --ink: #17242a;
  --muted: #5e6d73;
  --blue: #1256df;
  --blue-light: #eaf1ff;
  --green: #087b58;
  --green-light: #eaf7f1;
  --red: #d64740;
  --yellow: #edb720;
  --line: #dfe7e9;
  --wash: #f5f8fa;
  --font-display: "MQB Sans", Arial, sans-serif;
  --emerald: #087b58;
}
* {
  box-sizing: border-box;
  letter-spacing: 0 !important;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
}
body {
  margin: 0;
  color: var(--ink);
  background: white;
  font: 15px/1.6 var(--font-display);
  -webkit-font-smoothing: antialiased;
}
button,
input,
textarea {
  font: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
  border: 0;
}
button:disabled {
  cursor: wait;
  opacity: 0.65;
}
a {
  color: var(--blue);
  text-decoration: none;
}
a:hover {
  color: #093da8;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
svg {
  width: 20px;
  height: 20px;
  flex: none;
  vertical-align: middle;
}
h1,
h2,
h3,
h4,
h5,
p,
ul,
figure {
  margin: 0;
}
h1,
h2,
h3,
h4,
h5 {
  font-family: var(--font-display);
  line-height: 1.2;
  font-weight: 700;
}
p {
  color: var(--muted);
}
ul {
  list-style: none;
  padding: 0;
}
strong,
b {
  font-weight: 650;
}
:focus-visible {
  outline: 3px solid #1b65e5;
  outline-offset: 4px;
}
[hidden] {
  display: none !important;
}
.container {
  width: min(100%, 1328px);
  padding-inline: 32px;
  margin-inline: auto;
  position: relative;
}
.row {
  display: flex;
  flex-wrap: wrap;
  margin-inline: -14px;
}
.row > * {
  padding-inline: 14px;
  min-width: 0;
  width: 100%;
}
.col-lg-6,
.col-md-6 {
  width: 50%;
}
.col-lg-4 {
  width: 32%;
}
.col-lg-2 {
  width: 17%;
}
.text-center {
  text-align: center;
}
.align-items-center {
  align-items: center;
}
.mb-3 {
  margin-bottom: 18px;
}
.mt-3 {
  margin-top: 18px;
}
.g-4,
.gy-4 {
  row-gap: 28px;
}
main > section {
  padding-block: 92px;
  scroll-margin-top: 25px;
}
section > .container > .text-center,
section > .container > .rx-gst-head {
  max-width: 900px;
  margin: 0 auto 42px !important;
}
.sec-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--green);
  font-size: 11px;
  font-weight: 750;
  text-transform: uppercase;
  margin-bottom: 17px;
}
.sec-label svg {
  width: 16px;
  height: 16px;
}
.sec-title,
.rx-gst-head h2 {
  font-size: 38px;
  line-height: 1.2;
  text-wrap: balance;
  margin-bottom: 18px;
}
.sec-desc {
  font-size: 16px;
  line-height: 1.8;
  max-width: 740px;
}
.sec-desc.center {
  margin-inline: auto;
}
.text-center .sec-title {
  max-width: 870px;
  margin-inline: auto;
}
.text-link {
  display: inline-flex;
  gap: 12px;
  align-items: center;
  font-size: 14px;
  font-weight: 650;
}
.text-link svg {
  width: 17px;
}
.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  padding: 12px;
  background: #fff;
  z-index: 300;
}
.skip-link:focus {
  top: 12px;
}
.icon-box {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--blue-light) !important;
  box-shadow: none !important;
  color: var(--blue);
  flex: none;
}
.icon-box svg {
  width: 24px;
  height: 24px;
  color: inherit !important;
}
.icon-box.sm {
  width: 38px;
  height: 38px;
}
.icon-box.sm svg {
  width: 20px;
  height: 20px;
}
.icon-box.xl {
  width: 58px;
  height: 58px;
}
.icon-teal,
.icon-emerald {
  background: var(--green-light) !important;
  color: var(--green);
}
.icon-amber {
  background: #fff6d9 !important;
  color: #97700b;
}
.icon-rose {
  background: #fff0ed !important;
  color: var(--red);
}
.icon-violet,
.icon-navy,
.icon-sky {
  background: #eaf1ff !important;
  color: var(--blue);
}
.navbar {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.98);
  border-bottom: 1px solid var(--line);
}
.navbar > .container {
  min-height: 88px;
  display: flex;
  align-items: center;
  gap: 30px;
}
.navbar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: none;
  color: var(--ink);
}
.logo-frame {
  display: block;
  position: relative;
  width: 147px;
  height: 57px;
  overflow: hidden;
  flex: none;
}
.logo-frame img {
  max-width: none;
  width: 307px;
  height: auto;
  position: absolute;
  top: -71px;
  left: -69px;
}
.brand-text-group {
  display: none;
}
.navbar-collapse {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex: 1;
}
.navbar-nav {
  display: flex;
  gap: 22px;
  align-items: center;
}
.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--ink);
  font-weight: 550;
  white-space: nowrap;
  transition: color 0.2s ease;
}
.nav-link svg {
  display: block;
  width: 15px !important;
  height: 15px !important;
  flex: 0 0 15px;
  color: #64748b;
  opacity: 0.82 !important;
  transition: color 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
.nav-link:hover {
  color: var(--blue);
}
.nav-link:hover svg {
  color: var(--blue);
  opacity: 1 !important;
  transform: translateY(-1px);
}
.navbar-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}
.btn-partner-nav {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  transition: color 0.2s ease;
}
.btn-partner-nav svg {
  display: block;
  flex: none;
  color: #64748b;
  opacity: 0.9;
}
.btn-partner-nav:hover {
  color: var(--blue);
}
.btn-partner-nav:hover svg {
  color: var(--blue);
}
.btn-login {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 0;
  background: none;
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
}
.btn-trial-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 17px;
  background: var(--blue);
  color: white;
  border-radius: 6px;
  font-weight: 650;
  font-size: 13px;
  white-space: nowrap;
}
.btn-trial-nav:hover {
  background: #0d43b2;
  color: white;
}
.btn-trial-nav svg {
  display: block;
  flex: none;
}
.navbar-toggler {
  display: none;
  padding: 10px;
  background: var(--wash);
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
}
.login-dropdown {
  position: relative;
}
.login-dropdown-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 14px);
  width: 356px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 16px 42px #17242a1a;
  overflow: hidden;
}
.login-dd-head {
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
}
.login-dd-head-title {
  font-size: 14px;
  font-weight: 700;
}
.login-dd-head-title svg {
  width: 16px;
  margin-right: 6px;
}
.login-dd-head-sub,
.login-dd-desc {
  font-size: 12px;
  color: var(--muted);
}
.login-dd-body {
  padding: 12px;
}
.login-dd-sep {
  font-size: 10px;
  font-weight: 650;
  text-transform: uppercase;
  color: var(--muted);
  padding: 10px;
}
.login-dd-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 9px;
  color: var(--ink);
  border-radius: 5px;
}
.login-dd-item:hover {
  background: var(--wash);
}
.login-dd-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  background: var(--blue-light);
  color: var(--blue);
  border-radius: 6px;
  flex: none;
}
.login-dd-icon svg {
  color: inherit !important;
}
.login-dd-title {
  font-size: 13px;
  font-weight: 650;
}
.login-dd-tag {
  font-size: 10px;
  color: var(--green);
  background: var(--green-light);
  padding: 2px 6px;
  margin-left: 4px;
  border-radius: 3px;
}
.login-dd-arrow {
  width: 15px;
  margin-left: auto;
}
.login-dd-divider {
  height: 1px;
  background: var(--line);
  margin-top: 8px;
}
main > .hero {
  position: relative;
  padding: 0;
  isolation: isolate;
  overflow: hidden;
  background: #fafbfc;
  min-height: 665px;
}
.hero-inner {
  min-height: 665px;
  display: flex;
  align-items: center;
}
.hero-art {
  position: absolute;
  right: -2px;
  bottom: 0;
  width: min(1240px, 92%);
  max-width: none;
  height: auto;
  z-index: -1;
}
.hero-copy {
  width: 470px;
  padding-block: 46px;
}
.h-rating {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  margin-bottom: 20px;
}
.h-rating-stars {
  display: flex;
  gap: 2px;
  color: #af8200;
}
.h-rating-stars svg {
  width: 12px !important;
  height: 12px !important;
  color: inherit !important;
}
.h-rating-text {
  font-size: 11px;
  color: var(--muted);
}
.hero-title {
  font-size: 68px;
  line-height: 1.02;
  margin-bottom: 18px;
  font-weight: 750;
}
.hero-offer {
  font-size: 30px;
  font-weight: 650;
  line-height: 1.25;
  max-width: 435px;
  margin-bottom: 20px;
}
.hero-offer .grad {
  color: var(--blue);
}
.hero-intro {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 26px;
  max-width: 385px;
}
.h-cta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.btn-hero-primary,
.btn-hero-secondary,
.b1,
.b2,
.rx-gst-btn {
  min-height: 47px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 6px;
  padding: 12px 17px;
  font-size: 13px;
  font-weight: 650;
}
.btn-hero-primary,
.b1,
.rx-gst-btn {
  background: var(--blue);
  color: #fff;
  border: 1px solid var(--blue);
}
.btn-hero-primary:hover,
.b1:hover,
.rx-gst-btn:hover {
  color: #fff;
  background: #0c44b5;
}
.btn-hero-secondary,
.b2 {
  background: #fff;
  border: 1px solid #cbd5df;
  color: var(--ink);
}
.btn-hero-primary svg,
.btn-hero-secondary svg {
  width: 16px;
  height: 16px;
}
.h-free-note {
  font-size: 10px;
  color: var(--muted);
  margin-top: 13px;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.h-free-note svg {
  width: 12px;
  height: 16px;
  color: var(--green);
}
.hero-android {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 27px;
}
.hero-android > span {
  font-size: 10px;
  line-height: 1.8;
  color: var(--muted);
}
.gplay-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--ink);
  color: #fff;
  border-radius: 6px;
  padding: 8px 11px;
  flex: none;
}
.gplay-badge:hover {
  color: #fff;
  background: #2b3b42;
}
.gplay-icon {
  width: 22px;
  height: 24px;
}
.gplay-text-sm {
  font-size: 7px;
  line-height: 1.2;
}
.gplay-text-lg {
  font-size: 15px;
  line-height: 1.25;
  font-weight: 600;
}
.hero-graphic-caption {
  position: absolute;
  bottom: 15px;
  right: 30px;
  color: #718088;
  font-size: 9px;
}
.trust-band {
  background: white;
  border-block: 1px solid var(--line);
}
.trust-inner {
  padding-block: 23px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
.hero-certs {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  max-width: 550px;
}
.h-cert {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
}
.h-cert.iso {
  color: var(--green);
}
.cert-dot {
  display: inline-flex;
  align-items: center;
}
.cert-dot svg {
  color: var(--green) !important;
}
.h-cert svg {
  width: 14px;
  height: 14px;
}
.h-stats {
  display: flex;
  gap: 28px;
}
.h-stat {
  display: flex;
  gap: 8px;
  align-items: center;
}
.h-stat .icon-box {
  width: 30px;
  height: 30px;
  border-radius: 6px;
}
.h-stat .icon-box svg {
  width: 15px !important;
  height: 15px !important;
}
.h-stat-val {
  font-size: 20px;
  font-weight: 750;
  line-height: 1.25;
}
.h-stat-lbl {
  font-size: 9px;
  color: var(--muted);
}
.section-index {
  border-bottom: 1px solid var(--line);
  background: var(--wash);
}
.section-index > .container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  padding-block: 16px;
  overflow: auto;
  scrollbar-width: thin;
}
.section-index span {
  font-size: 9px;
  font-weight: 750;
  color: var(--muted);
  white-space: nowrap;
}
.section-index a {
  font-size: 11px;
  font-weight: 600;
  color: var(--ink);
  white-space: nowrap;
}
main > .stats-section {
  padding: 45px 0 0;
}
.stats-inner {
  width: min(100%, 1328px);
  margin: auto;
  padding: 0 32px;
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
  padding-bottom: 40px;
}
.stat-card {
  display: grid;
  grid-template-columns: 40px 1fr;
  column-gap: 13px;
  padding: 0 26px;
  border-right: 1px solid var(--line);
}
.stat-card:first-child {
  padding-left: 0;
}
.stat-card:last-child {
  border: 0;
}
.stat-card .icon-box {
  grid-row: 1/4;
  width: 38px;
  height: 38px;
  margin-top: 3px;
}
.stat-card .icon-box svg {
  width: 19px;
}
.stat-val {
  font-size: 29px;
  line-height: 1.25;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.stat-val .suffix {
  font-size: 19px;
}
.stat-lbl {
  font-size: 12px;
  font-weight: 650;
  margin-top: 4px;
}
.stat-sub {
  font-size: 9px;
  color: var(--muted);
  margin-top: 4px;
}
.stat-sub .up {
  color: var(--green);
  font-weight: 700;
}
.overview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items: center;
}
.overview-copy .sec-title {
  font-size: 36px;
}
.hero-sub {
  font-size: 14px;
  line-height: 1.9;
}
.hero-sub strong {
  color: var(--ink);
}
.h-trust {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 23px;
}
.h-trust-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  background: var(--wash);
  border: 1px solid var(--line);
  font-size: 10px;
  color: var(--muted);
  border-radius: 4px;
}
.h-trust-pill svg {
  width: 13px;
  height: 13px;
  color: var(--green);
}
.h-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px 15px;
  margin-top: 20px;
}
.h-meta li {
  font-size: 10px;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 6px;
}
.h-meta svg {
  width: 13px;
  height: 13px;
  color: var(--green);
}
.h-video-wrap {
  min-width: 0;
}
.h-video-badge {
  font-size: 12px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 12px;
}
.live-dot {
  width: 7px;
  height: 7px;
  background: var(--green);
  border-radius: 50%;
}
.h-video-frame {
  aspect-ratio: 16/9;
  background: #17242a;
  overflow: hidden;
  border-radius: 8px;
}
.h-video-frame iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
.h-video-cap {
  font-size: 10px;
  margin-top: 10px;
}
.video-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  border-top: 1px solid var(--line);
  padding-top: 17px;
  margin-top: 17px;
}
.h-float {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.hf-icon svg {
  width: 17px;
  height: 17px;
  color: var(--blue) !important;
}
.hf-text {
  font-size: 10px;
  font-weight: 650;
}
.hf-sub {
  font-size: 9px;
  color: var(--muted);
}
.overview-strips {
  margin-top: 55px;
}
.h-feat-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-block: 1px solid var(--line);
  padding: 23px 0;
  gap: 20px;
}
.h-feat-item {
  display: flex;
  gap: 9px;
  align-items: center;
}
.hfi-icon {
  width: 32px;
  height: 32px;
  background: var(--blue-light);
  display: grid;
  place-items: center;
  border-radius: 5px;
  flex: none;
}
.hfi-icon svg {
  width: 16px;
  height: 16px;
  color: var(--blue) !important;
}
.hfi-text {
  font-size: 10px;
  font-weight: 700;
}
.hfi-sub {
  font-size: 9px;
  color: var(--muted);
}
.h-biz {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin-top: 22px;
}
.h-biz-label {
  font-size: 10px;
  font-weight: 650;
  white-space: nowrap;
}
.h-biz-tags {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
}
.h-biz-tag {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--muted);
}
.h-biz-tag svg {
  width: 13px;
  height: 13px;
}
.features-section {
  background: #f5f8fb;
  border-block: 1px solid var(--line);
}
.feature-editorial,
.security-editorial,
.portal-editorial {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 75px;
  margin-bottom: 42px;
}
.feature-editorial > div {
  margin: 0 !important;
}
.feature-editorial .sec-desc,
.security-editorial .sec-desc,
.portal-editorial .sec-desc {
  margin: 0;
  font-size: 15px;
  line-height: 1.8;
}
.product-graphic {
  position: relative;
  min-width: 0;
  margin: 0;
}
.product-graphic img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  object-fit: contain;
  border-radius: 0;
  background: transparent;
}
.product-graphic figcaption {
  font-size: 9px;
  color: #73838a;
  margin-top: 8px;
  text-align: right;
}
.feat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.feat-card {
  position: relative;
  padding: 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.feat-card .icon-box {
  margin-bottom: 20px;
}
.card-index {
  position: absolute;
  right: 25px;
  top: 23px;
  color: #a8b6bd;
  font-size: 12px;
  font-weight: 600;
}
.feat-card-count {
  position: absolute;
  right: 25px;
  top: 80px;
  font-size: 9px;
  color: var(--muted);
}
.featured-badge {
  color: var(--green);
}
.feat-card-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  margin-bottom: 8px;
}
.feat-card-desc {
  font-size: 12px;
  color: var(--muted);
  min-height: 40px;
  line-height: 1.7;
}
.feat-list {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 19px;
  margin-top: 19px;
}
.feat-list li {
  display: flex;
  gap: 9px;
  font-size: 12px;
  line-height: 1.6;
}
.fli {
  display: flex;
  align-items: flex-start;
}
.fli svg {
  width: 13px;
  height: 18px;
  color: var(--green);
}
.fc-crm {
  border-top: 3px solid var(--green);
}
.fc-billing {
  border-top: 3px solid var(--blue);
}
.fc-inventory {
  border-top: 3px solid #dcae31;
}
.fc-reports {
  border-top: 3px solid #d64740;
}
.fc-banking {
  border-top: 3px solid var(--green);
}
.fc-staff {
  border-top: 3px solid var(--blue);
}
.rx-tour-grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 65px;
  align-items: start;
}
.rx-tour-steps {
  display: grid;
  gap: 0;
}
.rx-tstep {
  background: none;
  color: var(--ink);
  display: flex;
  gap: 20px;
  text-align: left;
  padding: 21px 20px;
  border-bottom: 1px solid var(--line);
  border-left: 3px solid transparent;
  border-radius: 0;
  min-width: 0;
}
.rx-tstep.active {
  background: var(--blue-light);
  border-left-color: var(--blue);
}
.rx-tnum {
  font-size: 12px;
  font-weight: 700;
  flex: none;
  color: #84949d;
  margin-top: 4px;
}
.rx-tstep.active .rx-tnum {
  color: var(--blue);
}
.rx-tbody {
  min-width: 0;
}
.rx-tbadge {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 600;
  color: var(--green);
  margin-bottom: 5px;
}
.rx-tbadge svg {
  width: 13px;
  height: 13px;
}
.rx-ttitle {
  font-size: 16px;
  font-weight: 650;
  display: block;
  line-height: 1.4;
}
.rx-tdesc {
  display: block;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.7;
  margin-top: 7px;
}
.rx-tour-visual {
  background: #eef5fb;
  padding: 32px 25px;
  display: flex;
  align-items: center;
  flex-direction: column;
  position: sticky;
  top: 120px;
  min-width: 0;
}
.tour-visual-heading {
  text-align: center;
  margin-bottom: 25px;
}
.tour-visual-heading .sec-label {
  font-size: 9px;
  margin-bottom: 8px;
}
.tour-visual-heading h3 {
  font-size: 22px;
}
.rx-phone {
  width: 300px;
  max-width: 100%;
  border: 8px solid #26333a;
  border-radius: 34px;
  background: #fff;
  box-shadow: 0 20px 35px #293c5017;
  position: relative;
  overflow: hidden;
}
.rx-phone-notch {
  position: absolute;
  z-index: 2;
  top: 9px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 18px;
  border-radius: 16px;
  background: #26333a;
}
.rx-screen {
  overflow: hidden;
  border-radius: 26px;
  background: #f8fafb;
}
.rx-statusbar {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 17px;
  font-size: 8px;
  font-weight: 700;
  background: white;
}
.rx-sb-right {
  display: flex;
  align-items: center;
  gap: 3px;
}
.rx-sig {
  display: flex;
  gap: 1px;
  align-items: end;
  height: 8px;
}
.rx-sig i {
  width: 2px;
  background: var(--ink);
  height: 3px;
}
.rx-sig i:nth-child(2) {
  height: 4px;
}
.rx-sig i:nth-child(3) {
  height: 6px;
}
.rx-sig i:nth-child(4) {
  height: 8px;
}
.rx-batt {
  width: 12px;
  height: 6px;
  border: 1px solid var(--ink);
  border-radius: 2px;
  background: var(--green);
}
.rx-scr-area {
  display: grid;
  min-height: 373px;
}
.rx-scr {
  grid-area: 1/1;
  min-width: 0;
  visibility: hidden;
  pointer-events: none;
}
.rx-scr.active {
  visibility: visible;
  pointer-events: auto;
}
.rx-scr-top {
  padding: 20px 17px;
  background: var(--blue);
  color: white;
  min-height: 80px;
}
.rx-scr-top.teal,
.rx-scr-top.emerald {
  background: var(--green);
}
.rx-scr-top.amber {
  background: #516c72;
}
.st-t {
  font-size: 15px;
  font-weight: 650;
  display: flex;
  gap: 7px;
  align-items: center;
}
.st-t svg {
  width: 16px;
  height: 16px;
}
.st-s {
  font-size: 10px;
  opacity: 0.8;
  margin-top: 5px;
}
.rx-scr-body {
  padding: 16px 14px;
}
.rx-card {
  background: white;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 14px;
  margin-bottom: 12px;
}
.rx-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid #edf1f4;
  font-size: 9px;
}
.rx-line b {
  font-size: 9px;
}
.rx-line:last-child {
  border: 0;
}
.rx-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 11px;
  font-weight: 650;
  padding-top: 13px;
}
.rx-chip,
.gv-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 7px;
  background: var(--blue-light);
  color: var(--blue);
  font-size: 8px;
  border-radius: 3px;
  font-weight: 600;
  line-height: 1.5;
}
.rx-chip.green,
.gv-chip.green {
  background: var(--green-light);
  color: var(--green);
}
.rx-chip.amber,
.gv-chip.amber {
  background: #fff4d1;
  color: #96720e;
}
.rx-chip.red {
  background: #ffefec;
  color: var(--red);
}
.rx-skel,
.gv-skel {
  height: 4px;
  background: #e9eef2;
  border-radius: 1px;
  width: 85%;
  margin-top: 6px;
}
.rx-skel.s2 {
  width: 65%;
}
.rx-skel.s3 {
  width: 45%;
  margin-bottom: 15px;
}
.rx-scr-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 600;
  min-height: 35px;
  color: white;
  background: var(--green);
  border-radius: 5px;
}
.rx-scr-btn svg {
  width: 13px;
  height: 13px;
}
.rx-mini2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-bottom: 15px;
}
.rx-mini {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 12px;
  text-align: center;
}
.rx-mini .v {
  font-weight: 700;
  font-size: 17px;
}
.rx-mini .l {
  font-size: 9px;
  color: var(--muted);
}
.rx-stock {
  display: grid;
  grid-template-columns: 1.3fr 1fr 22px;
  align-items: center;
  gap: 5px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
  font-size: 9px;
}
.rx-bar {
  height: 5px;
  background: #edf0f3;
  border-radius: 3px;
  display: block;
  overflow: hidden;
}
.rx-bar > span {
  height: 100%;
  background: var(--blue);
  display: block;
}
.rx-stock:nth-child(3) .rx-bar > span {
  background: var(--red);
}
.rx-qty {
  text-align: right;
  font-weight: 650;
}
.rx-amt {
  font-size: 29px;
  font-weight: 750;
  text-align: center;
  line-height: 1.3;
  margin-bottom: 12px;
}
.rx-amt small {
  display: block;
  font-size: 9px;
  font-weight: 400;
  color: var(--muted);
  margin-top: 6px;
}
.rx-qr,
.gv-qr {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 3px;
  padding: 10px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 5px;
  width: 92px;
  height: 92px;
  margin: 0 auto 14px;
  flex: none;
}
.rx-qr i,
.gv-qr i {
  display: block;
  background: var(--ink);
}
.rx-qr i.o,
.gv-qr i.o {
  background: transparent;
}
.rx-paymodes {
  display: flex;
  justify-content: center;
  gap: 5px;
  margin-bottom: 12px;
}
.rx-paymodes span {
  font-size: 8px;
  border: 1px solid var(--line);
  padding: 3px 7px;
  border-radius: 3px;
  background: #fff;
}
.rx-bubble {
  padding: 12px;
  font-size: 10px;
  background: #dff5e9;
  border-radius: 6px;
  margin-bottom: 12px;
  line-height: 1.7;
}
.rx-bubble:nth-child(2) {
  background: #e9eef3;
}
.tick {
  font-size: 8px;
  color: var(--green);
  text-align: right;
}
.rx-kpis3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-bottom: 12px;
}
.rx-kpi3 {
  padding: 10px 6px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 4px;
  text-align: center;
}
.rx-kpi3 .v {
  font-size: 13px;
  font-weight: 700;
}
.rx-kpi3 .l {
  font-size: 7px;
  color: var(--muted);
}
.rx-chart {
  height: 103px;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding: 0 9px;
}
.rx-chart span {
  flex: 1;
  background: var(--blue);
  border-radius: 3px 3px 0 0;
  opacity: 0.65;
}
.rx-chart span:nth-child(2n) {
  background: var(--green);
}
.rx-tabbar {
  display: flex;
  justify-content: space-around;
  padding: 12px 7px 17px;
  border-top: 1px solid var(--line);
  background: white;
}
.rx-tab {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 3px;
  font-size: 8px;
  color: var(--muted);
}
.rx-tab.active {
  color: var(--blue);
}
.rx-tab svg {
  width: 17px;
  height: 17px;
}
.rx-tour-cta {
  display: flex;
  gap: 13px;
  justify-content: center;
  margin-top: 38px;
}
.visual-note {
  font-size: 9px;
  text-align: center;
  margin-top: 18px;
  color: #788890;
}
.rx-gst {
  background: #ecf6f1;
  border-block: 1px solid #d6e7de;
}
.rx-gst-head {
  text-align: center;
}
.rx-gst-head p {
  font-size: 15px;
  max-width: 670px;
  margin-inline: auto;
}
.rx-gst-body {
  max-width: 1000px;
  margin-inline: auto;
}
.rx-gst-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  border-bottom: 1px solid #cbded4;
  margin-bottom: 30px;
}
.rx-gst-tab {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background: none;
  color: var(--muted);
  padding: 17px 10px;
  border-bottom: 3px solid transparent;
  font-size: 14px;
  font-weight: 600;
}
.rx-gst-tab.active {
  border-bottom-color: var(--green);
  color: var(--green);
}
.rx-gst-tab-ic svg {
  width: 19px;
  height: 19px;
}
.rx-gst-right {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 20px 50px;
  align-items: center;
}
.rx-gst-panel {
  display: grid;
  min-height: 295px;
  background: #fff;
  border: 1px solid #d7e6dc;
  border-radius: 8px;
  padding: 24px;
  min-width: 0;
}
.rx-gst-vis {
  grid-area: 1/1;
  visibility: hidden;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 9px;
  min-width: 0;
}
.rx-gst-vis.active {
  visibility: visible;
  pointer-events: auto;
}
.gv-json {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 700;
}
.gv-json svg {
  width: 20px;
  height: 20px;
}
.gv-export {
  font-size: 10px;
  color: var(--muted);
}
.gv-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 0 !important;
  border: 0;
  min-width: 0;
}
.gv-card[style*="display: flex"] {
  gap: 12px;
  align-items: center;
}
.gv-title {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  font-weight: 650;
  margin-bottom: 10px;
}
.gv-title svg {
  width: 17px;
  height: 17px;
  color: var(--green);
}
.gv-skel {
  margin-bottom: 10px;
  width: 50%;
}
.gv-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 10px;
}
.gv-tbl th {
  text-align: left;
  color: var(--muted);
  font-size: 9px;
  font-weight: 500;
  background: var(--wash);
}
.gv-tbl th,
.gv-tbl td {
  padding: 9px 6px;
  border-bottom: 1px solid var(--line);
}
.gv-tbl .r {
  text-align: right;
}
.gv-amt {
  font-size: 31px;
  font-weight: 700;
  margin: 9px 0;
}
.gv-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
}
.gv-flow {
  display: grid;
  gap: 8px;
}
.gv-flowrow {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  padding: 9px 12px;
  background: var(--green-light);
  border-radius: 4px;
}
.gv-flowrow.a2 {
  background: var(--blue-light);
}
.gv-flowrow.a3 {
  background: #fff0ed;
}
.gv-flowrow svg {
  width: 15px;
  height: 15px;
  color: var(--green) !important;
}
.rx-gst-desc-wrap {
  display: grid;
  align-items: start;
}
.rx-gst-desc {
  grid-area: 1/1;
  visibility: hidden;
  font-size: 21px;
  line-height: 1.65;
  color: var(--ink);
  padding-bottom: 30px;
}
.rx-gst-desc.active {
  visibility: visible;
}
.rx-gst-desc b {
  font-weight: 700;
}
.rx-gst-btn {
  justify-self: start;
  font-size: 12px;
}
.rx-gst-btn svg {
  width: 16px;
}
.rx-gst-right > .visual-note {
  grid-column: 1/-1;
  margin: 0;
}
.security-section {
  background: #fff;
}
.security-editorial .sec-title {
  font-size: 36px;
}
.security-editorial {
  margin-bottom: 35px;
}
.iso-highlight {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 26px 30px;
  background: #eff7f4;
  border-left: 3px solid var(--green);
  margin-bottom: 24px;
}
.iso-badge-box {
  width: 92px;
  flex: none;
  padding: 10px;
  border: 1px solid #99c9b5;
  display: flex;
  align-items: center;
  flex-direction: column;
  color: var(--green);
  border-radius: 6px;
}
.iso-label {
  font-size: 9px;
  text-transform: uppercase;
  font-weight: 700;
}
.iso-num {
  font-size: 29px;
  font-weight: 750;
  line-height: 1.3;
}
.iso-year {
  font-size: 11px;
  font-weight: 650;
}
.iso-content h4 {
  font-size: 17px;
  line-height: 1.5;
  margin-bottom: 9px;
}
.iso-content p {
  font-size: 12px;
  line-height: 1.8;
}
.iso-content a {
  color: var(--green);
}
.iso-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 20px;
  margin-top: 14px;
  color: var(--muted);
}
.iso-meta span {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 9px;
}
.iso-meta svg {
  width: 12px;
  height: 12px;
  color: var(--green);
}
.sec-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}
.sec-card {
  padding: 22px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  min-width: 0;
}
.sec-card .icon-box {
  margin-bottom: 20px;
}
.sec-card-title {
  font-size: 15px;
  font-weight: 650;
  line-height: 1.5;
  margin-bottom: 9px;
}
.sec-card-desc {
  font-size: 11px;
  line-height: 1.8;
  color: var(--muted);
}
.sec-tags {
  display: grid;
  gap: 6px;
  margin-top: 16px;
}
.sec-tag {
  font-size: 9px;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--green);
}
.sec-tag svg {
  width: 11px;
  height: 11px;
}
.saas-section {
  background: var(--wash);
  border-block: 1px solid var(--line);
}
.saas-banner {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  border-block: 1px solid var(--line);
  padding: 28px 0;
  margin-bottom: 32px;
}
.saas-banner h3 {
  font-size: 22px;
  line-height: 1.4;
  margin-bottom: 8px;
}
.saas-banner p {
  font-size: 13px;
  line-height: 1.8;
  max-width: 950px;
}
.saas-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  margin-top: 18px;
}
.saas-tags span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--green);
}
.saas-tags svg {
  width: 13px;
  height: 13px;
}
.module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.mod-card {
  padding: 24px 21px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.mod-card .icon-box {
  margin-bottom: 20px;
}
.mod-card-title {
  font-size: 17px;
  font-weight: 650;
  line-height: 1.45;
  min-height: 48px;
}
.mod-card-count {
  font-size: 9px;
  font-weight: 650;
  color: var(--blue);
  margin: 6px 0 18px;
}
.mod-card-list {
  display: grid;
  gap: 10px;
}
.mod-card-list li {
  display: flex;
  gap: 7px;
  font-size: 11px;
  line-height: 1.7;
}
.mod-card-list svg {
  width: 12px;
  height: 18px;
  color: var(--green);
}
.mod-crm-featured {
  border-top: 3px solid var(--green);
}
.showcase-section {
  background: white;
}
.portal-editorial > div {
  margin: 0 !important;
}
.portal-editorial .sec-title {
  font-size: 39px;
}
.showcase-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
}
.sc-card {
  border-top: 2px solid var(--blue);
  padding-top: 25px;
  min-width: 0;
}
.sc-card:nth-child(2) {
  border-top-color: var(--green);
}
.sc-card:nth-child(3) {
  border-top-color: var(--red);
}
.sc-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 9px;
  font-weight: 650;
  color: var(--blue);
  margin-bottom: 14px;
}
.sc-badge svg {
  width: 14px;
  height: 14px;
}
.sc-badge.portal {
  color: var(--green);
}
.sc-badge.shop {
  color: var(--red);
}
.sc-card h3 {
  font-size: 21px;
  margin-bottom: 12px;
  line-height: 1.4;
}
.sc-card p {
  font-size: 13px;
  line-height: 1.8;
  min-height: 93px;
}
.sc-feats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 20px 0 25px;
}
.sc-feat {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
}
.sc-feat svg {
  width: 15px;
  height: 15px;
  color: var(--green) !important;
}
.portal-flow-wrap {
  margin-top: 40px;
  padding-top: 30px;
  border-top: 1px solid var(--line);
}
.portal-flow-wrap h4 {
  font-size: 17px !important;
  font-weight: 650;
  line-height: 1.5;
  margin-bottom: 22px !important;
}
.portal-flow-wrap h4 svg {
  color: var(--blue) !important;
}
.portal-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
}
.pf-step {
  position: relative;
  padding: 18px 0;
}
.pf-step:not(:last-child):after {
  content: "";
  position: absolute;
  top: 31px;
  left: 45px;
  right: 0;
  height: 1px;
  background: var(--line);
}
.pf-step-icon svg {
  width: 23px !important;
  height: 23px !important;
  color: var(--green) !important;
}
.pf-step-label {
  font-size: 9px;
  color: var(--muted);
  margin-top: 10px;
}
.pf-step-desc {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.6;
  margin-top: 3px;
}
.sc-bottom {
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
  border-top: 1px solid var(--line);
  padding-top: 22px;
  margin-top: 12px;
}
.sc-bottom-pill {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--muted);
}
.sc-bottom-pill svg {
  width: 14px;
  height: 14px;
  color: var(--blue) !important;
}
.biz-section {
  background: #edf6f2;
  border-block: 1px solid #dae9e1;
}
.biz-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.biz-card {
  padding: 25px 22px;
  background: #fff;
  border: 1px solid #d6e5dd;
  border-radius: 8px;
}
.biz-card .icon-box {
  margin-bottom: 18px;
}
.biz-card h5 {
  font-size: 16px;
  line-height: 1.4;
  margin-bottom: 7px;
}
.biz-card p {
  font-size: 11px;
  line-height: 1.8;
}
.compare-section {
  background: white;
}
.compare-table-wrap {
  max-width: 100%;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  scrollbar-width: thin;
}
.compare-table {
  width: 100%;
  min-width: 800px;
  border-collapse: collapse;
  text-align: left;
  font-size: 12px;
}
.compare-table thead {
  background: var(--wash);
}
.compare-table th,
.compare-table td {
  padding: 15px 20px;
  border-bottom: 1px solid var(--line);
  line-height: 1.5;
}
.compare-table thead th {
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
}
.compare-table tbody th {
  font-weight: 500;
  width: 34%;
  background: #fff;
}
.compare-table tbody tr:last-child > * {
  border-bottom: 0;
}
.compare-table .ct-highlight {
  background: #edf7f1;
}
.compare-table thead .ct-highlight {
  background: var(--green);
  color: #fff;
}
.ct-yes {
  color: var(--green);
}
.ct-no {
  color: #8c5859;
}
.ct-partial {
  color: #877226;
}
.compare-table svg {
  width: 14px;
  height: 14px;
  margin-right: 4px;
}
.compare-note {
  font-size: 10px;
  margin-top: 14px;
  line-height: 1.8;
}
.pricing-section {
  background: var(--wash);
  border-block: 1px solid var(--line);
}
.pricing-flow {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 26px 0 38px;
}
.pf-item {
  display: flex;
  gap: 7px;
  align-items: center;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  padding: 9px 13px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 600;
}
.pf-item.active,
.pf-item[aria-pressed="true"] {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}
.pf-arrow {
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #9cabaf;
}
.pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(225px, 1fr));
  gap: 16px;
  align-items: stretch;
}
.p-card {
  position: relative;
  padding: 28px 21px 21px;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  min-width: 0;
  scroll-margin-top: 120px;
}
.p-card .icon-box {
  margin-top: 17px;
  margin-bottom: 16px;
}
.p-card:has(.popular-tag) {
  border: 2px solid var(--blue);
  padding: 27px 20px 20px;
}
.p-card.p-free {
  background: #eef8f3;
  border-color: #c5dfd1;
}
.p-card-ribbon {
  display: none;
}
.popular-tag,
.free-tag {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  text-align: center;
  font-size: 9px;
  line-height: 26px;
  background: var(--blue);
  color: white;
  border-radius: 6px 6px 0 0;
  font-weight: 650;
}
.free-tag {
  background: var(--green);
}
.p-card-name {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 9px;
}
.p-card-desc {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.7;
  min-height: 40px;
}
.p-card-price {
  display: flex;
  align-items: baseline;
  gap: 3px;
  margin: 24px 0 4px;
  white-space: nowrap;
}
.p-card-currency {
  font-size: 18px;
  font-weight: 600;
}
.p-card-value {
  font-size: 35px;
  font-weight: 750;
  line-height: 1.1;
}
.p-card-period {
  font-size: 10px;
  color: var(--muted);
  min-height: 38px;
  line-height: 1.8;
}
.savings-badge {
  display: inline-block;
  background: var(--green-light);
  padding: 2px 5px;
  border-radius: 3px;
  color: var(--green);
  font-size: 9px;
  margin-top: 5px;
}
.custom-range,
.free-zero-badge {
  font-size: 9px;
  color: var(--green);
  margin-top: 12px;
}
.custom-range svg,
.free-zero-badge svg {
  width: 12px;
  height: 12px;
}
.p-card-divider {
  height: 1px;
  background: var(--line);
  margin: 18px 0;
}
.p-card-feats {
  display: grid;
  gap: 11px;
  margin-bottom: 20px;
}
.p-card-feats li {
  display: flex;
  gap: 7px;
  font-size: 10px;
  line-height: 1.7;
}
.p-card-feats .fi {
  display: flex;
  flex: none;
}
.fi svg {
  width: 12px;
  height: 17px;
  color: var(--green);
}
.pf-more {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  background: none;
  color: var(--blue);
  font-size: 10px;
  font-weight: 600;
  padding: 0 0 18px;
  text-align: left;
}
.pf-more svg {
  width: 12px;
  height: 12px;
}
.p-card-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--blue-light);
  color: var(--blue);
  padding: 12px 8px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 650;
  margin-top: auto;
  line-height: 1.5;
}
.p-card:has(.popular-tag) .p-card-cta {
  background: var(--blue);
  color: #fff;
}
.p-free .p-card-cta {
  background: var(--green);
  color: #fff;
}
.p-card-cta:hover {
  background: var(--blue);
  color: #fff;
}
.card-selected {
  outline: 3px solid #1457df;
  outline-offset: 5px;
}
.refund-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 18px 20px;
  border-left: 3px solid var(--yellow);
  background: #fffbed;
  margin-top: 24px;
  font-size: 11px;
  line-height: 1.8;
  color: #756624;
}
.refund-note svg {
  width: 16px;
  height: 21px;
  flex: none;
}
.refund-note a {
  color: #6b5814 !important;
}
.preview-pricing-note {
  font-size: 12px;
  text-align: center;
  background: #fff7d9;
  color: #796726;
  padding: 12px;
  border: 1px solid #eadc9a;
  margin-bottom: 20px;
  border-radius: 4px;
}
.plans-empty {
  font-size: 13px;
  padding: 14px 0;
  color: var(--muted);
}
.testimonials-section {
  background: white;
}
.testi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.testi-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 27px;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.testi-stars {
  display: flex;
  gap: 3px;
  color: #aa7b06;
  margin-bottom: 20px;
}
.testi-stars svg {
  width: 13px;
  height: 13px;
}
.testi-quote {
  font-size: 13px;
  line-height: 1.95;
  margin-bottom: 24px;
  color: #405158;
}
.testi-author {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
}
.testi-avatar {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  background: var(--blue-light);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  color: var(--blue);
  flex: none;
}
.a2,
.a5 {
  background: var(--green-light);
  color: var(--green);
}
.a3,
.a6 {
  background: #fff3e9;
  color: #a86d36;
}
.testi-name {
  font-size: 12px;
  font-weight: 700;
}
.testi-role {
  font-size: 10px;
  color: var(--muted);
}
.testi-biz-tag {
  font-size: 9px;
  color: var(--muted);
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.testi-biz-tag svg {
  width: 11px;
  height: 11px;
}
.review-cta {
  display: grid;
  grid-template-columns: 1fr 190px;
  gap: 45px;
  padding: 35px 0;
  border-block: 1px solid var(--line);
  margin-top: 45px;
}
.review-cta-left {
  position: relative;
  padding-left: 60px;
}
.review-cta-google-g {
  position: absolute;
  top: 0;
  left: 0;
  width: 38px;
  height: 38px;
}
.review-cta-title {
  font-size: 23px;
  line-height: 1.45;
  margin-bottom: 9px;
}
.review-cta-subtitle {
  font-size: 12px;
  line-height: 1.8;
}
.review-cta-subtitle .en {
  display: block;
}
.review-cta-stars {
  display: flex;
  gap: 4px;
  margin: 12px 0 14px;
}
.rstar {
  width: 26px;
  height: 26px;
  color: #be8b0d;
  cursor: pointer;
}
.rstar.hover-active {
  color: #e5b332;
}
.review-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  font-weight: 650;
}
.review-cta-btn svg {
  width: 15px;
  height: 15px;
}
.review-cta-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.review-cta-qr {
  padding: 7px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.review-cta-qr img {
  width: 135px;
  height: 135px;
}
.review-cta-qr-label {
  font-size: 9px;
  color: var(--muted);
  text-align: center;
}
.review-cta-qr-label svg {
  width: 12px;
  height: 12px;
  margin-right: 3px;
}
.faq-section {
  background: var(--wash);
  border-block: 1px solid var(--line);
}
.faq-layout {
  display: grid;
  grid-template-columns: 1fr 1.65fr;
  gap: 80px;
  align-items: start;
}
.faq-layout .sec-title {
  font-size: 34px;
  margin-bottom: 25px;
}
.faq-layout .sec-label {
  font-size: 10px;
}
.faq-list {
  min-width: 0;
}
.faq-item {
  border-bottom: 1px solid var(--line);
}
.faq-item:first-child {
  border-top: 1px solid var(--line);
}
.faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  list-style: none;
  cursor: pointer;
  padding: 19px 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}
.faq-item summary::-webkit-details-marker {
  display: none;
}
.faq-item summary svg {
  width: 17px;
  height: 17px;
  color: var(--blue);
}
.faq-item[open] summary svg {
  transform: rotate(45deg);
}
.faq-item p {
  font-size: 13px;
  line-height: 1.9;
  padding: 0 25px 21px 0;
}
.contact-section {
  background: #fff;
}
.contact-section > .container > .row {
  gap: 65px;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.contact-section > .container > .row > .col-lg-6 {
  width: auto;
  padding: 0;
}
.contact-card {
  padding: 0;
  border: 0;
  min-width: 0;
}
.contact-badge {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  font-size: 11px;
  font-weight: 650;
  color: var(--green);
  padding: 7px 10px;
  background: var(--green-light);
  border-radius: 4px;
}
.contact-meta {
  display: flex;
  gap: 20px;
  margin-top: 19px;
  flex-wrap: wrap;
}
.contact-meta li {
  display: flex;
  gap: 5px;
  align-items: center;
  font-size: 10px;
  color: var(--muted);
}
.contact-meta svg {
  width: 12px;
  height: 12px;
  color: var(--green);
}
#contactForm {
  margin-top: 24px;
}
.form-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 7px;
}
.form-control {
  width: 100%;
  border: 1px solid #d4dfe3;
  border-radius: 5px;
  background: #fff;
  color: var(--ink);
  padding: 12px 12px 12px 39px;
  font-size: 12px;
  line-height: 1.5;
  min-height: 45px;
  max-width: 100%;
}
.form-control::placeholder {
  color: #8b99a0;
}
.form-control:focus {
  border-color: var(--blue);
  outline: 2px solid #e2ecff;
  outline-offset: 1px;
}
.rx-field {
  position: relative;
}
.rx-field-ic {
  position: absolute;
  left: 13px;
  top: 12px;
  color: #7e919a;
  display: flex;
}
.rx-field-ic svg {
  width: 15px;
  height: 18px;
}
textarea.form-control {
  resize: vertical;
  min-height: 126px;
}
.form-check {
  display: flex;
  align-items: flex-start;
  gap: 9px;
}
.form-check-input {
  width: 15px;
  height: 15px;
  margin: 3px 0 0;
  accent-color: var(--blue);
  flex: none;
}
.form-check-label {
  font-size: 10px;
  color: var(--muted);
  line-height: 1.8;
}
.btn-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  padding: 14px 20px;
  background: var(--blue);
  color: #fff;
  font-size: 13px;
  font-weight: 650;
  border-radius: 6px;
}
.btn-submit svg {
  width: 16px;
  height: 16px;
}
.btn-submit:hover {
  background: #0f43ae;
}
.form-status {
  padding: 12px;
  margin-top: 12px;
  border-radius: 4px;
  background: var(--blue-light);
  font-size: 12px;
  color: var(--blue);
}
.form-status[data-state="error"] {
  background: #ffefed;
  color: #a83731;
}
.form-status[data-state="success"] {
  background: var(--green-light);
  color: var(--green);
}
#captchaError {
  font-size: 11px !important;
  color: #b83932;
}
.support-header {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 24px;
}
.support-avatar {
  width: 64px;
  height: 64px;
  background: var(--green-light);
  color: var(--green);
  display: grid;
  place-items: center;
  position: relative;
  border-radius: 8px;
  flex: none;
}
.support-avatar > svg {
  width: 32px;
  height: 32px;
}
.support-dot {
  position: absolute;
  right: 5px;
  bottom: 4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
  border: 2px solid #fff;
}
.support-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 7px;
}
.support-sub {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.7;
}
.support-tags {
  display: flex;
  gap: 14px;
  margin-top: 12px;
}
.support-tags span {
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--green);
}
.support-tags svg {
  width: 12px;
  height: 12px;
}
.contact-card > h4 {
  font-size: 16px !important;
  margin-bottom: 15px !important;
}
.ci-list {
  display: grid;
  gap: 16px;
  margin: 15px 0 22px;
}
.ci-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: var(--ink);
}
.ci-ic {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 5px;
  display: grid;
  place-items: center;
  color: var(--blue);
  flex: none;
}
.ci-ic svg {
  width: 16px;
  height: 16px;
}
.ci-txt {
  min-width: 0;
}
.ci-lbl {
  display: block;
  font-size: 10px;
  color: var(--muted);
  margin-bottom: 3px;
}
.ci-val {
  display: block;
  font-size: 12px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.contact-map {
  aspect-ratio: 16/8;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  background: var(--wash);
}
.contact-map iframe {
  width: 100%;
  height: 100%;
  display: block;
}
.footer {
  padding: 58px 0 25px;
  background: #f2f5f6;
  border-top: 1px solid var(--line);
  color: var(--ink);
}
.footer .row {
  margin-inline: -20px;
}
.footer .row > * {
  padding-inline: 20px;
}
.footer-logo {
  margin-bottom: 22px;
}
.footer h5 {
  font-size: 13px;
  margin-bottom: 20px;
}
.footer .col-lg-4 > h5 {
  font-size: 17px;
  margin-bottom: 12px;
}
.footer p {
  color: var(--muted) !important;
  font-size: 11px !important;
  line-height: 1.9 !important;
}
.footer p strong {
  color: var(--ink) !important;
}
.footer-links {
  display: grid;
  gap: 14px;
}
.footer-link {
  color: var(--muted);
  font-size: 11px;
  display: flex;
  gap: 7px;
  align-items: center;
}
.footer-link svg {
  width: 13px;
  height: 13px;
  opacity: 0.65;
}
.footer-link:hover {
  color: var(--blue);
}
.rx-foot-news {
  margin-top: 23px;
}
.rx-foot-newsh {
  font-size: 11px;
  font-weight: 650;
  margin-bottom: 9px;
}
.rx-news-form {
  display: flex;
  border: 1px solid #d0dce0;
  border-radius: 5px;
  overflow: hidden;
  background: white;
  max-width: 320px;
}
.rx-news-form input {
  border: 0;
  width: 100%;
  min-width: 0;
  padding: 11px;
  font-size: 11px;
  outline: 0;
}
.rx-news-btn {
  width: 42px;
  flex: none;
  background: var(--blue);
  color: white;
}
.rx-news-btn svg {
  width: 16px;
  height: 16px;
}
.rx-footer-social {
  display: flex;
  gap: 14px;
  margin-top: 19px;
}
.rx-footer-social a {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  color: var(--muted);
}
.rx-footer-social svg {
  width: 15px;
  height: 15px;
}
.footer hr {
  border: 0;
  border-top: 1px solid #d8e2e6;
  margin: 34px 0 22px;
}
.footer-legal {
  display: flex;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
}
.footer-pill {
  font-size: 9px;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
}
.footer-pill svg {
  width: 12px;
  height: 12px;
  color: var(--green) !important;
}
.footer > .container > .text-center {
  margin-top: 15px !important;
}
.footer > .container > .text-center p {
  font-size: 10px !important;
}
.float-btns {
  position: fixed;
  right: 20px;
  bottom: 22px;
  z-index: 70;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.btn-whatsapp,
.btn-back-top {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  box-shadow: 0 5px 15px #12362915;
}
.btn-whatsapp {
  color: #fff;
  background: #087d57;
}
.btn-whatsapp:hover {
  color: #fff;
  background: #076343;
}
.btn-whatsapp > svg {
  width: 26px;
  height: 26px;
}
.wa-tooltip {
  position: absolute;
  right: 52px;
  white-space: nowrap;
  background: var(--ink);
  color: #fff;
  font-size: 11px;
  padding: 6px 10px;
  border-radius: 4px;
  visibility: hidden;
}
.btn-whatsapp:hover .wa-tooltip,
.btn-whatsapp:focus-visible .wa-tooltip {
  visibility: visible;
}
.btn-back-top {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
  visibility: hidden;
}
.btn-back-top.visible {
  visibility: visible;
}
.btn-back-top svg {
  width: 18px;
  height: 18px;
}
.mqb-modal {
  position: fixed;
  inset: 0;
  z-index: 250;
  display: grid;
  place-items: center;
  padding: 22px;
}
.mqb-modal-overlay {
  position: absolute;
  inset: 0;
  background: #17242a77;
}
.mqb-modal-dialog {
  position: relative;
  max-height: calc(100dvh - 44px);
  overflow: auto;
  max-width: 475px;
  width: 100%;
  padding: 32px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 80px #17242a33;
}
.mqb-modal-x {
  position: absolute;
  right: 12px;
  top: 12px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  background: var(--wash);
  color: var(--ink);
  border-radius: 5px;
}
.mqb-modal-x svg {
  width: 17px;
  height: 17px;
}
.mqb-modal-icon {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  background: #fff4db;
  color: #96721b;
  border-radius: 8px;
  margin-bottom: 20px;
}
.mqb-modal-icon > svg {
  width: 27px;
  height: 27px;
}
.mqb-modal-title {
  font-size: 23px;
  line-height: 1.4;
  margin-bottom: 7px;
}
.mqb-modal-subtitle {
  font-size: 13px;
  color: var(--green);
  font-weight: 600;
  margin-bottom: 17px;
}
.mqb-modal-body {
  font-size: 13px;
  line-height: 1.9;
}
.mqb-modal-info {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 12px;
  background: var(--wash);
  font-size: 11px;
  color: var(--muted);
  border-radius: 5px;
  margin-top: 15px;
}
.mqb-modal-info svg {
  width: 16px;
  height: 20px;
}
.mqb-modal-actions {
  display: flex;
  gap: 10px;
  margin-top: 22px;
}
.mqb-btn-ghost,
.mqb-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 5px;
  padding: 10px 17px;
  font-size: 12px;
  font-weight: 600;
}
.mqb-btn-ghost {
  background: var(--wash);
  border: 1px solid var(--line);
  color: var(--ink);
}
.mqb-btn-primary {
  background: var(--blue);
  color: #fff;
}
.mqb-modal-footer {
  padding-top: 20px;
  margin-top: 22px;
  border-top: 1px solid var(--line);
}
.mqb-modal-help {
  font-size: 11px;
  color: var(--green);
  display: flex;
  gap: 7px;
  align-items: center;
}
@media (min-width: 1600px) {
  .hero-art {
    width: 1320px;
    right: calc((100% - 1510px) / 2);
  }
  .hero-copy {
    width: 490px;
  }
}
@media (max-width: 1199px) {
  .navbar > .container {
    min-height: 77px;
    justify-content: space-between;
  }
  .navbar-toggler {
    display: grid;
    place-items: center;
  }
  .navbar-collapse {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border-bottom: 1px solid var(--line);
    padding: 22px 32px;
    max-height: calc(100dvh - 77px);
    overflow-y: auto;
  }
  .navbar-collapse.show {
    display: flex;
    align-items: stretch;
    flex-direction: column;
    gap: 24px;
  }
  .navbar-nav {
    align-items: stretch;
    gap: 0;
    flex-direction: column;
  }
  .nav-link {
    display: flex;
    padding: 11px 0;
  }
  .navbar-actions {
    justify-content: flex-start;
    gap: 25px;
  }
  .login-dropdown-menu {
    left: 0;
    right: auto;
    position: static;
    margin-top: 12px;
    box-shadow: none;
  }
  .navbar-actions:has(.login-dropdown-menu:not([hidden])) {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .hero-copy {
    width: 425px;
  }
  .hero-title {
    font-size: 59px;
  }
  .hero-offer {
    font-size: 27px;
  }
  .hero-art {
    width: 1040px;
    right: -125px;
  }
  .hero-inner,
  main > .hero {
    min-height: 665px;
  }
  .h-cta {
    gap: 8px;
  }
  .btn-hero-primary,
  .btn-hero-secondary {
    font-size: 11px;
    padding: 12px;
  }
  .hero-certs {
    gap: 12px;
    max-width: 410px;
  }
  .h-stats {
    gap: 18px;
  }
  .section-index > .container {
    gap: 22px;
    justify-content: flex-start;
  }
  .stat-card {
    padding: 0 14px;
    grid-template-columns: 1fr;
  }
  .stat-card .icon-box {
    display: none;
  }
  .stat-val {
    font-size: 27px;
  }
  .overview-grid {
    gap: 35px;
  }
  .h-feat-strip {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 22px;
  }
  .feature-editorial,
  .security-editorial,
  .portal-editorial {
    gap: 40px;
  }
  .sec-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .module-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .rx-tour-grid {
    gap: 30px;
  }
  .sc-feats {
    grid-template-columns: 1fr;
  }
  .sc-card p {
    min-height: 115px;
  }
  .showcase-grid {
    gap: 24px;
  }
  .pricing-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .faq-layout {
    gap: 40px;
  }
  .contact-section > .container > .row {
    gap: 40px;
  }
  .testi-card {
    padding: 22px;
  }
  .footer .col-lg-4 {
    width: 100%;
    margin-bottom: 10px;
    max-width: 560px;
  }
  .footer .col-lg-2 {
    width: 25%;
  }
  .footer .row {
    row-gap: 35px;
  }
  .review-cta-title {
    font-size: 21px;
  }
}
@media (max-width: 991px) {
  .container {
    padding-inline: 26px;
  }
  main > section {
    padding-block: 72px;
  }
  .sec-title,
  .rx-gst-head h2 {
    font-size: 33px;
  }
  .hero-inner {
    align-items: flex-start;
    min-height: 850px;
    justify-content: center;
  }
  .hero-copy {
    width: 100%;
    text-align: center;
    padding-top: 40px;
    padding-bottom: 390px;
  }
  .hero-title {
    font-size: 57px;
  }
  .hero-offer {
    max-width: 700px;
    margin: 0 auto 15px;
    font-size: 25px;
  }
  .hero-intro {
    font-size: 15px;
    max-width: none;
    margin-bottom: 21px;
  }
  .hero-intro br {
    display: none;
  }
  .h-rating {
    align-items: center;
    margin-bottom: 18px;
  }
  .h-cta {
    justify-content: center;
  }
  .h-free-note {
    justify-content: center;
    font-size: 10px;
  }
  .hero-android {
    justify-content: center;
    margin-top: 20px;
    text-align: left;
  }
  .hero-art {
    width: 900px;
    right: 50%;
    transform: translateX(41%);
    max-width: none;
    bottom: -1px;
  }
  .hero-graphic-caption {
    bottom: 9px;
    right: 20px;
  }
  .trust-inner {
    flex-direction: column;
    gap: 17px;
  }
  .hero-certs {
    max-width: none;
    justify-content: center;
  }
  .h-stats {
    gap: 40px;
  }
  .stats-grid {
    padding-bottom: 33px;
  }
  .stat-card {
    text-align: center;
  }
  .stat-card:first-child {
    padding-left: 14px;
  }
  .stat-val {
    font-size: 26px;
  }
  .overview-grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }
  .overview-copy .sec-title {
    font-size: 28px;
  }
  .hero-sub {
    font-size: 12px;
  }
  .h-trust {
    gap: 5px;
    margin-top: 15px;
  }
  .h-trust-pill {
    font-size: 9px;
  }
  .h-meta {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .video-benefits {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .hf-text {
    font-size: 11px;
  }
  .hf-sub {
    font-size: 10px;
  }
  .h-float {
    align-items: center;
  }
  .h-biz {
    align-items: flex-start;
  }
  .h-biz-tags {
    gap: 12px;
  }
  .feature-editorial,
  .security-editorial,
  .portal-editorial {
    gap: 32px;
  }
  .feat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .feat-card {
    padding: 24px;
  }
  .rx-tour-grid {
    grid-template-columns: 1fr 1fr;
    gap: 23px;
  }
  .rx-tstep {
    padding: 15px 10px;
    gap: 10px;
  }
  .rx-ttitle {
    font-size: 14px;
  }
  .rx-tdesc {
    font-size: 11px;
  }
  .rx-tour-visual {
    padding: 24px 15px;
  }
  .tour-visual-heading h3 {
    font-size: 18px;
  }
  .tour-visual-heading .sec-label {
    font-size: 8px;
  }
  .rx-phone {
    width: 280px;
  }
  .rx-gst-right {
    gap: 25px;
  }
  .rx-gst-desc {
    font-size: 18px;
  }
  .rx-gst-panel {
    padding: 18px;
  }
  .security-editorial .sec-title {
    font-size: 31px;
  }
  .sec-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sec-card {
    padding: 20px 15px;
  }
  .module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mod-card-title {
    min-height: 0;
  }
  .mod-card-list li {
    font-size: 12px;
  }
  .mod-card {
    padding: 25px;
  }
  .portal-editorial .sec-title {
    font-size: 33px;
  }
  .sc-card h3 {
    font-size: 18px;
  }
  .sc-card p {
    font-size: 12px;
    min-height: 132px;
  }
  .sc-feat {
    font-size: 10px;
  }
  .sc-card .text-link {
    font-size: 11px;
  }
  .portal-flow {
    gap: 15px;
  }
  .pf-step-desc {
    font-size: 10px;
  }
  .sc-bottom {
    gap: 15px;
  }
  .biz-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .biz-card {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 5px 16px;
  }
  .biz-card .icon-box {
    grid-row: 1/3;
    margin: 0;
  }
  .biz-card h5 {
    margin: 0;
    font-size: 15px;
  }
  .biz-card p {
    font-size: 11px;
  }
  .compare-table th,
  .compare-table td {
    padding: 13px 15px;
  }
  .pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .testi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .faq-layout {
    grid-template-columns: 1fr 1.6fr;
    gap: 30px;
  }
  .faq-layout .sec-title {
    font-size: 28px;
  }
  .faq-item summary {
    font-size: 13px;
  }
  .contact-section > .container > .row {
    grid-template-columns: 1fr;
    gap: 45px;
  }
  .contact-section > .container > .row > .col-lg-6 {
    max-width: 700px;
    width: 100%;
    margin: auto;
  }
  .support-header {
    margin: 0;
  }
  .contact-map {
    aspect-ratio: 16/7;
  }
  .contact-card[style*="display: flex"] {
    gap: 14px !important;
  }
  .support-title {
    font-size: 23px;
  }
  .footer {
    padding-top: 45px;
  }
}
@media (max-width: 680px) {
  html {
    scroll-padding-top: 90px;
  }
  .container {
    padding-inline: 20px;
  }
  .navbar > .container {
    min-height: 73px;
  }
  .navbar-brand .logo-frame {
    transform: scale(0.9);
    transform-origin: left center;
    width: 140px;
  }
  .navbar-toggler {
    width: 40px;
    height: 40px;
  }
  .navbar-collapse {
    padding: 18px 20px;
  }
  .navbar-actions {
    gap: 15px;
    flex-wrap: wrap;
  }
  .btn-partner-nav {
    font-size: 11px;
  }
  .btn-login {
    font-size: 12px;
  }
  .btn-trial-nav {
    font-size: 11px;
    padding: 11px 13px;
  }
  .login-dropdown-menu {
    width: min(335px, calc(100vw - 40px));
  }
  .login-dropdown {
    position: static;
  }
  .login-dropdown-menu:not([hidden]) {
    position: absolute;
    top: 100%;
    left: 20px;
    margin: 0;
    box-shadow: 0 14px 32px #17242a22;
  }
  .navbar-collapse:has(.login-dropdown-menu:not([hidden])) {
    overflow: visible;
  }
  .hero-inner {
    min-height: 0;
  }
  .hero-copy {
    padding-top: 32px;
    padding-bottom: 278px;
  }
  .hero-title {
    font-size: 46px;
    margin-bottom: 13px;
  }
  .hero-offer {
    font-size: 23px;
    line-height: 1.35;
    max-width: 460px;
  }
  .hero-intro {
    font-size: 13px;
    max-width: 330px;
    line-height: 1.7;
    margin: 0 auto 20px;
  }
  .h-rating-text {
    font-size: 9px;
  }
  .h-rating {
    gap: 6px;
    margin-bottom: 17px;
  }
  .h-rating-stars svg {
    width: 10px !important;
    height: 10px !important;
  }
  .h-cta {
    gap: 8px;
  }
  .btn-hero-primary,
  .btn-hero-secondary {
    padding: 12px 13px;
    font-size: 10px;
    min-height: 44px;
  }
  .btn-hero-primary svg,
  .btn-hero-secondary svg {
    width: 13px;
    height: 13px;
  }
  .h-free-note {
    font-size: 8px;
    line-height: 1.7;
    max-width: 330px;
    margin: 11px auto 0;
  }
  .h-free-note svg {
    width: 10px;
    height: 13px;
  }
  .hero-android {
    margin-top: 19px;
    gap: 13px;
  }
  .hero-android > span {
    font-size: 8px;
  }
  .gplay-badge {
    padding: 6px 10px;
  }
  .gplay-text-lg {
    font-size: 13px;
  }
  .gplay-text-sm {
    font-size: 6px;
  }
  .gplay-icon {
    width: 19px;
    height: 23px;
  }
  .hero-art {
    width: 610px;
    bottom: -1px;
    transform: translateX(38%);
  }
  .hero-graphic-caption {
    font-size: 7px;
    right: 13px;
    bottom: 7px;
  }
  .trust-inner {
    padding-block: 18px;
    gap: 20px;
  }
  .hero-certs {
    gap: 8px 16px;
  }
  .h-cert {
    font-size: 8px;
  }
  .h-cert.iso {
    width: 100%;
    justify-content: center;
  }
  .h-stats {
    gap: 22px;
    justify-content: center;
    width: 100%;
  }
  .h-stat {
    gap: 6px;
  }
  .h-stat .icon-box {
    display: none;
  }
  .h-stat-val {
    font-size: 20px;
  }
  .h-stat-lbl {
    font-size: 8px;
  }
  .section-index > .container {
    gap: 22px;
    padding-block: 13px;
  }
  .section-index span {
    display: none;
  }
  .section-index a {
    font-size: 10px;
  }
  main > section {
    padding-block: 58px;
  }
  .sec-title,
  .rx-gst-head h2 {
    font-size: 29px;
    line-height: 1.3;
    margin-bottom: 14px;
  }
  .sec-label {
    font-size: 9px;
    margin-bottom: 12px;
  }
  .sec-desc,
  .rx-gst-head p {
    font-size: 13px;
    line-height: 1.85;
  }
  section > .container > .text-center,
  section > .container > .rx-gst-head {
    margin-bottom: 30px !important;
  }
  .stats-inner {
    padding-inline: 20px;
  }
  main > .stats-section {
    padding-top: 30px;
  }
  .stats-grid {
    grid-template-columns: 1fr 1fr;
    gap: 22px 0;
    padding-bottom: 28px;
  }
  .stat-card {
    padding: 0 14px !important;
  }
  .stat-card:nth-child(2) {
    border-right: 0;
  }
  .stat-val {
    font-size: 25px;
  }
  .stat-val .suffix {
    font-size: 17px;
  }
  .stat-lbl {
    font-size: 10px;
  }
  .stat-sub {
    font-size: 8px;
  }
  .overview-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .overview-copy .sec-title {
    font-size: 29px;
  }
  .hero-sub {
    font-size: 13px;
  }
  .h-trust {
    margin-top: 19px;
    gap: 7px;
  }
  .h-trust-pill {
    font-size: 9px;
    padding: 5px 7px;
  }
  .h-meta {
    grid-template-columns: 1fr 1fr;
    gap: 9px 12px;
  }
  .h-meta li {
    font-size: 9px;
  }
  .video-benefits {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .h-float {
    align-items: flex-start;
    gap: 5px;
  }
  .hf-text {
    font-size: 9px;
  }
  .hf-sub {
    font-size: 8px;
  }
  .hf-icon svg {
    width: 13px;
    height: 13px;
  }
  .h-video-badge {
    font-size: 11px;
  }
  .h-video-cap {
    font-size: 9px;
  }
  .overview-strips {
    margin-top: 30px;
  }
  .h-feat-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 16px;
    padding-block: 20px;
  }
  .h-biz {
    flex-direction: column;
    gap: 10px;
    align-items: center;
  }
  .h-biz-tags {
    justify-content: center;
    gap: 8px 13px;
  }
  .h-biz-tag {
    font-size: 9px;
  }
  .feature-editorial,
  .security-editorial,
  .portal-editorial {
    grid-template-columns: 1fr;
    gap: 25px;
    margin-bottom: 26px;
  }
  .feature-editorial .sec-desc,
  .security-editorial .sec-desc,
  .portal-editorial .sec-desc {
    font-size: 13px;
  }
  .feature-editorial > div,
  .security-editorial > div,
  .portal-editorial > div {
    text-align: left;
  }
  .product-graphic img {
    border-radius: 0;
  }
  .product-graphic figcaption {
    font-size: 7px;
  }
  .feat-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .feat-card {
    padding: 24px;
  }
  .feat-card .icon-box {
    margin-bottom: 16px;
  }
  .feat-card-title {
    font-size: 18px;
  }
  .feat-card-desc {
    min-height: 0;
    font-size: 12px;
    padding-right: 30px;
  }
  .feat-card-count {
    top: 25px;
    font-size: 9px;
  }
  .card-index {
    display: none;
  }
  .feat-list {
    gap: 10px;
    margin-top: 18px;
    padding-top: 18px;
  }
  .feat-list li {
    font-size: 12px;
  }
  .rx-tour-grid {
    display: flex;
    flex-direction: column;
    gap: 25px;
  }
  .rx-tour-steps {
    width: 100%;
  }
  .rx-tstep {
    padding: 18px 14px;
    gap: 15px;
  }
  .rx-ttitle {
    font-size: 15px;
  }
  .rx-tdesc {
    font-size: 11px;
  }
  .rx-tour-visual {
    position: relative;
    top: auto;
    width: 100%;
    padding: 28px 20px;
  }
  .tour-visual-heading h3 {
    font-size: 21px;
  }
  .tour-visual-heading .sec-label {
    font-size: 8px;
  }
  .rx-phone {
    width: 290px;
  }
  .rx-tour-cta {
    gap: 10px;
    margin-top: 25px;
  }
  .b1,
  .b2 {
    font-size: 11px;
    padding: 11px 15px;
    min-height: 44px;
  }
  .b1 svg,
  .b2 svg {
    width: 14px;
    height: 14px;
  }
  .rx-gst-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    border: 0;
    margin-bottom: 24px;
  }
  .rx-gst-tab {
    font-size: 12px;
    background: #fff;
    border: 1px solid #ccdfd3;
    border-radius: 5px;
    padding: 12px 8px;
    gap: 8px;
    min-height: 47px;
  }
  .rx-gst-tab.active {
    background: var(--green);
    color: white;
    border-color: var(--green);
  }
  .rx-gst-tab-ic svg {
    width: 16px;
    height: 16px;
  }
  .rx-gst-right {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .rx-gst-panel {
    min-height: 290px;
    padding: 20px;
  }
  .rx-gst-desc {
    font-size: 18px;
    line-height: 1.7;
    padding-bottom: 21px;
  }
  .rx-gst-btn {
    font-size: 11px;
  }
  .rx-gst-desc-wrap {
    min-height: 193px;
  }
  .gv-row {
    font-size: 10px;
  }
  .gv-title {
    font-size: 13px;
  }
  .gv-tbl {
    font-size: 9px;
  }
  .gv-tbl th {
    font-size: 8px;
  }
  .gv-tbl th,
  .gv-tbl td {
    padding: 9px 4px;
  }
  .gv-qr {
    width: 78px;
    height: 78px;
    padding: 8px;
  }
  .security-editorial .sec-title,
  .portal-editorial .sec-title {
    font-size: 29px;
  }
  .iso-highlight {
    padding: 21px 18px;
    gap: 18px;
    align-items: flex-start;
    flex-direction: column;
  }
  .iso-badge-box {
    width: 84px;
    padding: 7px;
  }
  .iso-label {
    font-size: 8px;
  }
  .iso-num {
    font-size: 25px;
  }
  .iso-content h4 {
    font-size: 15px;
    line-height: 1.6;
  }
  .iso-content p {
    font-size: 11px;
  }
  .iso-meta {
    gap: 10px 14px;
  }
  .iso-meta span {
    font-size: 8px;
  }
  .sec-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .sec-card {
    display: grid;
    grid-template-columns: 40px 1fr;
    padding: 20px;
    gap: 4px 15px;
  }
  .sec-card .icon-box {
    grid-row: 1/4;
    width: 38px;
    height: 38px;
    margin: 0;
  }
  .sec-card-title {
    font-size: 15px;
    margin: 0;
  }
  .sec-card-desc {
    font-size: 11px;
  }
  .sec-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 13px;
    margin-top: 9px;
  }
  .sec-tag {
    font-size: 8px;
  }
  .saas-banner {
    gap: 14px;
    padding-block: 23px;
    flex-direction: column;
  }
  .saas-banner .icon-box.xl {
    width: 44px;
    height: 44px;
  }
  .saas-banner h3 {
    font-size: 19px;
  }
  .saas-banner p {
    font-size: 12px;
  }
  .saas-tags {
    gap: 10px 17px;
  }
  .saas-tags span {
    font-size: 9px;
  }
  .module-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .mod-card {
    padding: 23px;
    position: relative;
  }
  .mod-card .icon-box {
    margin-bottom: 17px;
  }
  .mod-card-title {
    font-size: 18px;
  }
  .mod-card-count {
    position: absolute;
    top: 33px;
    right: 23px;
    font-size: 8px;
    margin: 0;
  }
  .mod-card-list {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 19px;
    border-top: 1px solid var(--line);
    padding-top: 17px;
  }
  .mod-card-list li {
    font-size: 12px;
  }
  .showcase-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .sc-card {
    padding-top: 23px;
  }
  .sc-card h3 {
    font-size: 21px;
    margin-bottom: 10px;
  }
  .sc-card p {
    min-height: 0;
    font-size: 13px;
  }
  .sc-feats {
    grid-template-columns: 1fr 1fr;
    gap: 13px;
    margin: 18px 0 21px;
  }
  .sc-feat {
    font-size: 11px;
  }
  .sc-card .text-link {
    font-size: 12px;
  }
  .portal-flow-wrap {
    margin-top: 30px;
    padding-top: 24px;
  }
  .portal-flow-wrap h4 {
    font-size: 15px !important;
  }
  .portal-flow {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .pf-step {
    display: grid;
    grid-template-columns: 35px 1fr;
    padding: 13px 0;
    gap: 1px 12px;
  }
  .pf-step-icon {
    grid-row: 1/3;
  }
  .pf-step-icon svg {
    width: 22px !important;
    height: 22px !important;
  }
  .pf-step-label {
    margin: 0;
    font-size: 8px;
  }
  .pf-step-desc {
    font-size: 12px;
    margin: 0;
  }
  .pf-step:not(:last-child):after {
    left: 10px;
    right: auto;
    top: 40px;
    bottom: 2px;
    width: 1px;
    height: auto;
  }
  .sc-bottom {
    gap: 13px 18px;
    margin-top: 20px;
  }
  .sc-bottom-pill {
    font-size: 9px;
  }
  .biz-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .biz-card {
    padding: 20px;
    column-gap: 15px;
  }
  .biz-card h5 {
    font-size: 16px;
  }
  .biz-card p {
    font-size: 11px;
  }
  .compare-table-wrap {
    border-radius: 6px;
  }
  .compare-table {
    min-width: 750px;
    font-size: 11px;
  }
  .compare-table thead th {
    font-size: 11px;
  }
  .compare-table th,
  .compare-table td {
    padding: 13px 12px;
  }
  .compare-table tbody th {
    position: sticky;
    left: 0;
    z-index: 1;
    box-shadow: 1px 0 0 var(--line);
    min-width: 160px;
    max-width: 160px;
    width: 160px;
    font-size: 10px;
  }
  .compare-table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--wash);
    min-width: 160px !important;
  }
  .compare-note {
    font-size: 9px;
  }
  .pricing-flow {
    gap: 6px;
    margin: 20px 0 29px;
  }
  .pf-arrow {
    display: none;
  }
  .pf-item {
    font-size: 10px;
    padding: 8px 11px;
  }
  .pricing-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .p-card {
    padding: 28px;
  }
  .p-card:has(.popular-tag) {
    padding: 27px;
  }
  .p-card-desc {
    min-height: 0;
    font-size: 12px;
  }
  .p-card-name {
    font-size: 24px;
  }
  .p-card-price {
    margin-top: 20px;
  }
  .p-card-value {
    font-size: 42px;
  }
  .p-card-period {
    font-size: 11px;
    min-height: 0;
  }
  .p-card-feats li {
    font-size: 12px;
  }
  .p-card-feats {
    gap: 12px;
  }
  .pf-more {
    font-size: 12px;
  }
  .p-card-cta {
    font-size: 13px;
    padding: 14px;
  }
  .refund-note {
    font-size: 10px;
    padding: 15px;
  }
  .testi-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .testi-card {
    padding: 24px;
  }
  .testi-quote {
    font-size: 13px;
  }
  .review-cta {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 30px;
    padding-block: 27px;
  }
  .review-cta-left {
    padding-left: 0;
  }
  .review-cta-google-g {
    position: static;
    width: 30px;
    height: 30px;
    margin-bottom: 15px;
  }
  .review-cta-title {
    font-size: 21px;
  }
  .review-cta-subtitle {
    font-size: 11px;
  }
  .review-cta-right {
    align-items: flex-start;
  }
  .review-cta-qr img {
    width: 120px;
    height: 120px;
  }
  .faq-layout {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .faq-layout .sec-title {
    font-size: 29px;
    margin-bottom: 17px;
  }
  .faq-layout .sec-title br {
    display: none;
  }
  .faq-item summary {
    font-size: 13px;
    padding: 17px 0;
  }
  .faq-item p {
    font-size: 12px;
    padding-right: 0;
  }
  .contact-section > .container > .row {
    gap: 36px;
  }
  .contact-meta {
    gap: 10px 14px;
  }
  .contact-meta li {
    font-size: 9px;
  }
  .contact-badge {
    font-size: 10px;
  }
  .contact-card .col-md-6 {
    width: 100%;
  }
  .form-label {
    font-size: 11px;
  }
  .form-control {
    font-size: 16px;
    min-height: 46px;
  }
  .form-control::placeholder {
    font-size: 12px;
  }
  .form-check-label {
    font-size: 10px;
  }
  .support-title {
    font-size: 21px;
  }
  .support-sub {
    font-size: 11px;
  }
  .support-avatar {
    width: 50px;
    height: 50px;
  }
  .support-avatar > svg {
    width: 28px;
    height: 28px;
  }
  .support-header {
    gap: 14px;
    padding-bottom: 20px;
  }
  .support-tags {
    gap: 10px;
  }
  .support-tags span {
    font-size: 9px;
  }
  .ci-val {
    font-size: 11px;
  }
  .contact-map {
    aspect-ratio: 16/10;
  }
  .footer {
    padding-top: 35px;
  }
  .footer .col-lg-2 {
    width: 50%;
  }
  .footer .row {
    margin-inline: -10px;
    row-gap: 30px;
  }
  .footer .row > * {
    padding-inline: 10px;
  }
  .footer .col-lg-4 {
    margin: 0;
  }
  .footer-logo {
    margin-bottom: 18px;
  }
  .footer h5 {
    margin-bottom: 17px;
  }
  .footer-links {
    gap: 12px;
  }
  .footer-link {
    font-size: 11px;
  }
  .footer-legal {
    gap: 12px 18px;
  }
  .footer-pill {
    font-size: 8px;
  }
  .float-btns {
    right: 12px;
    bottom: 15px;
    gap: 8px;
  }
  .btn-whatsapp,
  .btn-back-top {
    width: 38px;
    height: 38px;
    border-radius: 6px;
  }
  .btn-whatsapp > svg {
    width: 24px;
    height: 24px;
  }
  .wa-tooltip {
    display: none;
  }
  .mqb-modal-dialog {
    padding: 27px 22px;
  }
  .mqb-modal-title {
    font-size: 20px;
  }
  .mqb-modal-body {
    font-size: 12px;
  }
}
@media (max-width: 360px) {
  .container {
    padding-inline: 16px;
  }
  .hero-title {
    font-size: 41px;
  }
  .hero-offer {
    font-size: 21px;
  }
  .hero-copy {
    padding-bottom: 260px;
  }
  .hero-art {
    width: 565px;
  }
  .hero-intro {
    font-size: 12px;
  }
  .btn-hero-primary,
  .btn-hero-secondary {
    font-size: 9px;
    padding-inline: 9px;
    gap: 5px;
  }
  .h-stats {
    gap: 20px;
  }
  .h-stat-val {
    font-size: 18px;
  }
  .h-cert {
    font-size: 7px;
  }
  .stats-inner {
    padding-inline: 16px;
  }
  .stat-val {
    font-size: 23px;
  }
  .sec-title,
  .rx-gst-head h2 {
    font-size: 27px;
  }
  .feat-card {
    padding: 21px;
  }
  .feat-card-count {
    right: 21px;
  }
  .feat-list li {
    font-size: 11px;
  }
  .rx-tour-visual {
    padding-inline: 12px;
  }
  .rx-phone {
    width: 265px;
  }
  .rx-scr-body {
    padding: 14px 11px;
  }
  .rx-line,
  .rx-line b {
    font-size: 8px;
  }
  .rx-gst-panel {
    padding: 15px;
  }
  .gv-qr {
    width: 67px;
    height: 67px;
  }
  .gv-title {
    font-size: 12px;
  }
  .mod-card {
    padding: 21px;
  }
  .mod-card-title {
    font-size: 17px;
  }
  .mod-card-count {
    right: 21px;
    font-size: 7px;
  }
  .mod-card-list li {
    font-size: 11px;
  }
  .sec-card {
    padding: 17px;
    gap: 4px 11px;
  }
  .sec-tags {
    gap: 6px 10px;
  }
  .h-meta li {
    font-size: 8px;
  }
  .hfi-text {
    font-size: 9px;
  }
  .hfi-sub {
    font-size: 8px;
  }
  .sc-feat {
    font-size: 10px;
  }
  .p-card {
    padding: 25px;
  }
  .p-card:has(.popular-tag) {
    padding: 24px;
  }
  .login-dropdown-menu {
    width: calc(100vw - 32px);
    left: 16px;
  }
  .navbar-actions {
    gap: 12px;
  }
  .btn-partner-nav {
    font-size: 10px;
  }
  .btn-trial-nav {
    font-size: 10px;
    padding: 10px;
  }
  .btn-login {
    font-size: 11px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *:before,
  *:after {
    animation: none !important;
    transition: none !important;
  }
}
.video-launch {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background: #f8fafc;
  padding: 0;
  overflow: hidden;
}
.video-launch > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--blue);
  color: white;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  box-shadow: 0 6px 25px #0e49bd33;
}
.video-play svg {
  width: 21px;
  height: 21px;
}
.video-launch-label {
  position: absolute;
  bottom: 15px;
  left: 17px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 6px 11px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
}
.video-launch:hover .video-play {
  background: var(--green);
}
.contact-card[style*="display: flex"] {
  flex-direction: column;
  gap: 14px;
}
.hero-mobile-art {
  display: none;
}
@media (max-width: 991px) {
  main > .hero {
    min-height: 0;
    background: #fafbfc;
  }
  .hero-inner {
    min-height: 0;
  }
  .hero-copy {
    padding-bottom: 0;
  }
  .hero-art {
    display: none;
  }
  .hero-mobile-art {
    display: block;
    position: relative;
    width: min(100%, 480px);
    height: auto;
    margin: 0 auto;
    max-width: 100%;
  }
  .hero-graphic-caption {
    font-size: 8px;
    bottom: 10px;
  }
}
@media (max-width: 680px) {
  .hero-copy {
    padding-bottom: 0;
  }
  .hero-mobile-art {
    width: 100%;
    max-width: 450px;
    margin-top: 0;
  }
  .hero-graphic-caption {
    font-size: 7px;
  }
}
.contact-map iframe {
  border: 0;
}

/* Industry carousel: independent artwork leaves the original offer readable. */
main > .hero.hero-light {background:#fff;min-height:650px}
.hero-light .hero-inner {display:flex;align-items:center;gap:36px;min-height:650px;padding-block:36px}
.hero-light .hero-copy {flex:0 0 42%;width:auto;max-width:500px;padding-block:20px}
.hero-light .hero-graphic-caption {display:none}
.industry-slider {flex:1;min-width:0;position:relative;align-self:center}
.industry-stage {position:relative;aspect-ratio:3/2;padding-bottom:72px;box-sizing:content-box;overflow:hidden}
.industry-slide {position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:translateX(35px) scale(.98);transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1),visibility .7s}
.industry-slide.is-active {opacity:1;visibility:visible;transform:translateX(0) scale(1)}
.industry-slide img {width:100%;aspect-ratio:3/2;height:auto;object-fit:contain;display:block}
.industry-slide figcaption {padding:12px 20px;border-left:3px solid #1755ec;margin-left:24px}
.industry-slide figcaption span {display:block;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#087f75;margin-bottom:5px}
.industry-slide figcaption strong {font-size:17px;color:#172b34;line-height:1.4}
.industry-controls {display:flex;align-items:center;justify-content:center;gap:10px;margin-top:12px}
.industry-controls button {cursor:pointer;border:1px solid #dae3eb;background:#fff;color:#18343d;border-radius:50%;min-width:40px;height:40px;font:inherit}
.industry-controls button:hover {background:#f1f6ff;border-color:#1755ec}
.industry-controls button:focus-visible {outline:3px solid #1755ec;outline-offset:3px}
.industry-dots {display:flex;gap:0}
.industry-dots button {border:0;background:transparent;min-width:30px}
.industry-dots span {display:block;margin:auto;width:7px;height:7px;border-radius:20px;background:#b5c3ce;transition:width .3s,background .3s}
.industry-dots [aria-pressed=true] span {width:22px;background:#1755ec}
.industry-note {font-size:9px;color:#667c88;text-align:center;margin:12px 0 0}
@media(min-width:1500px){.hero-light .hero-inner{min-height:710px}.industry-slider{max-width:800px}}
@media(max-width:1000px){.hero-light .hero-inner{gap:16px}.hero-light .hero-copy{flex-basis:44%}.industry-slide figcaption strong{font-size:14px}.industry-slide figcaption{margin-left:5px;padding:10px}.hero-light .hero-title{font-size:48px}}
@media(max-width:767px){main > .hero.hero-light{min-height:0}.hero-light .hero-inner{display:flex;flex-direction:column;min-height:0;padding-block:30px;gap:16px}.hero-light .hero-copy{width:100%;max-width:540px;padding:0;flex:auto}.industry-slider{width:100%;max-width:600px;flex:auto}.industry-stage{padding-bottom:75px}.industry-slide figcaption{margin-left:12px}.industry-slide figcaption strong{font-size:15px}.industry-controls{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.industry-slide,.industry-dots span{transition:none;transform:none}}

/* Seamless image edges: alpha masks blend artwork into any hero background. */
.industry-slide img {
  border:0;border-radius:0;box-shadow:none;background:transparent;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 5%,#000 83%,transparent 99%);
  mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 5%,#000 83%,transparent 99%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.industry-slide figcaption {border:0;margin-left:0;padding:12px 18px;text-align:center}

/* ===== Industry carousel: autoplay + premium motion ===== */
.industry-slider {
  --industry-duration: 4.8s;
}

.industry-slide {
  transform: translate3d(34px, 0, 0) scale(.985);
  transition:
    opacity .72s ease,
    transform .9s cubic-bezier(.2,.72,.2,1),
    visibility .72s;
  will-change: opacity, transform;
}

.industry-slide.is-active {
  transform: translate3d(0, 0, 0) scale(1);
}

.industry-slide img {
  transform-origin: 50% 50%;
  will-change: transform, filter;
}

.industry-slide.is-active.is-animating img {
  animation: industryImageMotion var(--industry-duration) cubic-bezier(.16,.72,.24,1) both;
}

.industry-slide figcaption span,
.industry-slide figcaption strong {
  opacity: 0;
  transform: translateY(10px);
}

.industry-slide.is-active.is-animating figcaption span {
  animation: industryCaptionIn .55s .16s ease-out forwards;
}

.industry-slide.is-active.is-animating figcaption strong {
  animation: industryCaptionIn .65s .28s ease-out forwards;
}

.industry-controls > button {
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.industry-controls > button:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 8px 20px rgba(23,85,236,.10);
}


.industry-dots button span {
  position: relative;
  overflow: hidden;
}

.industry-dots button.is-progressing[aria-pressed="true"] span {
  width: 28px;
  animation: industryDotPulse var(--industry-duration) linear both;
}

@keyframes industryImageMotion {
  0%   { transform: scale(.985) translate3d(0, 10px, 0); filter: saturate(.96) brightness(.99); }
  18%  { transform: scale(1.002) translate3d(0, 0, 0); filter: saturate(1) brightness(1); }
  100% { transform: scale(1.035) translate3d(-5px, -3px, 0); filter: saturate(1.035) brightness(1.01); }
}

@keyframes industryCaptionIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes industryDotPulse {
  0%   { box-shadow: inset 0 0 0 0 rgba(255,255,255,.28); }
  50%  { box-shadow: inset 14px 0 0 0 rgba(255,255,255,.18); }
  100% { box-shadow: inset 28px 0 0 0 rgba(255,255,255,.08); }
}

@media (prefers-reduced-motion: reduce) {
  .industry-slide,
  .industry-slide img,
  .industry-slide figcaption span,
  .industry-slide figcaption strong,
  .industry-dots span {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
  .industry-slide.is-active figcaption span,
  .industry-slide.is-active figcaption strong {
    opacity: 1;
  }
}


/* ===== 2026-09 slider image pack: 6 AI business visuals ===== */
.industry-stage {
  aspect-ratio: 16 / 9;
  padding-bottom: 72px;
}
.industry-slide img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center top;
}
/* Alternate the slow cinematic motion direction from slide to slide. */
.industry-slide:nth-child(3n + 1).is-active.is-animating img {
  animation-name: industryImageMotionLeft;
}
.industry-slide:nth-child(3n + 2).is-active.is-animating img {
  animation-name: industryImageMotionCenter;
}
.industry-slide:nth-child(3n).is-active.is-animating img {
  animation-name: industryImageMotionRight;
}
@keyframes industryImageMotionLeft {
  0% { transform: scale(.99) translate3d(7px, 7px, 0); filter: saturate(.97) brightness(.995); }
  22% { transform: scale(1.006) translate3d(1px, 1px, 0); filter: saturate(1) brightness(1); }
  100% { transform: scale(1.045) translate3d(-10px, -4px, 0); filter: saturate(1.035) brightness(1.01); }
}
@keyframes industryImageMotionCenter {
  0% { transform: scale(.99) translate3d(0, 9px, 0); filter: saturate(.97) brightness(.995); }
  22% { transform: scale(1.006) translate3d(0, 1px, 0); filter: saturate(1) brightness(1); }
  100% { transform: scale(1.048) translate3d(0, -7px, 0); filter: saturate(1.035) brightness(1.01); }
}
@keyframes industryImageMotionRight {
  0% { transform: scale(.99) translate3d(-7px, 7px, 0); filter: saturate(.97) brightness(.995); }
  22% { transform: scale(1.006) translate3d(-1px, 1px, 0); filter: saturate(1) brightness(1); }
  100% { transform: scale(1.045) translate3d(10px, -4px, 0); filter: saturate(1.035) brightness(1.01); }
}
@media (max-width: 767px) {
  .industry-stage { aspect-ratio: 16 / 9; padding-bottom: 78px; }
}
@media (prefers-reduced-motion: reduce) {
  .industry-slide.is-active.is-animating img { animation: none !important; }
}


/* ===== FINAL pixel-alpha blended industry hero ===== */
main > .hero.hero-light {
  background: #fff !important;
}
.hero-light .hero-inner {
  align-items: center;
  gap: 34px;
}
.industry-slider {
  --industry-duration: 4.8s;
  flex: 1;
  min-width: 0;
  max-width: 900px;
  margin-left: auto;
  padding: 4px 0 0;
  position: relative;
  align-self: center;
  isolation: isolate;
}
.industry-slider::before {
  content: "";
  position: absolute;
  inset: 44px 30px 116px 72px;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse at 58% 46%, rgba(225,236,255,.22) 0%, rgba(241,246,255,.12) 48%, rgba(255,255,255,0) 74%);
  filter: blur(22px);
}
.industry-slider::after { content:none !important; }
.industry-stage {
  position: relative;
  aspect-ratio: 16 / 9;
  padding-bottom: 94px;
  box-sizing: content-box;
  overflow: visible;
  background: transparent !important;
}
.industry-stage::before,
.industry-stage::after { content:none !important; }
.industry-slide {
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  visibility:hidden;
  transform:translate3d(34px,0,0) scale(.988);
  transition:opacity .72s ease, transform .9s cubic-bezier(.2,.72,.2,1), visibility .72s;
  overflow:visible;
  will-change:opacity,transform;
}
.industry-slide.is-active {
  opacity:1;
  visibility:visible;
  transform:translate3d(0,0,0) scale(1);
}
.industry-slide::before,
.industry-slide::after { content:none !important; }
.industry-slide img {
  width:100%;
  height:auto;
  aspect-ratio:auto !important;
  object-fit:contain;
  display:block;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  filter:drop-shadow(0 18px 28px rgba(25,56,102,.025));
  transform-origin:50% 50%;
  will-change:transform,filter;
}
.industry-slide.is-active.is-animating img {
  animation:industryImageMotion var(--industry-duration) cubic-bezier(.16,.72,.24,1) both;
}
.industry-slide figcaption {
  position:relative;
  z-index:4;
  border:0 !important;
  max-width:760px;
  margin:0 auto;
  padding:10px 14px 0;
  text-align:center;
  background:transparent !important;
}
.industry-slide figcaption span {
  display:block;
  margin-bottom:7px;
  color:#078b7f;
  font-size:11px;
  font-weight:800;
  letter-spacing:1.5px;
  text-transform:uppercase;
}
.industry-slide figcaption strong {
  display:block;
  color:#172b34;
  font-size:17px;
  line-height:1.38;
}
.industry-controls { margin-top:8px; }
.industry-note { margin-top:9px; }
@media (min-width:1500px) {
  .industry-slider { max-width:920px; }
}
@media (max-width:1000px) {
  .hero-light .hero-inner { gap:18px; }
  .industry-slider { max-width:100%; }
  .industry-stage { padding-bottom:88px; }
  .industry-slide figcaption strong { font-size:15px; }
}
@media (max-width:767px) {
  .industry-slider { width:100%; max-width:620px; padding-top:0; }
  .industry-slider::before { inset:22px 8px 96px 28px; filter:blur(16px); }
  .industry-stage { aspect-ratio:16/9; padding-bottom:84px; }
  .industry-slide figcaption { padding-top:8px; }
  .industry-slide figcaption span { font-size:10px; }
  .industry-slide figcaption strong { font-size:14px; }
}
@media (prefers-reduced-motion:reduce) {
  .industry-slide,
  .industry-slide img,
  .industry-slide figcaption span,
  .industry-slide figcaption strong,
  .industry-dots span {
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }
  .industry-slide.is-active figcaption span,
  .industry-slide.is-active figcaption strong { opacity:1; }
}


/* ===== All 6 slider images: uniform seamless blend fix ===== */
.industry-slider{max-width:960px;margin-left:auto;padding:8px 0 0;isolation:isolate}
.industry-slider::before,.industry-slider::after,.industry-stage::before{display:none!important}
.industry-stage{position:relative;aspect-ratio:16/9;padding-bottom:108px;box-sizing:content-box;overflow:visible}
.industry-stage::after{content:"";position:absolute;left:0;right:0;bottom:84px;height:44px;background:linear-gradient(180deg,rgba(247,248,251,0),rgba(247,248,251,.98));pointer-events:none;z-index:3}
.industry-slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:translate3d(28px,0,0) scale(.992);transition:opacity .68s ease,transform .82s cubic-bezier(.2,.72,.2,1),visibility .68s}
.industry-slide.is-active{opacity:1;visibility:visible;transform:translate3d(0,0,0) scale(1)}
.industry-slide img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;display:block;border:0;border-radius:0;box-shadow:none;background:transparent;filter:drop-shadow(0 12px 26px rgba(19,42,84,.04))}
.industry-slide figcaption{max-width:820px;margin:0 auto;padding:14px 12px 0;text-align:center;border:0}
.industry-slide figcaption span{display:block;margin-bottom:8px;color:#0b8b80;font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase}
.industry-slide figcaption strong{display:block;color:#172b34;font-size:18px;line-height:1.38;letter-spacing:-.01em}
.industry-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:10px}
.industry-controls button{cursor:pointer;border:1px solid #d8e2ee;background:#fff;color:#18343d;border-radius:999px;min-width:42px;height:42px;font:inherit;transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease}
.industry-controls button:hover{background:#fff;border-color:#1755ec;transform:translateY(-2px) scale(1.04);box-shadow:0 10px 24px rgba(23,85,236,.12)}
.industry-dots{display:flex;align-items:center;gap:4px}
.industry-dots button{border:0;background:transparent;min-width:28px;padding:8px 0}
.industry-dots span{display:block;margin:auto;width:8px;height:8px;border-radius:99px;background:#b9c6d2;transition:width .3s,background .3s}
.industry-dots [aria-pressed=true] span{width:28px;background:#1755ec}
.industry-note{font-size:10px;color:#6d8090;text-align:center;margin:10px 0 0}
@media(max-width:1000px){.industry-slider{max-width:100%;padding-top:0}.industry-stage{padding-bottom:98px}.industry-slide figcaption strong{font-size:16px}}
@media(max-width:767px){.industry-stage{padding-bottom:88px}.industry-slide figcaption span{font-size:11px}.industry-slide figcaption strong{font-size:15px}.industry-controls{margin-top:6px}}


/* ===== Pricing billing-cycle switch: Monthly / Yearly ===== */
.billing-cycle-switch{display:inline-flex;align-items:center;gap:4px;margin-top:22px;padding:4px;border:1px solid var(--line);border-radius:999px;background:#fff;box-shadow:0 8px 24px rgba(18,54,82,.06)}
.billing-cycle-btn{min-width:118px;min-height:42px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:750;letter-spacing:.01em;cursor:pointer;transition:background .22s ease,color .22s ease,box-shadow .22s ease,transform .22s ease}
.billing-cycle-btn:hover{color:var(--blue)}
.billing-cycle-btn.active,.billing-cycle-btn[aria-selected="true"]{background:var(--blue);color:#fff;box-shadow:0 5px 14px rgba(23,85,236,.20)}
.billing-cycle-btn:focus-visible{outline:3px solid rgba(23,85,236,.25);outline-offset:2px}
.billing-cycle-caption{margin-top:8px;color:var(--muted);font-size:10px;min-height:15px}
.pricing-grid .billing-cycle-hidden,#pricingFlow .billing-cycle-hidden{display:none!important}
.pricing-grid .billing-cycle-reveal{animation:pricingCycleIn .34s ease both}
@keyframes pricingCycleIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:767px){.billing-cycle-switch{width:min(100%,300px);display:flex;margin-inline:auto}.billing-cycle-btn{flex:1;min-width:0;min-height:44px}.billing-cycle-caption{font-size:9px}}
@media(prefers-reduced-motion:reduce){.billing-cycle-btn{transition:none}.pricing-grid .billing-cycle-reveal{animation:none}}


/* ===== reCAPTCHA wider / normal size ===== */
.g-recaptcha {
  width: 304px;
  max-width: 100%;
}
@media (max-width: 380px) {
  .g-recaptcha {
    transform: scale(.92);
    transform-origin: left top;
    margin-bottom: -6px;
  }
}


/* ===== Stats section animation upgrade ===== */
.stats-section {
  position: relative;
}
.stats-grid {
  gap: 0;
}
.stat-card {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  transition: transform .35s ease, box-shadow .35s ease, background-color .35s ease, border-color .35s ease;
  opacity: 0;
  transform: translateY(20px);
  background: transparent;
}
.stats-grid.in-view .stat-card {
  opacity: 1;
  transform: translateY(0);
}
.stats-grid.in-view .stat-card:nth-child(1) { transition-delay: .04s; }
.stats-grid.in-view .stat-card:nth-child(2) { transition-delay: .12s; }
.stats-grid.in-view .stat-card:nth-child(3) { transition-delay: .20s; }
.stats-grid.in-view .stat-card:nth-child(4) { transition-delay: .28s; }
.stat-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.88), rgba(246,249,255,.7));
  opacity: 0;
  transition: opacity .35s ease;
  z-index: 0;
}
.stat-card::after {
  content: "";
  position: absolute;
  inset: -30% auto -30% -45%;
  width: 38%;
  transform: skewX(-20deg) translateX(-180%);
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.68), rgba(255,255,255,0));
  opacity: 0;
}
.stats-grid.in-view .stat-card:hover,
.stats-grid.in-view .stat-card:focus-within {
  transform: translateY(-7px);
  box-shadow: 0 18px 38px rgba(20,48,94,.08);
}
.stats-grid.in-view .stat-card:hover::before,
.stats-grid.in-view .stat-card:focus-within::before {
  opacity: 1;
}
.stats-grid.in-view .stat-card:hover::after,
.stats-grid.in-view .stat-card:focus-within::after {
  opacity: 1;
  animation: statShine 1.1s ease;
}
.stat-card > * {
  position: relative;
  z-index: 1;
}
.stat-card .icon-box {
  transition: transform .35s ease, box-shadow .35s ease;
  animation: statFloat 5.6s ease-in-out infinite;
}
.stat-card:nth-child(2) .icon-box { animation-delay: .5s; }
.stat-card:nth-child(3) .icon-box { animation-delay: 1s; }
.stat-card:nth-child(4) .icon-box { animation-delay: 1.5s; }
.stats-grid.in-view .stat-card:hover .icon-box,
.stats-grid.in-view .stat-card:focus-within .icon-box {
  transform: scale(1.08) rotate(-4deg);
  box-shadow: 0 10px 24px rgba(23,85,236,.14);
}
.stat-val {
  transition: letter-spacing .25s ease, transform .25s ease;
}
.stats-grid.in-view .stat-card:hover .stat-val,
.stats-grid.in-view .stat-card:focus-within .stat-val {
  transform: translateY(-1px);
  letter-spacing: .01em;
}
.stat-sub .dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 999px;
  background: currentColor;
  opacity: .2;
  vertical-align: middle;
  animation: statPulse 2s ease-in-out infinite;
}
.stat-card:nth-child(2) .stat-sub .dot { animation-delay: .3s; }
.stat-card:nth-child(3) .stat-sub .dot { animation-delay: .6s; }
.stat-card:nth-child(4) .stat-sub .dot { animation-delay: .9s; }
@keyframes statFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
@keyframes statPulse {
  0%,100% { transform: scale(1); opacity: .2; }
  50% { transform: scale(1.55); opacity: .5; }
}
@keyframes statShine {
  from { transform: skewX(-20deg) translateX(-180%); }
  to { transform: skewX(-20deg) translateX(420%); }
}
@media (max-width: 767px) {
  .stat-card {
    margin-bottom: 10px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .stat-card,
  .stat-card::before,
  .stat-card::after,
  .stat-card .icon-box,
  .stat-val,
  .stat-sub .dot {
    animation: none !important;
    transition: none !important;
  }
  .stat-card {
    opacity: 1 !important;
    transform: none !important;
  }
}


/* ===== Hero title multicolor lighting effect ===== */
.hero-title {
  position: relative;
  display: inline-block;
  color: #12202d;
  letter-spacing: -0.02em;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .hero-title {
    background-image: linear-gradient(
      90deg,
      #132533 0%,
      #1755ec 16%,
      #00a7ff 32%,
      #0ea5a0 48%,
      #10b981 64%,
      #f59e0b 80%,
      #7c3aed 92%,
      #132533 100%
    );
    background-size: 240% 100%;
    background-position: 0% 50%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation:
      mqbHeroGradientShift 7s ease-in-out infinite,
      mqbHeroGlowPulse 3.8s ease-in-out infinite;
    filter: drop-shadow(0 4px 18px rgba(23, 85, 236, 0.10));
  }
  .hero-title::before {
    content: "";
    position: absolute;
    inset: -8px -14px;
    border-radius: 18px;
    background: linear-gradient(
      110deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 32%,
      rgba(255,255,255,0.35) 46%,
      rgba(255,255,255,0.78) 50%,
      rgba(255,255,255,0.35) 54%,
      rgba(255,255,255,0) 68%,
      rgba(255,255,255,0) 100%
    );
    transform: translateX(-155%) skewX(-18deg);
    pointer-events: none;
    opacity: .9;
    animation: mqbHeroLightSweep 4.8s cubic-bezier(.2,.75,.2,1) infinite;
    mix-blend-mode: screen;
  }
}
@keyframes mqbHeroGradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
@keyframes mqbHeroGlowPulse {
  0%, 100% {
    text-shadow:
      0 0 0 rgba(23,85,236,0),
      0 0 0 rgba(16,185,129,0);
    filter: drop-shadow(0 4px 16px rgba(23, 85, 236, 0.08));
  }
  25% {
    text-shadow:
      0 0 8px rgba(23,85,236,0.14),
      0 0 24px rgba(0,167,255,0.10);
    filter: drop-shadow(0 6px 20px rgba(23, 85, 236, 0.16));
  }
  50% {
    text-shadow:
      0 0 9px rgba(16,185,129,0.16),
      0 0 26px rgba(245,158,11,0.12);
    filter: drop-shadow(0 6px 22px rgba(16, 185, 129, 0.16));
  }
  75% {
    text-shadow:
      0 0 10px rgba(124,58,237,0.15),
      0 0 28px rgba(23,85,236,0.12);
    filter: drop-shadow(0 6px 22px rgba(124, 58, 237, 0.16));
  }
}
@keyframes mqbHeroLightSweep {
  0%, 12% {
    transform: translateX(-155%) skewX(-18deg);
    opacity: 0;
  }
  18% {
    opacity: .92;
  }
  42% {
    transform: translateX(135%) skewX(-18deg);
    opacity: .92;
  }
  48%, 100% {
    transform: translateX(155%) skewX(-18deg);
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-title,
  .hero-title::before {
    animation: none !important;
  }
}


/* ===== Live Product Demo: 30-sec teaser -> full YouTube flow ===== */
.demo-flow .h-video-badge{flex-wrap:wrap}
.demo-auto-pill{margin-left:auto;padding:4px 8px;border:1px solid rgba(15,139,109,.18);background:rgba(15,139,109,.07);color:var(--green);border-radius:999px;font-size:9px;font-weight:700;letter-spacing:.02em}
.demo-flow-frame{position:relative;background:#f7f9fc;border:1px solid var(--line);box-shadow:0 18px 44px rgba(20,48,94,.08)}
.demo-teaser-stage,.demo-youtube-stage{position:absolute;inset:0;width:100%;height:100%;background:#f8fafc}
.demo-teaser-video,.demo-youtube-stage iframe{display:block;width:100%;height:100%;border:0;object-fit:cover}
.demo-top-ui{position:absolute;top:13px;left:13px;right:13px;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:4;pointer-events:none}
.demo-preview-chip,.demo-sound-btn{min-height:34px;display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.92);border:1px solid rgba(207,216,230,.92);box-shadow:0 8px 22px rgba(20,48,94,.08);backdrop-filter:blur(10px);font-size:10px;font-weight:700;color:var(--ink)}
.demo-preview-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(15,139,109,.12);animation:demoLivePulse 1.8s ease-in-out infinite}
.demo-sound-btn{pointer-events:auto;cursor:pointer;font:inherit;color:var(--ink)}
.demo-sound-btn:hover{border-color:var(--blue);color:var(--blue)}
.demo-progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(13,34,66,.08);z-index:5;overflow:hidden}
.demo-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--green),var(--blue));transition:width .18s linear}
.demo-autoplay-fallback{position:absolute;inset:0;margin:auto;width:min(320px,82%);height:max-content;display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.95);color:var(--ink);box-shadow:0 18px 48px rgba(20,48,94,.12);cursor:pointer;z-index:6;text-align:left}
.demo-autoplay-fallback[hidden]{display:none!important}
.demo-play-circle{flex:0 0 44px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff}
.demo-play-circle svg{width:17px;height:17px}
.demo-autoplay-fallback strong,.demo-autoplay-fallback small{display:block}.demo-autoplay-fallback strong{font-size:12px}.demo-autoplay-fallback small{font-size:9px;color:var(--muted);margin-top:2px}
.demo-ending-cta{position:absolute;inset:auto 18px 22px 18px;padding:13px 16px;border-radius:12px;background:rgba(17,34,45,.88);color:#fff;backdrop-filter:blur(12px);box-shadow:0 16px 38px rgba(0,0,0,.16);z-index:5;opacity:0;transform:translateY(8px);transition:opacity .35s ease,transform .35s ease;pointer-events:none}
.demo-ending-cta span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#b7d6ff;margin-bottom:3px}.demo-ending-cta strong{font-size:12px}
.demo-teaser-stage.is-ending .demo-ending-cta{opacity:1;transform:translateY(0)}
.demo-youtube-stage[hidden],.demo-teaser-stage[hidden]{display:none!important}
.demo-youtube-stage{background:#091017}
.demo-full-badge{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:rgba(9,16,23,.76);color:#fff;font-size:9px;font-weight:700;backdrop-filter:blur(10px);pointer-events:none}.demo-full-badge span{width:7px;height:7px;border-radius:50%;background:#28c98b;box-shadow:0 0 0 5px rgba(40,201,139,.15)}
.demo-flow-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;flex-wrap:wrap}
.demo-flow-link{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:7px 11px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:inherit;font-size:10px;font-weight:650;cursor:pointer}.demo-flow-link svg{width:13px;height:13px}.demo-flow-link:hover{border-color:var(--blue);color:var(--blue)}.demo-flow-primary{margin-left:auto;background:var(--blue);border-color:var(--blue);color:#fff}.demo-flow-primary:hover{background:#0d49d4;color:#fff;border-color:#0d49d4}
@keyframes demoLivePulse{0%,100%{transform:scale(1);box-shadow:0 0 0 3px rgba(15,139,109,.10)}50%{transform:scale(1.12);box-shadow:0 0 0 8px rgba(15,139,109,0)}}
@media(max-width:767px){.demo-auto-pill{width:100%;margin-left:14px}.demo-top-ui{top:8px;left:8px;right:8px}.demo-preview-chip,.demo-sound-btn{min-height:30px;padding:6px 9px}.demo-ending-cta{left:10px;right:10px;bottom:14px}.demo-flow-actions{justify-content:stretch}.demo-flow-link{flex:1 1 145px}.demo-flow-primary{margin-left:0}}
@media(prefers-reduced-motion:reduce){.demo-preview-dot{animation:none}.demo-ending-cta{transition:none}}

.demo-replay-symbol{font-size:16px;line-height:1;font-weight:700;transform:translateY(-1px)}


/* ===== Preserve original teaser; exact MyQuickBill logo + clean readable captions ===== */
.demo-brand-overlay{
  position:absolute;
  top:18px;
  left:18px;
  z-index:7;
  pointer-events:none;
}
.demo-brand-card{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:150px;
  height:54px;
  padding:7px 12px;
  border:1px solid rgba(214,225,238,.92);
  border-radius:13px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 24px rgba(13,34,66,.10);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.demo-brand-card img{
  display:block;
  width:auto;
  max-width:132px;
  max-height:40px;
  object-fit:contain;
}
.demo-feature-caption{
  position:absolute;
  left:22px;
  bottom:22px;
  z-index:7;
  display:flex;
  flex-direction:column;
  gap:2px;
  max-width:min(520px,calc(100% - 44px));
  padding:10px 14px 11px;
  border:1px solid rgba(255,255,255,.58);
  border-radius:12px;
  background:rgba(8,28,46,.72);
  box-shadow:0 10px 24px rgba(0,0,0,.13);
  color:#fff;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  pointer-events:none;
  transform:translateY(0);
  opacity:1;
  transition:opacity .22s ease,transform .22s ease;
}
.demo-feature-caption.is-changing{
  opacity:.22;
  transform:translateY(4px);
}
.demo-feature-caption strong{
  font-size:15px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.01em;
}
.demo-feature-caption span{
  font-size:12px;
  line-height:1.35;
  color:rgba(255,255,255,.91);
  font-weight:600;
}
.demo-teaser-stage.is-ending .demo-feature-caption{opacity:0;transform:translateY(4px)}
@media(max-width:700px){
  .demo-brand-overlay{top:10px;left:10px}
  .demo-brand-card{min-width:112px;height:42px;padding:5px 8px;border-radius:10px}
  .demo-brand-card img{max-width:100px;max-height:31px}
  .demo-feature-caption{left:10px;right:10px;bottom:12px;max-width:none;padding:8px 10px 9px;border-radius:10px}
  .demo-feature-caption strong{font-size:13px}
  .demo-feature-caption span{font-size:10.5px}
}


/* ===== Exact logo placed inside the video screen; no floating logo card ===== */
.demo-brand-overlay,.demo-brand-card{display:none!important}
.demo-video-screen-fix{
  position:absolute;
  left:52%;
  top:50.5%;
  z-index:6;
  width:clamp(150px,28%,230px);
  transform:translate(-50%,-50%);
  pointer-events:none;
  opacity:0;
  transition:opacity .20s ease;
}
.demo-video-screen-fix.is-visible{opacity:1}
.demo-video-screen-fix-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:12px 16px 10px;
  border-radius:8px;
  background:#08223c;
  box-shadow:0 0 0 1px rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.12);
}
.demo-video-screen-fix img{
  display:block;
  width:100%;
  max-width:185px;
  max-height:58px;
  object-fit:contain;
  filter:none;
}
.demo-video-screen-fix span{
  color:rgba(255,255,255,.9);
  font-size:10px;
  line-height:1.1;
  font-weight:600;
  letter-spacing:.01em;
}
/* readable captions without the large dark card */
.demo-feature-caption{
  left:50%!important;
  right:auto!important;
  bottom:14px!important;
  max-width:86%!important;
  transform:translateX(-50%)!important;
  align-items:center!important;
  text-align:center!important;
  gap:1px!important;
  padding:7px 12px 8px!important;
  border:0!important;
  border-radius:8px!important;
  background:linear-gradient(90deg,rgba(4,17,29,.00),rgba(4,17,29,.68) 18%,rgba(4,17,29,.68) 82%,rgba(4,17,29,.00))!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.demo-feature-caption strong{font-size:13px!important;font-weight:800!important}
.demo-feature-caption span{font-size:10.5px!important;font-weight:600!important}
.demo-feature-caption.is-changing{opacity:.15!important;transform:translateX(-50%) translateY(2px)!important}
.demo-teaser-stage.is-ending .demo-feature-caption{opacity:0!important;transform:translateX(-50%) translateY(2px)!important}
@media(max-width:700px){
  .demo-video-screen-fix{width:34%;left:52%;top:50.5%}
  .demo-video-screen-fix-inner{padding:7px 9px 6px;border-radius:6px;gap:2px}
  .demo-video-screen-fix img{max-width:120px;max-height:38px}
  .demo-video-screen-fix span{font-size:7px}
  .demo-feature-caption{bottom:8px!important;max-width:92%!important;padding:5px 9px 6px!important}
  .demo-feature-caption strong{font-size:11px!important}
  .demo-feature-caption span{font-size:9px!important}
}