/* Responsive additions to the preserved public site styles.
   Desktop layouts at 1400px and above retain the original composition. */
.mobile-menu-toggle { display: none; }

@media (max-width: 1399px) {
  html, body { min-width: 0 !important; width: 100%; }
  body #app .container { width: calc(100% - 48px); max-width: 1400px; }
  body #app .header .nav-item { width: auto; padding: 0 14px; font-size: 16px; }
  body #app .header .logo { width: 44px; height: 44px; }
  body #app .header .txt { font-size: 24px; white-space: nowrap; }
  body #app .intro-wrap .desc4 { width: calc(100% - 64px); }
  body #app .intro-wrap .desc4 .name { max-width: 49%; font-size: 30px; }
  body #app .advantage-box .item { width: 30%; margin: 0; }
  body #app .advantage-box .item:nth-child(-n+3) { left: 0; }
  body #app .advantage-box .item:nth-child(n+4) { left: 70%; }
  body #app .advantage-box .item .desc { line-height: 27px; font-size: 15px; }
  body #app .package-wrap .package-box { align-items: stretch; }
  body #app .package-wrap .package-box .item { width: calc(25% - 24px); margin: 12px; }
  body #app .package-wrap .package-box .item .package-detail { padding: 28px 20px; }
  body #app .package-wrap .package-box .item .package-detail .txt-box { height: auto; min-height: 260px; }
  body #app .serve-wrap .serve-box .item { padding: 36px 30px; }
  body #app .slogan-wrap .txt { font-size: 32px; text-align: center; }
  body #app .content[data-v-f78d213e] { min-width: 0; }
  body #app .content[data-v-f78d213e] .wrap { align-items: flex-start; }
  body #app .content[data-v-f78d213e] .wrap > img { width: 54%; max-width: 630px; height: auto; margin-right: 28px; }
  body #app .content[data-v-f78d213e] .wrap > div { min-width: 0; flex: 1; }
  body #app .content[data-v-f78d213e] .wrap .title { font-size: 24px; }
  body #app .footer-content > div { gap: 24px; }
  body #app .sidebar-warp { right: 8px; width: 66px; padding: 5px 8px; }
  body #app .sidebar-warp .item { padding: 11px 0; }
  body #app .sidebar-warp .item .txt { font-size: 12px; }
  body #app .sidebar-warp .item .img { width: 26px; height: 26px; }
}

