*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html { font-size: 16px; }
body {
  margin: 0;
  padding: 0;
  font-family: "Segoe UI", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: #1E1C38;
  background: #F7F7FC;
  -webkit-font-smoothing: antialiased;
}
a { color: #4A3F8C; text-decoration: none; }
a:hover { color: #7B5EA7; text-decoration: underline; }
img { max-width: 100%; height: auto; display: block; }
ul, ol { margin: 0; padding: 0; list-style: none; }
p { margin: 0 0 1em; }
h1, h2, h3, h4 { margin: 0 0 .6em; font-weight: 700; line-height: 1.25; }


.clearfix:after { content: ""; display: table; clear: both; }
.wrap { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.wrap-narrow { max-width: 780px; margin: 0 auto; padding: 0 24px; }



.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 64px;
  background: #1E1C38;
  border-bottom: 2px solid #7B5EA7;
  z-index: 999;
  -webkit-box-shadow: 0 2px 14px rgba(30,28,56,0.55);
  box-shadow: 0 2px 14px rgba(30,28,56,0.55);
}
.header-inner {
  height: 64px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.channel-logo { margin-right: 14px; }
.channel-logo-img { height: 20px; width: auto; }


.logo {
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  margin-right: 0;
  text-decoration: none;
}
.logo:hover { text-decoration: none; }
.logo-box {
  width: 42px; height: 42px;
  background: #302E5A;
  border-radius: 8px;
  border: 1.5px solid rgba(123,94,167,.55);
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 2px;
  -webkit-box-shadow: 0 2px 8px rgba(0,0,0,.35);
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.logo-img { width: 36px; height: 36px; object-fit: contain; border-radius: 4px; }
.logo-text {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  letter-spacing: .02em;
}
.logo-text b { color: #A78BDB; font-weight: 700; }


.main-nav { margin: 0 12px 0 48px; }
.main-nav ul { display: -ms-flexbox; display: flex; gap: 2px; }
.main-nav li a {
  display: block;
  padding: 6px 10px;
  font-size: 14px;
  font-weight: 500;
  color: #b0aad8;
  border-radius: 6px;
  white-space: nowrap;
  -webkit-transition: background .2s, color .2s;
  transition: background .2s, color .2s;
}
.main-nav li a:hover {
  color: #fff;
  background: rgba(123,94,167,.22);
  text-decoration: none;
}


.btn-nav {
  white-space: nowrap;
  font-size: 14px !important;
  padding: 8px 20px !important;
  margin-left: auto;
}


.btn {
  display: inline-block;
  padding: 11px 28px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  border: 2px solid transparent;
  -webkit-transition: all .2s;
  transition: all .2s;
  text-decoration: none;
}
.btn:hover { text-decoration: none; }


.btn-primary {
  background: #7B5EA7;
  color: #fff !important;
  border-color: #7B5EA7;
}
.btn-primary:hover {
  background: #5C3D8F;
  border-color: #5C3D8F;
  color: #fff !important;
  -webkit-transform: translateY(-2px);
  transform: translateY(-2px);
  -webkit-box-shadow: 0 6px 18px rgba(123,94,167,.45);
  box-shadow: 0 6px 18px rgba(123,94,167,.45);
}


.btn-ghost {
  background: rgba(255,255,255,.08);
  color: #fff !important;
  border-color: rgba(255,255,255,.5);
}
.btn-ghost:hover {
  background: rgba(255,255,255,.18);
  border-color: #fff;
}


.btn-lg { padding: 14px 36px; font-size: 16px; border-radius: 10px; }


.btn-block { display: block; width: 100%; text-align: center; }


.ic-dl:before { content: "\2193 "; font-size: 1.1em; }



.hero {
  position: relative;
  background: #1E1C38;
  background-image:
    -webkit-linear-gradient(135deg, #13122A 0%, #302E5A 50%, #1E1C38 100%);
  background-image:
    linear-gradient(135deg, #13122A 0%, #302E5A 50%, #1E1C38 100%);
  padding: 100px 0 60px;
  overflow: hidden;
}

.grid-bg {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image:
    -webkit-repeating-linear-gradient(0deg, rgba(123,94,167,.06) 0, rgba(123,94,167,.06) 1px, transparent 1px, transparent 60px),
    -webkit-repeating-linear-gradient(90deg, rgba(123,94,167,.06) 0, rgba(123,94,167,.06) 1px, transparent 1px, transparent 60px);
  background-image:
    repeating-linear-gradient(0deg, rgba(123,94,167,.06) 0, rgba(123,94,167,.06) 1px, transparent 1px, transparent 60px),
    repeating-linear-gradient(90deg, rgba(123,94,167,.06) 0, rgba(123,94,167,.06) 1px, transparent 1px, transparent 60px);
  pointer-events: none;
}

.hero-inner { display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 48px; }
.hero-text { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; }


.hero-tag {
  font-size: 13px;
  color: #A78BDB;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 16px;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
}
.dot {
  display: inline-block;
  width: 8px; height: 8px;
  background: #A78BDB;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 8px #A78BDB;
  box-shadow: 0 0 8px #A78BDB;
}


.hero-title {
  font-size: 48px;
  font-weight: 800;
  color: #fff;
  line-height: 1.15;
  margin-bottom: 20px;
}
.hero-title em {
  font-style: normal;
  color: #A78BDB;
}


.hero-desc {
  font-size: 16px;
  color: #a0a0cc;
  line-height: 1.8;
  margin-bottom: 32px;
  max-width: 520px;
}
.hero-desc b { color: #fff; }


.hero-actions { display: -ms-flexbox; display: flex; gap: 14px; margin-bottom: 36px; -ms-flex-wrap: wrap; flex-wrap: wrap; }


.hero-meta { display: -ms-flexbox; display: flex; gap: 0; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.hero-meta li {
  margin-right: 32px;
  margin-bottom: 8px;
}
.hero-meta b {
  display: block;
  font-size: 26px;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
}
.hero-meta b i { font-style: normal; font-size: 16px; color: #A78BDB; }
.hero-meta span { display: block; font-size: 12px; color: #7878aa; margin-top: 2px; }


.hero-media {
  position: relative;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 45%;
  flex: 0 0 45%;
  max-width: 520px;
  width: 45%;
}
.media-glow {
  position: absolute;
  top: 50%; left: 50%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  width: 400px; height: 300px;
  background: radial-gradient(ellipse, rgba(123,94,167,.25) 0%, transparent 70%);
  pointer-events: none;
  border-radius: 50%;
}


.window {
  border-radius: 8px;
  overflow: hidden;
  -webkit-box-shadow: 0 24px 60px rgba(0,0,0,.6), 0 0 0 1px rgba(123,94,167,.3);
  box-shadow: 0 24px 60px rgba(0,0,0,.6), 0 0 0 1px rgba(123,94,167,.3);
  position: relative;
  z-index: 1;
}

.window-bar {
  background: #EEEEF8;
  border-bottom: 1px solid #ccc8e8;
  padding: 0 0 0 14px;
  height: 34px;
  line-height: 34px;
}
.wb-title { font-size: 12px; color: #302E5A; font-weight: 500; vertical-align: middle; }
.wb-controls { float: right; }
.wb-btn {
  display: inline-block;
  width: 30px;
  height: 34px;
  position: relative;
  vertical-align: middle;
  cursor: default;
}
.wb-btn:before {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
}

.wb-min:before {
  width: 11px; height: 0;
  border-top: 1px solid #302E5A;
  margin: 0 0 0 -6px;
}

.wb-max:before {
  width: 10px; height: 10px;
  border: 1px solid #302E5A;
  margin: -6px 0 0 -6px;
}

.wb-close:before {
  width: 12px; height: 0;
  border-top: 1px solid #302E5A;
  margin: 0 0 0 -6px;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.wb-close:after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 12px; height: 0;
  border-top: 1px solid #302E5A;
  margin: 0 0 0 -6px;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.wb-close:hover:before,
.wb-close:hover:after { border-top-color: #c0392b; }

.window-body {
  background: #13122A;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  width: 100%;
  height: 300px;
}
.hero-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center top;
  vertical-align: top;
}



.trustbar {
  background: #302E5A;
  padding: 14px 0;
  -webkit-box-shadow: 0 3px 12px rgba(48,46,90,.4);
  box-shadow: 0 3px 12px rgba(48,46,90,.4);
}
.trustbar .wrap { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 0; }
.trust-item {
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  padding: 4px 24px;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 6px;
  border-right: 1px solid rgba(255,255,255,.2);
}
.trust-item:last-child { border-right: none; }
.trust-ic:before {
  content: "\2713";
  font-size: 16px;
  color: #A78BDB;
  font-weight: 800;
  display: inline-block;
  width: 20px; height: 20px;
  text-align: center;
  line-height: 20px;
  background: rgba(167,139,219,.2);
  border-radius: 50%;
}


.section { padding: 72px 0; background: #F7F7FC; }
.section-alt { background: #EEEEF8; }


.sec-head { text-align: center; margin-bottom: 52px; }
.sec-eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #7B5EA7;
  margin-bottom: 10px;
}
.sec-title { font-size: 34px; font-weight: 800; color: #1E1C38; margin-bottom: 14px; }
.sec-sub { font-size: 16px; color: #3D3A6A; max-width: 640px; margin: 0 auto; }


.cards {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 28px;
}
.card {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 230px;
  flex: 1 1 230px;
  background: #fff;
  border-radius: 14px;
  border: 2px solid #d8d5f0;
  -webkit-box-shadow: 0 4px 16px rgba(48,46,90,.07);
  box-shadow: 0 4px 16px rgba(48,46,90,.07);
  -webkit-transition: -webkit-box-shadow .2s, -webkit-transform .2s, border-color .2s;
  transition: box-shadow .2s, transform .2s, border-color .2s;
  position: relative;
  overflow: hidden;
}
.card:hover {
  border-color: #7B5EA7;
  -webkit-box-shadow: 0 10px 32px rgba(123,94,167,.22);
  box-shadow: 0 10px 32px rgba(123,94,167,.22);
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
}

.card-hot {
  border-color: #7B5EA7;
  -webkit-box-shadow: 0 6px 24px rgba(123,94,167,.22);
  box-shadow: 0 6px 24px rgba(123,94,167,.22);
}
.card-inner { padding: 24px 20px 20px; }


.card-badge {
  position: absolute;
  top: 0; right: 0;
  background: #7B5EA7;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 14px;
  border-radius: 0 12px 0 10px;
  letter-spacing: .06em;
}


.card-icon { margin-bottom: 14px; }
.card-icon img {
  width: 52px; height: 52px;
  border-radius: 10px;
  object-fit: contain;
  background: #EEEEF8;
  padding: 5px;
  -webkit-box-shadow: 0 2px 8px rgba(48,46,90,.15);
  box-shadow: 0 2px 8px rgba(48,46,90,.15);
}

.card-title { font-size: 16px; font-weight: 700; color: #1E1C38; margin-bottom: 4px; }
.card-ver { font-size: 13px; color: #5A5690; margin-bottom: 12px; }


.card-rate { display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; margin-bottom: 16px; }
.stars { color: #7B5EA7; font-size: 14px; letter-spacing: 2px; }
.rate-num { font-size: 14px; font-weight: 700; color: #1E1C38; }
.rate-cnt { font-size: 12px; color: #8888aa; }


.card-note { font-size: 12px; color: #6060aa; margin-top: 10px; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 5px; }
.note-ic:before { content: "\2714"; color: #7B5EA7; font-weight: 700; }


.cards-tip { text-align: center; font-size: 14px; color: #6060aa; }
.cards-tip a { color: #7B5EA7; cursor: pointer; text-decoration: underline; }


.features {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 32px;
  margin-bottom: 64px;
}
.feature {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 220px;
  flex: 1 1 220px;
  text-align: center;
}
.feat-ic {
  width: 72px; height: 72px;
  margin: 0 auto 20px;
  border-radius: 16px;
  overflow: hidden;
  background: #d8d5f0;
  -webkit-box-shadow: 0 4px 14px rgba(48,46,90,.15);
  box-shadow: 0 4px 14px rgba(48,46,90,.15);
}
.feat-ic img { width: 100%; height: 100%; object-fit: cover; }
.feature h3 { font-size: 17px; font-weight: 700; color: #1E1C38; margin-bottom: 10px; }
.feature p { font-size: 14px; color: #3D3A6A; line-height: 1.75; }


.usecase {
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 52px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background: #302E5A;
  border-radius: 16px;
  padding: 48px 52px;
  -webkit-box-shadow: 0 8px 32px rgba(48,46,90,.25);
  box-shadow: 0 8px 32px rgba(48,46,90,.25);
}
.usecase-media {
  position: relative;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 420px;
  flex: 0 0 420px;
  max-width: 420px;
}
.uc-glow {
  position: absolute;
  top: 50%; left: 50%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  width: 300px; height: 200px;
  background: radial-gradient(ellipse, rgba(123,94,167,.2) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.usecase-media img { border-radius: 14px; -webkit-box-shadow: 0 12px 36px rgba(0,0,0,.2); box-shadow: 0 12px 36px rgba(0,0,0,.2); position: relative; z-index: 1; }
.usecase-text { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 260px; }

.usecase-title { font-size: 26px; font-weight: 800; color: #fff; margin-bottom: 20px; }
.ticks { margin-bottom: 30px; }
.ticks li {
  font-size: 15px;
  color: #d8d5f0;
  padding: 8px 0 8px 28px;
  border-bottom: 1px solid rgba(255,255,255,.15);
  position: relative;
}
.ticks li:last-child { border-bottom: none; }
.ticks li:before {
  content: "\2714";
  position: absolute;
  left: 0;
  color: #A78BDB;
  font-weight: 800;
  font-size: 14px;
}


.shots {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 20px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.shot {
  min-width: 0;
}
.shot-frame {
  border-radius: 10px;
  overflow: hidden;
  border: 2px solid #d8d5f0;
  -webkit-box-shadow: 0 4px 16px rgba(48,46,90,.1);
  box-shadow: 0 4px 16px rgba(48,46,90,.1);
  -webkit-transition: -webkit-box-shadow .2s, -webkit-transform .2s;
  transition: box-shadow .2s, transform .2s;
}
.shot-frame:hover {
  -webkit-transform: translateY(-3px);
  transform: translateY(-3px);
  -webkit-box-shadow: 0 10px 28px rgba(123,94,167,.22);
  box-shadow: 0 10px 28px rgba(123,94,167,.22);
  border-color: #7B5EA7;
}
.shot-frame img { width: 100%; height: auto; display: block; }


.faq-list { margin: 0; padding: 0; }
.faq-item {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 14px;
  border: 1px solid #ccc8e8;
  border-left: 4px solid #7B5EA7;
  -webkit-box-shadow: 0 3px 14px rgba(48,46,90,.09);
  box-shadow: 0 3px 14px rgba(48,46,90,.09);
  background: #fff;
  -webkit-transition: border-color .2s, -webkit-box-shadow .2s;
  transition: border-color .2s, box-shadow .2s;
}
.faq-item:hover {
  -webkit-box-shadow: 0 6px 22px rgba(123,94,167,.18);
  box-shadow: 0 6px 22px rgba(123,94,167,.18);
}
.faq-q {
  padding: 18px 22px;
  font-size: 15px;
  font-weight: 600;
  color: #1E1C38;
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: -webkit-linear-gradient(left, #F2F1FC 0%, #fff 60%);
  background: linear-gradient(to right, #F2F1FC 0%, #fff 60%);
  -webkit-transition: background .2s, color .2s;
  transition: background .2s, color .2s;
}
.faq-q:hover {
  background: -webkit-linear-gradient(left, #e8e6f8 0%, #f5f5fd 60%);
  background: linear-gradient(to right, #e8e6f8 0%, #f5f5fd 60%);
}
.faq-arrow {
  display: inline-block;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: #7B5EA7;
  position: relative;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-shadow: 0 2px 6px rgba(123,94,167,.4);
  box-shadow: 0 2px 6px rgba(123,94,167,.4);
  -webkit-transition: background .2s, -webkit-transform .2s;
  transition: background .2s, transform .2s;
}
.faq-arrow:before {
  content: "+";
  position: absolute;
  top: 50%; left: 50%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
}
.faq-a {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height .22s ease-out;
  transition: max-height .22s ease-out;
  background: -webkit-linear-gradient(left, #F2F1FC 0%, #fafafd 100%);
  background: linear-gradient(to right, #F2F1FC 0%, #fafafd 100%);
  border-top: 1px solid #d8d5f0;
}
.faq-a p {
  padding: 0 24px 18px;
  font-size: 14px;
  color: #2A2860;
  line-height: 1.85;
  margin: 0;
}

.faq-item.open {
  border-left-color: #302E5A;
  -webkit-box-shadow: 0 6px 24px rgba(48,46,90,.18);
  box-shadow: 0 6px 24px rgba(48,46,90,.18);
}
.faq-item.open .faq-q {
  background: -webkit-linear-gradient(left, #302E5A 0%, #4A3F8C 100%);
  background: linear-gradient(to right, #302E5A 0%, #4A3F8C 100%);
  color: #fff;
}
.faq-item.open .faq-arrow {
  background: rgba(255,255,255,.2);
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.faq-item.open .faq-arrow:before { content: "+"; color: #A78BDB; }
.faq-item.open .faq-a { max-height: 280px; }
.faq-item.open .faq-a p { padding-top: 16px; }



.cta {
  position: relative;
  padding: 72px 0;
  background: #1E1C38;
  background-image:
    -webkit-linear-gradient(135deg, #13122A 0%, #302E5A 55%, #13122A 100%);
  background-image:
    linear-gradient(135deg, #13122A 0%, #302E5A 55%, #13122A 100%);
  overflow: hidden;
  text-align: center;
}
.cta-glow {
  position: absolute;
  top: 50%; left: 50%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  width: 600px; height: 300px;
  background: radial-gradient(ellipse, rgba(123,94,167,.28) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.cta-inner { position: relative; z-index: 1; }
.cta-title { font-size: 36px; font-weight: 800; color: #fff; margin-bottom: 12px; }
.cta-sub { font-size: 16px; color: #a0a0cc; margin-bottom: 32px; }


.site-footer {
  background: #1E1C38;
  color: #a0a0cc;
}
.footer-inner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 40px;
  padding-top: 52px;
  padding-bottom: 40px;
}
.foot-col { -webkit-box-flex: 1; -ms-flex: 1 1 180px; flex: 1 1 180px; }
.foot-about { -webkit-box-flex: 2; -ms-flex: 2 1 280px; flex: 2 1 280px; }
.foot-logo {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 14px;
}
.foot-logo b { color: #A78BDB; }
.foot-col p { font-size: 14px; color: #7878aa; line-height: 1.75; }
.foot-col h4 { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 16px; text-transform: uppercase; letter-spacing: .08em; }
.foot-col ul li { margin-bottom: 10px; }
.foot-col ul li a { font-size: 14px; color: #7878aa; -webkit-transition: color .2s; transition: color .2s; }
.foot-col ul li a:hover { color: #A78BDB; text-decoration: none; }

.footer-bottom {
  background: #13122A;
  padding: 18px 0;
  text-align: center;
}
.footer-bottom p { font-size: 12px; color: #4A4880; margin: 4px 0; }
.copyright { color: #3A3870 !important; }


.reviews {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 24px 1fr 24px 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.review-item {
  -webkit-box-flex: 0;
  -ms-flex: none;
  flex: none;
  background: #fff;
  border-radius: 14px;
  border: 1px solid #d8d5f0;
  -webkit-box-shadow: 0 4px 18px rgba(48,46,90,.08);
  box-shadow: 0 4px 18px rgba(48,46,90,.08);
  padding: 28px 26px 22px;
  -webkit-transition: -webkit-box-shadow .2s, -webkit-transform .2s, border-color .2s;
  transition: box-shadow .2s, transform .2s, border-color .2s;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.review-item:hover {
  border-color: #7B5EA7;
  -webkit-box-shadow: 0 8px 28px rgba(123,94,167,.2);
  box-shadow: 0 8px 28px rgba(123,94,167,.2);
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
}

.review-body {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin-bottom: 20px;
  position: relative;
  padding-top: 10px;
}

.review-body:before {
  content: "\201C";
  position: absolute;
  top: -8px;
  left: -4px;
  font-size: 52px;
  color: #7B5EA7;
  opacity: .2;
  font-family: Georgia, serif;
  line-height: 1;
}
.review-text {
  font-size: 14px;
  color: #2A2860;
  line-height: 1.85;
  margin: 0;
}

.review-footer {
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
  border-top: 1px solid #e8e6f8;
  padding-top: 16px;
}

.review-avatar {
  display: inline-block;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #302E5A;
  color: #A78BDB;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  line-height: 42px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-shadow: 0 2px 8px rgba(48,46,90,.3);
  box-shadow: 0 2px 8px rgba(48,46,90,.3);
}
.review-info {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2px;
}
.review-name {
  font-size: 14px;
  font-weight: 700;
  color: #1E1C38;
  display: block;
}
.review-role {
  font-size: 12px;
  color: #6060aa;
  display: block;
}
.review-stars {
  font-size: 14px;
  color: #7B5EA7;
  letter-spacing: 2px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}


.back-top {
  position: fixed;
  right: 28px; bottom: 28px;
  width: 44px; height: 44px;
  background: #7B5EA7;
  color: #fff;
  border-radius: 50%;
  display: none;
  -webkit-box-shadow: 0 4px 14px rgba(123,94,167,.5);
  box-shadow: 0 4px 14px rgba(123,94,167,.5);
  -webkit-transition: background .2s, -webkit-transform .2s;
  transition: background .2s, transform .2s;
  z-index: 888;
  font-size: 20px;
  text-decoration: none;
}
.back-top:before {
  content: "\2191";
  color: #fff;
  display: block;
  text-align: center;
  line-height: 44px;
  width: 44px;
  height: 44px;
  font-size: 20px;
}
.back-top:hover { background: #5C3D8F; -webkit-transform: translateY(-3px); transform: translateY(-3px); text-decoration: none; }
.back-top.show { display: block; }


.toast {
  position: fixed;
  bottom: 80px; left: 50%;
  -webkit-transform: translateX(-50%) translateY(20px);
  transform: translateX(-50%) translateY(20px);
  background: #1E1C38;
  color: #A78BDB;
  border: 1px solid #302E5A;
  padding: 12px 28px;
  border-radius: 28px;
  font-size: 14px;
  font-weight: 500;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity .3s, -webkit-transform .3s;
  transition: opacity .3s, transform .3s;
  z-index: 9999;
  white-space: nowrap;
}
.toast.show {
  opacity: 1;
  -webkit-transform: translateX(-50%) translateY(0);
  transform: translateX(-50%) translateY(0);
}


@media (max-width: 960px) {
  .hero-inner { -ms-flex-direction: column; flex-direction: column; text-align: center; }
  .hero-title { font-size: 36px; }
  .hero-media { -webkit-box-flex: 0; -ms-flex: none; flex: none; width: 100%; max-width: 480px; }
  .hero-actions { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .hero-meta { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .hero-desc { margin-left: auto; margin-right: auto; }
}
@media (max-width: 768px) {
  .site-header { height: 58px; }
  .header-inner { height: 58px; }
  .main-nav { display: none; }
  .hero { padding: 84px 0 48px; }
  .hero-title { font-size: 30px; }
  .usecase { -ms-flex-direction: column; flex-direction: column; }
  .usecase-media { -webkit-box-flex: 0; -ms-flex: none; flex: none; width: 100%; max-width: 100%; }
  .sec-title { font-size: 26px; }
  .cta-title { font-size: 26px; }
  .shot { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; }
  .footer-inner { gap: 24px; }
  .reviews { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .hero-title { font-size: 26px; }
  .btn-lg { padding: 12px 24px; font-size: 14px; }
  .hero-actions { -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .trust-item { border-right: none; padding: 4px 12px; font-size: 13px; }
  .card { -webkit-box-flex: 0; -ms-flex: 0 0 calc(50% - 12px); flex: 0 0 calc(50% - 12px); }
  .reviews { grid-template-columns: 1fr; }
}