@charset "utf-8";
.hb-symbols { display:none; }

.hb-hero, .hb-hero *, .hb-uploaded, .hb-uploaded * { box-sizing:border-box; }

.hb-hero[hidden], .hb-uploaded[hidden], .hb-uploaded [hidden] { display:none !important; }

.hb-hero { color:#1b3151; font:14px/1.6 "Microsoft YaHei","PingFang SC",Arial,sans-serif; text-align:left; }

.hb-hero :where(h1,h2,h3,p) { margin:0; }
.hb-hero h1 em { font-weight:inherit; }

.hb-hero a { text-decoration:none; }

.hb-icon { display:block; flex-shrink:0; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }

.hb-hero a:focus-visible, .hb-uploaded a:focus-visible, .hb-uploaded button:focus-visible { outline:3px solid #8db6f3; outline-offset:3px; }

.hb-hero{position:relative;width:100%;overflow:clip;isolation:isolate}
.hb-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:52px;width:calc(100% - 128px);max-width:1380px;min-height:490px;margin:0 auto;padding:38px 0 70px}
.hb-hero-eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:19px;color:#6687b8;font-size:12px;letter-spacing:2px}
.hb-hero-eyebrow:before{content:"";width:24px;height:2px;background:#4d89e2}
.hb-hero h1{font-size:clamp(35px,3.25vw,52px);line-height:1.4;font-weight:650;letter-spacing:1px;color:#1b3458}
.hb-hero h1 em{font-style:normal;color:#277cf2}
.hb-hero-description{margin-top:19px;color:#728aab;font-size:14px;line-height:2}
.hb-hero-actions{display:flex;align-items:center;gap:12px;margin-top:27px}
.hb-hero-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:44px;min-width:140px;padding:0 20px;border:1px solid #d6e3f7;border-radius:6px;background:#fff;color:#5679aa;font-size:13px}
.hb-hero-button.hb-primary{border-color:#2477f3;background:#2477f3;color:#fff;box-shadow:0 5px 15px #2477f327}
.hb-hero-button.hb-primary:hover{background:#1769e0}
.hb-hero-button:hover{border-color:#a5c6f6}
.hb-hero-button .hb-icon{width:16px;height:16px}
.hb-full-hero{background:linear-gradient(110deg,#eff5ff 0%,#f8fbff 43%,#e5f0ff 100%)}
.hb-full-hero:before{content:"";position:absolute;left:53%;top:-55%;width:1000px;height:1000px;border:1px solid #b7d3ff42;border-radius:50%;box-shadow:0 0 0 80px #fff2,0 0 0 160px #b9d4ff0c}
.hb-full-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#d8e6fa}
.hb-grid-field{position:absolute;inset:0;background-image:linear-gradient(#80a7db0b 1px,transparent 1px),linear-gradient(90deg,#80a7db0b 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(90deg,transparent 40%,#000 100%);pointer-events:none}
.hb-float-formula{position:absolute;z-index:0;color:#8fb2e538;font:italic 37px Georgia,serif;pointer-events:none}
.hb-formula-one{right:7%;top:15%;transform:rotate(8deg)}
.hb-formula-two{right:38%;bottom:22%;font-size:25px}
.hb-visual{position:relative;min-width:0;max-width:610px;width:100%;height:355px;margin:0 auto}
.hb-visual-shadow{position:absolute;left:10%;right:3%;height:60px;bottom:-12px;background:#6e9ee225;filter:blur(24px);border-radius:50%}
.hb-sheet{position:absolute;left:12%;top:1%;width:62%;height:330px;border:1px solid #d4e2f6;border-radius:12px;background:#fff;box-shadow:0 15px 40px #315d9b16;transform:rotate(-4deg);padding:24px}
.hb-sheet:before{content:"";position:absolute;inset:0;z-index:-1;border:1px solid #d9e6f8;border-radius:12px;transform:rotate(7deg);background:#fbfdff}
.hb-sheet-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:17px;border-bottom:1px solid #e9eff8}
.hb-sheet-title{color:#355b91;font-size:15px;font-weight:500}
.hb-sheet-mark{padding:3px 6px;border-radius:4px;background:#eff5ff;color:#82a4d6;font-size:9px}
.hb-sheet-name{margin-top:19px;color:#6e86a7;font-size:12px}
.hb-sheet-question{margin-top:12px;color:#456995;font-size:13px;line-height:1.9}
.hb-sheet-options{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:18px;color:#8c9fb8;font-size:10px}
.hb-sheet-rule{height:4px;background:#edf2f9;border-radius:2px;margin-top:19px}
.hb-sheet-rule.hb-short{width:66%;margin-top:9px}
.hb-sheet-foot{margin-top:22px;font-size:9px;color:#adbbce}
.hb-floating-card{position:absolute;right:0;top:66px;width:43%;padding:20px 19px;border:1px solid #dae7f9;border-radius:11px;background:#fffffffa;box-shadow:0 13px 35px #466fab19;transform:rotate(3deg)}
.hb-floating-card h3{font-size:13px;color:#6384b0;font-weight:500;margin-bottom:14px}
.hb-floating-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #edf2f9;color:#91a6c1;font-size:11px}
.hb-floating-row b{font-weight:500;color:#5e90d2}
.hb-floating-total{display:flex;align-items:center;gap:7px;margin-top:16px;color:#7298cc;font-size:10px}
.hb-checkmark{display:grid;place-items:center;flex:0 0 18px;width:18px;height:18px;border-radius:50%;background:#e9f3ee;color:#85ad99;font-size:11px}
.hb-mini-tag{position:absolute;left:1%;bottom:9px;display:flex;align-items:center;gap:9px;padding:12px 16px;border:1px solid #d7e6fa;border-radius:8px;background:#fff;box-shadow:0 8px 25px #3d69a915;color:#7896bd;font-size:11px;transform:rotate(-2deg)}
.hb-mini-tag .hb-icon{color:#8aaee2;width:18px;height:18px}


.hb-hero-footer { position:absolute; z-index:3; bottom:21px; left:50%; display:flex; align-items:center; justify-content:space-between; gap:25px; width:calc(100% - 128px); max-width:1380px; transform:translateX(-50%); color:#90a6c5; font-size:11px; }
.hb-hero-footer > div { display:flex; align-items:center; gap:22px; }
.hb-hero-footer > div > span { display:inline-flex; align-items:center; gap:8px; }
.hb-hero-footer > div > span::before { content:""; display:block; width:4px; height:4px; border-radius:50%; background:#9bbbe7; }
.hb-uploaded { position:relative; isolation:isolate; width:100%; overflow:clip; background:#edf3fb; font:14px/1.6 "Microsoft YaHei","PingFang SC",Arial,sans-serif; }
.hb-slide { position:relative; width:100%; height:clamp(260px,20.834vw,560px); overflow:hidden; background:#eef3fb; }
.hb-image-backdrop { position:absolute; inset:-35px; display:block; width:calc(100% + 70px); max-width:none; height:calc(100% + 70px); object-fit:cover; filter:blur(30px); opacity:.4; pointer-events:none; }
.hb-poster { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.hb-poster > a { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.hb-image { display:block; width:auto; height:auto; max-width:min(100%,1920px); max-height:100%; object-fit:contain; }
.hb-prev, .hb-next { position:absolute; z-index:3; top:50%; display:grid; place-items:center; width:40px; height:40px; margin:0; padding:0; border:1px solid #d0def3; border-radius:50%; background:#ffffffdf; box-shadow:0 3px 16px #23456b10; color:#5d84b8; cursor:pointer; transform:translateY(-50%); }
.hb-prev { left:clamp(16px,3vw,48px); }
.hb-next { right:clamp(16px,3vw,48px); }
.hb-prev:hover, .hb-next:hover { background:#fff; color:#2477f3; }
.hb-prev > .hb-icon, .hb-next > .hb-icon { width:18px; height:18px; }
.hb-upload-controls { position:absolute; z-index:3; bottom:14px; left:50%; display:flex; align-items:center; justify-content:center; gap:12px; max-width:calc(100% - 40px); padding:4px 12px; border:1px solid #dce6f5; border-radius:22px; background:#fffffff0; box-shadow:0 3px 16px #23456b10; transform:translateX(-50%); color:#7791b5; }
.hb-dots { display:flex; align-items:center; max-width:55vw; overflow-x:auto; scrollbar-width:thin; }
.hb-dot { display:grid; flex:0 0 28px; place-items:center; width:28px; height:25px; padding:0; border:0; border-radius:0; background:transparent; cursor:pointer; }
.hb-dot::before { content:""; width:7px; height:7px; border-radius:4px; background:#c4d5ed; }
.hb-dot[aria-current="true"]::before { width:20px; background:#6e9fe6; }
.hb-position { font:11px/1.6 Arial,sans-serif; white-space:nowrap; }
.hb-pause { height:26px; margin:0; padding:0 5px; border:0; border-radius:4px; background:transparent; color:#6488b8; font:11px/1.6 "Microsoft YaHei",sans-serif; cursor:pointer; white-space:nowrap; }
@media (min-width:2200px) {
    .hb-hero-inner, .hb-hero-footer { max-width:1800px; }
    .hb-full-hero .hb-hero-inner { min-height:620px; gap:95px; padding-bottom:90px; }
    .hb-full-hero h1 { font-size:69px; }
    .hb-full-hero .hb-hero-eyebrow { font-size:16px; }
    .hb-full-hero .hb-hero-description { font-size:20px; }
    .hb-full-hero .hb-hero-button { height:57px; min-width:184px; font-size:16px; }
    .hb-full-hero .hb-hero-actions { gap:17px; margin-top:35px; }
    .hb-full-hero .hb-visual { max-width:760px; height:435px; transform:scale(1.2); }
    .hb-full-hero::before { width:1600px; height:1600px; top:-75%; }
    .hb-hero-footer { bottom:27px; font-size:15px; }
}
@media (max-width:1300px) {
    .hb-hero-inner, .hb-hero-footer { width:calc(100% - 96px); gap:30px; }
    .hb-hero h1 { font-size:38px; }
    .hb-hero-description { font-size:13px; }
    .hb-visual { height:325px; }
    .hb-sheet { height:310px; padding:20px; }
    .hb-floating-card { padding:17px; top:60px; }
    .hb-floating-card h3 { font-size:12px; }
}
@media (max-width:1100px) {
    .hb-hero-inner, .hb-hero-footer { width:calc(100% - 72px); }
    .hb-hero-inner { gap:20px; }
    .hb-hero h1 { font-size:33px; }
    .hb-hero-description { font-size:12px; }
    .hb-visual { height:295px; }
    .hb-sheet { height:286px; padding:17px; }
    .hb-sheet-title { font-size:13px; }
    .hb-sheet-mark { font-size:8px; }
    .hb-sheet-question { font-size:11px; }
    .hb-sheet-name { font-size:10px; }
    .hb-sheet-options { font-size:9px; }
    .hb-floating-card { padding:14px; top:58px; }
    .hb-floating-card h3 { font-size:11px; }
    .hb-floating-row { font-size:10px; }
    .hb-floating-total { font-size:9px; }
    .hb-mini-tag { font-size:10px; padding:10px 12px; }
}
@media (max-width:767px) {
    .hb-hero-inner { grid-template-columns:1fr; min-height:0; width:calc(100% - 48px); gap:25px; padding:37px 0 64px; }
    .hb-hero h1 { font-size:34px; }
    .hb-hero-description { font-size:13px; }
    .hb-hero-eyebrow { margin-bottom:14px; }
    .hb-hero-actions { gap:9px; margin-top:22px; }
    .hb-hero-button { min-width:125px; height:42px; padding:0 14px; font-size:12px; }
    .hb-visual { height:300px; max-width:430px; }
    .hb-hero-footer { width:calc(100% - 48px); bottom:17px; font-size:10px; }
    .hb-hero-footer > div { gap:13px; }
    .hb-hero-footer > span { display:none; }
    .hb-slide { height:clamp(200px,32vw,300px); }
    .hb-prev, .hb-next { width:32px; height:32px; }
    .hb-upload-controls { bottom:9px; gap:8px; padding:2px 9px; }
}

.hb-hero-tabs { display:flex; align-items:center; gap:25px; }
.hb-hero-tabs > button { display:flex; align-items:center; gap:9px; height:auto; padding:7px 0; border:0; border-radius:0; background:transparent; color:#94a9c7; font:11px/1.6 "Microsoft YaHei",sans-serif; cursor:pointer; white-space:nowrap; }
.hb-hero-tabs > button b { font:10px/1.6 Arial,sans-serif; color:#a1b5d1; }
.hb-hero-tabs > button[aria-pressed="true"] { color:#4d83cf; }
.hb-hero-tabs > button[aria-pressed="true"]::before { content:""; width:23px; height:2px; background:#4d8ae1; }
.hb-hero-footer .hb-hero-controls { display:flex; align-items:center; gap:8px; }
.hb-hero-controls > span { padding:0 7px; color:#94a9c7; font:10px/1.6 Arial,sans-serif; white-space:nowrap; }
.hb-hero-controls > span::before { display:none !important; }
.hb-hero-controls > button { display:grid; place-items:center; min-width:30px; height:30px; margin:0; padding:0 7px; border:1px solid #d3e2f6; border-radius:50%; background:#ffffffb3; color:#6c92c6; cursor:pointer; }
.hb-hero-controls .hb-icon { width:14px; height:14px; }
.hb-hero-controls > button.hb-hero-play { border-radius:5px; padding:0 9px; font:10px/1.6 "Microsoft YaHei",sans-serif; white-space:nowrap; }
.hb-hero button:focus-visible { outline:2px solid #8db6f3; outline-offset:3px; }
@media (min-width:2200px) { .hb-hero-tabs > button { font-size:15px; }.hb-hero-tabs > button b { font-size:12px; } }
@media (max-width:767px) { .hb-hero-footer { align-items:flex-start; flex-direction:column; gap:10px; }.hb-hero-tabs { gap:16px; }.hb-hero-inner { padding-bottom:105px; }.hb-hero-tabs > button { font-size:10px; }.hb-hero-tabs > button[aria-pressed="true"]::before { width:15px; } }