@media (max-width: 1000px) {
  body #app .container { width: calc(100% - 32px); }
  body #app .header-wrap { z-index: 100; }
  body #app .header { height: 72px; gap: 12px; }
  body #app .header .logo { width: 36px; height: 36px; }
  body #app .header .txt { font-size: 21px; margin-left: 6px; }
  body #app .header .btn { font-size: 14px; white-space: nowrap; }
  body #app .header .reg-btn { padding: 9px 12px; margin-left: 12px; }
  body #app .header .send-tip { display: none; }
  body #app .header > div:has(.send-tip) { margin-left: auto; }
  body #app .header .nav-wrap {
    display: none; position: absolute; top: 72px; left: 0; right: 0;
    background: white; border-top: 1px solid #eef2f8;
    box-shadow: 0 10px 18px rgb(34 73 124 / 9%); padding: 8px 16px 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px;
  }
  body #app .header .nav-item { height: 44px; line-height: 44px; padding: 0 5px; font-size: 15px; border-radius: 5px; }
  body #app .header .nav-item.active { background: #eef5ff; }
  body #app .header .nav-item img { width: 15px; height: 15px; }
  body #app .header .nav-layout { top: 44px; }
  body #app .header-wrap.mobile-nav-open .nav-wrap { display: grid; }
  body #app .mobile-menu-toggle {
    display: grid; place-items: center; flex: 0 0 36px;
    width: 36px; height: 36px; padding: 0; border: 1px solid #e2eafb;
    border-radius: 5px; color: #2468f2; background: #f6f9ff;
    font: 21px/1 Arial, sans-serif; cursor: pointer;
  }
  body #app .intro-wrap { margin-top: 72px; }
  body #app .intro-wrap .el-carousel__container { height: 360px !important; }
  body #app .intro-wrap .name { font-size: 28px; }
  body #app .intro-wrap .desc4 .name { font-size: 26px; max-width: 53%; line-height: 1.6; }
  body #app .intro-wrap .desc4 .btn-wrap .btn { width: 125px; margin-right: 16px; margin-top: 26px; font-size: 16px; }
  body #app .intro-wrap .desc2 { width: calc(100% - 64px); }
  body #app .intro-wrap .desc2 .desc2-box { width: 600px; max-width: 100%; }
  body #app .intro-wrap .desc2 .desc2-box .item-box .item { width: calc(100% - 24px); font-size: 16px; }
  body #app .intro-wrap .desc3 { width: calc(100% - 64px); }
  body #app .intro-wrap .desc3 .name { margin-top: 0; }
  body #app .intro-wrap .desc3 .desc3-box { margin-top: 24px; gap: 10px; }
  body #app .box { padding: 48px 0; }
  body #app .box .title { font-size: 28px; }
  body #app .box .sub-title { max-width: 100%; font-size: 16px; margin-bottom: 24px; }
  body #app .advantage-wrap video { max-width: calc(100% - 48px); height: auto; max-height: 430px; box-sizing: border-box; }
  body #app .advantage-box { background-position: center; }
  body #app .advantage-box .advantage-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; height: auto; }
  body #app .advantage-box .item { position: static; width: auto; margin: 0; padding: 20px; border-radius: 8px; background: rgb(255 255 255 / 85%); }
  body #app .advantage-box .item .name, body #app .advantage-box .item .desc { text-align: left !important; }
  body #app .advantage-box .item .name { font-size: 18px; }
  body #app .package-wrap .package-box { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  body #app .package-wrap .package-box .item { width: auto; margin: 0; }
  body #app .package-wrap .package-box .item .package-detail .txt-box { min-height: 240px; }
  body #app .package-wrap .package-box .item .package-detail .txt-box p { line-height: 30px; }
  body #app .serve-wrap .serve-box { gap: 20px; align-items: stretch; }
  body #app .serve-wrap .serve-box .item { width: calc(33.333% - 14px); padding: 26px 20px; }
  body #app .serve-wrap .serve-box .item .txt { line-height: 26px; }
  body #app .slogan-wrap { padding: 60px 0; }
  body #app .slogan-wrap .txt { font-size: 28px; line-height: 1.6; }
  body #app .slogan-wrap .slogan-content { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px 20px; margin-top: 36px; }
  body #app .slogan-wrap .slogan-content .item { width: calc(33.333% - 20px); }
  body #app .slogan-wrap .slogan-content .name { font-size: 30px; }
  body #app .package-wrap[data-v-8ddc60be], body #app .help-wrap { margin-top: 72px; }
  body #app .package-wrap .radio-group { margin: 30px auto; }
  body #app .tips { margin: 24px 0; }
  body #app .tips .title { font-size: 17px; }
  body #app .membership { padding: 48px 0; }
  body #app .membership .list { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body #app .membership .list .row { min-width: 650px; }
  body #app .membership .title { font-size: 28px; }
  body #app .membership .sub-title { max-width: 100%; }
  body #app .crumbs { padding: 16px; margin: 16px auto; font-size: 14px; }
  body #app .crumbs + .container > .flex { flex-direction: column; }
  body #app .nav[data-v-f78d213e] { display: flex; width: 100%; flex: auto; overflow-x: auto; gap: 4px; margin-bottom: 18px; padding-bottom: 6px; }
  body #app .nav[data-v-f78d213e] > a { flex: 0 0 auto; }
  body #app .nav[data-v-f78d213e] .item { padding: 12px 15px; margin: 0; border-radius: 5px; background: #f7f9fc; font-size: 14px; }
  body #app .content[data-v-f78d213e] { width: 100%; padding: 0 0 32px; min-height: 0; }
  body #app .content[data-v-f78d213e] .wrap { gap: 24px; }
  body #app .content[data-v-f78d213e] .wrap > img { width: 50%; margin: 0; }
  body #app .content[data-v-f78d213e] .wrap .title { margin-top: 12px; font-size: 23px; }
  body #app .content[data-v-f78d213e] .wrap .txt { line-height: 29px; margin-bottom: 16px; }
  body #app .help-wrap { padding: 36px 0; min-height: calc(100vh - 72px); }
  body #app .help-wrap .help-box { padding: 28px 24px; }
  body #app .help-wrap .title { font-size: 30px; }
  body #app .tab .tab-item { font-size: 18px; line-height: 1.6; }
  body #app .tab .tab-content-item { padding: 18px; overflow-wrap: anywhere; }
  body #app .tab .tab-content-item img, body #app .tab .tab-content-item video, body #app .tab .tab-content-item iframe { max-width: 100%; height: auto; }
  body #app .page-content .content { height: auto; min-height: calc(100vh - 72px); padding: 40px 0; box-sizing: border-box; }
  body #app .page-content .content .left-img-wrap { width: 43%; flex: 0 0 43%; }
  body #app .page-content .content .login-warp { width: 52%; padding: 28px; border-radius: 20px; }
  body #app .page-content .content .login-title { font-size: 25px; margin-bottom: 30px; }
  body #app .footer-content { padding: 40px 0; }
  body #app .footer-content > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
  body #app .footer-content .logo-wrap { grid-column: 1 / -1; }
  body #app .sidebar-warp { position: static; width: calc(100% - 32px); margin: 24px auto 0; padding: 7px 12px; flex-direction: row; justify-content: space-around; }
  body #app .sidebar-warp > a { flex: 1; }
  body #app .sidebar-warp a:not(:last-child) .item { border-bottom: 0; border-right: 1px solid rgb(255 255 255 / 30%); }
  body #app .sidebar-warp .item .layout { right: auto; left: 50%; top: auto; bottom: 100%; transform: translateX(-50%); }
  body #app .sidebar-warp .item .img { width: 24px; height: 24px; margin-bottom: 6px; }
  body #app .sidebar-warp .item .txt { font-size: 12px; }
  body #app .el-dialog { width: min(560px, calc(100% - 32px)) !important; margin-top: 10vh !important; }
  body #app .el-message-box { width: min(420px, calc(100% - 32px)); box-sizing: border-box; }
  body #app .el-dialog__body { padding: 22px; overflow-wrap: anywhere; }
  body #app .el-message { max-width: calc(100vw - 24px); min-width: 0; }
  body #app .el-message__content { line-height: 1.6; overflow-wrap: anywhere; }
}

@media (max-width: 600px) {
  body #app .header { gap: 8px; }
  body #app .header .logo { width: 32px; height: 32px; }
  body #app .header .txt { font-size: 20px; }
  body #app .header .btn { font-size: 13px; }
  body #app .header .reg-btn { margin-left: 8px; padding: 8px 10px; }
  body #app .header .nav-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body #app .intro-wrap .el-carousel__container { height: 400px !important; }
  body #app .intro-wrap .intro-item { background: #e8f2ff; align-items: flex-start; }
  body #app .intro-wrap .intro-item > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 64% center; opacity: .23; }
  body #app .intro-wrap .desc4, body #app .intro-wrap .desc2, body #app .intro-wrap .desc3 { z-index: 1; position: relative; width: calc(100% - 48px); margin: 0; padding: 44px 0 30px; }
  body #app .intro-wrap .name, body #app .intro-wrap .desc4 .name { max-width: 100%; font-size: 26px; line-height: 1.6; margin-bottom: 12px; text-align: left; }
  body #app .intro-wrap .desc4 .btn-wrap { flex-wrap: wrap; gap: 12px; }
  body #app .intro-wrap .desc4 .btn-wrap .btn { width: 132px; margin: 24px 0 0; padding: 11px 0; font-size: 16px; }
  body #app .intro-wrap .desc2 { padding-top: 25px; }
  body #app .intro-wrap .desc2 .name { font-size: 22px; text-align: center; line-height: 1.5; }
  body #app .intro-wrap .desc2 .subname { font-size: 15px; margin-bottom: 14px; }
  body #app .intro-wrap .desc2 .desc2-box .item-box { margin: 6px 0; }
  body #app .intro-wrap .desc2 .desc2-box .item-box .item { width: calc(100% - 8px); font-size: 12px; padding: 9px 0; }
  body #app .intro-wrap .desc2 .reg-btn { margin-top: 18px; }
  body #app .intro-wrap .desc3 { padding-top: 32px; }
  body #app .intro-wrap .desc3 .name { font-size: 26px; text-align: center; }
  body #app .intro-wrap .desc3 .desc3-box { flex-direction: column; gap: 12px; margin-top: 20px; }
  body #app .intro-wrap .desc3 .desc3-box .item-box { margin: 0; }
  body #app .intro-wrap .desc3 .desc3-box .item-box .item { font-size: 13px; line-height: 1.6; padding: 8px 12px; border-radius: 8px; }
  body #app .intro-wrap .desc1 { z-index: 1; width: 100%; }
  body #app .intro-wrap .desc1 .reg-btn { margin-top: 300px; }
  body #app .intro-wrap .el-carousel__arrow { width: 28px; height: 28px; }
  body #app .intro-wrap .el-carousel__arrow--left { left: 3px; }
  body #app .intro-wrap .el-carousel__arrow--right { right: 3px; }
  body #app .box { padding: 36px 0; }
  body #app .box .title, body #app .membership .title { font-size: 26px; }
  body #app .box .sub-title { line-height: 30px; margin-bottom: 20px; }
  body #app .advantage-wrap video { max-width: calc(100% - 32px); border-width: 5px; }
  body #app .advantage-box .advantage-list { grid-template-columns: 1fr; gap: 14px; }
  body #app .advantage-box .item { padding: 20px; }
  body #app .advantage-box .item .desc { font-size: 14px; line-height: 27px; }
  body #app .package-wrap .package-box { grid-template-columns: 1fr; gap: 18px; }
  body #app .package-wrap .package-box .item .package-detail { padding: 26px; }
  body #app .package-wrap .package-box .item .package-detail .price { margin-bottom: 18px; }
  body #app .package-wrap .package-box .item .package-detail .txt-box { height: auto; min-height: 0; }
  body #app .package-wrap .package-box .item .package-detail .txt-box p { line-height: 32px; }
  body #app .package-wrap .radio-group { width: 100%; margin: 24px auto; border-radius: 8px; background: #d5e5ff; overflow: hidden; }
  body #app .package-wrap .radio-group .el-radio-button { flex: 1; min-width: 0; }
  body #app .package-wrap .radio-group .el-radio-button .el-radio-button__inner { width: 100%; margin: 0; height: 46px; line-height: 46px; background: transparent; font-size: 13px; border-radius: 0; }
  body #app .package-wrap .radio-group .el-radio-button .el-radio-button__orig-radio:checked + .el-radio-button__inner { background: #0263ff; }
  body #app .tips { font-size: 13px; line-height: 24px; }
  body #app .tips .title { font-size: 16px; line-height: 1.6; }
  body #app .serve-wrap .serve-box { display: grid; grid-template-columns: 1fr; gap: 18px; }
  body #app .serve-wrap .serve-box .item { width: auto; padding: 30px; }
  body #app .serve-wrap .serve-box .item .txt { min-height: 0; margin-top: 20px; }
  body #app .slogan-wrap .txt { font-size: 25px; }
  body #app .slogan-wrap .slogan-content { gap: 28px 12px; font-size: 14px; }
  body #app .slogan-wrap .slogan-content .item { width: calc(50% - 12px); }
  body #app .slogan-wrap .slogan-content .name { font-size: 28px; margin-bottom: 10px; }
  body #app .content[data-v-f78d213e] .wrap { flex-direction: column; gap: 18px; }
  body #app .content[data-v-f78d213e] .wrap > img { width: 100%; max-width: 100%; }
  body #app .content[data-v-f78d213e] .wrap .title { font-size: 24px; margin: 0 0 22px; }
  body #app .content[data-v-f78d213e] .wrap .txt { font-size: 15px; }
  body #app .help-wrap .help-box { padding: 24px 18px; }
  body #app .help-wrap .title { font-size: 28px; }
  body #app .tab .tab-item { font-size: 16px; padding: 18px 0; }
  body #app .tab .tab-content-item { padding: 16px; font-size: 14px; line-height: 28px; }
  body #app .page-content .content { padding: 28px 0 44px; align-items: flex-start; }
  body #app .page-content .content > .container { flex-direction: column; gap: 20px; }
  body #app .page-content .content .left-img-wrap { display: none; }
  body #app .page-content .content .login-warp { width: 100%; padding: 30px 24px; border-radius: 16px; }
  body #app .page-content .content .login-title { font-size: 25px; }
  body #app .page-content .content .el-form-item { margin-bottom: 24px; }
  body #app .page-content .content .el-input__inner { font-size: 15px; }
  body #app .page-content .content .el-checkbox__label { font-size: 12px; white-space: normal; }
  body #app .footer-content > div { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 18px; }
  body #app .footer-content .item .title { font-size: 15px; }
  body #app .footer-content .item .txt { font-size: 13px; }
  body #app .copyright-wrap { font-size: 12px; padding: 15px 16px; }
  body #app .el-dialog__body { padding: 18px; }
  body #app .captcha-row { gap: 8px; }
  body #app .captcha-image { width: 105px; }
}

@media (prefers-reduced-motion: reduce) {
  .el-carousel__item { transition-duration: 0.01ms !important; }
}

.clone-badge{position:fixed;bottom:12px;left:12px;z-index:3000;border:1px solid #d8e6ff;border-radius:20px;background:rgba(255,255,255,.95);color:#5273a0;padding:6px 12px;font:12px/1.5 "Microsoft YaHei",sans-serif;box-shadow:0 2px 10px #124f9620;cursor:pointer}
.clone-dialog{position:fixed;inset:0;z-index:4000;background:#132f5680;display:grid;place-items:center;padding:24px;box-sizing:border-box}
.clone-dialog[hidden]{display:none}
.clone-dialog-panel{box-sizing:border-box;position:relative;width:440px;max-width:100%;border-radius:14px;background:#fff;padding:30px;box-shadow:0 20px 80px #08295940;color:#333;font:15px/1.8 "Microsoft YaHei",sans-serif}
.clone-dialog-panel h2{font-size:22px;font-weight:700;margin:0 32px 14px 0}.clone-dialog-panel p{margin:10px 0}.clone-dialog-panel a{color:#2468f2}.clone-dialog-close{position:absolute;top:12px;right:14px;background:none;border:0;font-size:26px;color:#6c7c94;cursor:pointer}.clone-dialog-panel .contact-action{display:block;text-align:center;background:#2468f2;color:white;border-radius:5px;padding:9px;margin:20px 0 4px}.clone-demo-note{font-size:12px;color:#7c889b;line-height:1.6;text-align:center;margin:14px 0 0}
:focus-visible{outline:3px solid #76aaff!important;outline-offset:4px}
.mobile-menu-toggle{display:none}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(max-width:600px){.clone-badge{font-size:10px;bottom:8px;left:8px;padding:4px 9px}.clone-dialog-panel{padding:24px}}
/* Element UI mounts message boxes next to #app, so these rules belong on body. */
@media(max-width:1000px){body .el-message-box{width:calc(100% - 32px);max-width:420px;box-sizing:border-box}body .el-message{max-width:calc(100vw - 24px);min-width:0}body .el-message__content{line-height:1.6;overflow-wrap:anywhere}body .el-dialog{width:calc(100% - 32px)!important;max-width:560px;margin-top:10vh!important}}
@media(max-width:600px){body #app .intro-wrap .desc4 .name{text-wrap:balance;font-size:24px}body #app .intro-wrap .desc4 .name:first-child{max-width:300px}body #app .intro-wrap .desc4 .name:nth-child(2){font-size:23px}body #app .intro-wrap .desc4 .btn-wrap{display:flex;flex-wrap:nowrap;gap:12px}}