.haoqi-benefits{position:relative;height:340vh;background:#d7efff;color:#07101e}
.hb-sticky{position:sticky;top:0;height:100vh;min-height:620px;overflow:hidden;background:#d7efff;transition:background-color .55s ease}
.hb-grid{position:absolute;inset:0;opacity:.5;background-image:linear-gradient(rgba(19,54,91,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(19,54,91,.1) 1px,transparent 1px);background-size:25% 33.333%}
.hb-grid:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(12,49,88,.26) 1px,transparent 1.5px);background-size:25% 33.333%;background-position:-1px -1px}
.hb-shell{position:relative;width:calc(100% - 96px);height:100%;margin:auto;z-index:2}
.hb-topline,.hb-bottomline{position:absolute;left:0;right:0;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;font:700 12px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.06em;text-transform:uppercase}
.hb-topline{top:42px}.hb-topline span{text-align:center}.hb-topline b{text-align:right}.hb-bottomline{bottom:35px}.hb-bottomline>span:last-child{text-align:right}
.hb-motion-rail{position:absolute;z-index:5;top:78px;left:50%;display:grid;width:min(560px,48vw);grid-template-columns:repeat(3,1fr);padding:5px;border:1px solid rgba(13,74,137,.17);border-radius:999px;background:rgba(255,255,255,.42);box-shadow:0 12px 35px rgba(36,99,159,.1);overflow:hidden;transform:translateX(-50%);backdrop-filter:blur(12px)}
.hb-motion-rail:before{content:"";position:absolute;inset:5px;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(49,130,255,.2),transparent);transform:translateX(-100%);animation:hbRailSweep 2.6s linear infinite}
.hb-motion-rail>i{position:absolute;z-index:2;left:8px;top:50%;width:9px;height:9px;border-radius:50%;background:#1681ff;box-shadow:0 0 0 6px rgba(22,129,255,.13),0 0 22px 8px rgba(22,129,255,.48);transform:translateY(-50%);animation:hbRailComet 3.2s cubic-bezier(.45,0,.2,1) infinite}
.hb-motion-rail span{position:relative;z-index:3;padding:7px 12px;border-radius:999px;text-align:center;font-size:11px;font-weight:850;color:rgba(7,34,66,.48);transition:color .35s,background-color .35s,box-shadow .35s}
.hb-motion-rail span.is-active{color:#0757c4;background:rgba(255,255,255,.78);box-shadow:0 5px 16px rgba(24,102,205,.14)}
.hb-progress{height:2px;margin:0 30px;background:rgba(4,22,42,.18);overflow:hidden}.hb-progress i{display:block;width:100%;height:100%;background:#156cf3;transform:scaleX(0);transform-origin:left center}
.hb-scenes{position:absolute;inset:90px 0 80px}.hb-scene{position:absolute;inset:0;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:5vw;opacity:0;pointer-events:none;will-change:transform,opacity}.hb-scene.is-active{pointer-events:auto}
.hb-copy{align-self:center}.hb-label{display:inline-block;margin-bottom:26px;font:750 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.09em}.hb-copy h2{max-width:980px;margin:0;font-size:clamp(58px,6.2vw,116px);line-height:.89;letter-spacing:-.067em;text-transform:uppercase}.hb-copy h2 em{font-style:normal;color:#116df5}.hb-copy p{max-width:590px;margin:28px 0 0;font-size:17px;line-height:1.75;color:rgba(7,16,30,.66)}.hb-copy a{display:inline-flex;align-items:center;gap:25px;margin-top:28px;padding-bottom:7px;border-bottom:2px solid currentColor;color:#07101e;text-decoration:none;font-weight:850;font-size:15px}.hb-copy a b{font-size:20px;transition:transform .2s}.hb-copy a:hover b{transform:translate(3px,-3px)}
.hb-scene[data-hb-scene="2"] .hb-copy h2{max-width:820px;font-size:clamp(54px,4.8vw,92px);line-height:.94;letter-spacing:-.055em}
.hb-object{position:relative;justify-self:end;width:min(36vw,560px);aspect-ratio:1;display:grid;place-items:center;filter:drop-shadow(0 35px 55px rgba(27,99,180,.2));will-change:transform}.hb-object:before,.hb-object:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(7,52,103,.17)}.hb-object:before{inset:3%;animation:hbOrbit 14s linear infinite}.hb-object:after{inset:18%;border-style:dashed;animation:hbOrbit 10s linear infinite reverse}.hb-glass{position:relative;z-index:2;display:grid;place-items:center;width:55%;aspect-ratio:1;border:1px solid rgba(255,255,255,.84);border-radius:43% 57% 52% 48%/51% 38% 62% 49%;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(65,153,255,.2));box-shadow:inset -18px -24px 45px rgba(13,100,220,.16),inset 17px 15px 30px rgba(255,255,255,.75),0 28px 60px rgba(25,102,211,.2);font:900 clamp(90px,12vw,190px)/1 Inter,sans-serif;color:#1673ee;transform:rotate(-8deg)}.hb-object-trial>i{position:absolute;right:9%;bottom:22%;z-index:3;padding:11px 16px;border-radius:999px;background:#07101e;color:#fff;font:800 12px/1 ui-monospace,monospace}.hb-object-trial img{position:absolute;left:12%;top:20%;z-index:3;width:72px;border-radius:22px;transform:rotate(10deg);box-shadow:0 16px 35px rgba(18,77,150,.22)}
.hb-ticket,.hb-commission{position:relative;z-index:2;width:70%;padding:44px;border:1px solid rgba(255,255,255,.8);border-radius:34px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(199,230,255,.68));box-shadow:inset 0 1px rgba(255,255,255,.9),0 34px 70px rgba(22,93,181,.2);transform:rotate(-5deg)}.hb-ticket small,.hb-ticket span,.hb-commission small,.hb-commission span{display:block;font:750 12px/1.4 ui-monospace,monospace;letter-spacing:.08em}.hb-ticket strong,.hb-commission strong{display:block;margin:22px 0 12px;font-size:clamp(46px,5vw,80px);letter-spacing:-.06em}.hb-object-gift>i,.hb-object-agent>i{position:absolute;right:6%;top:14%;z-index:3;display:grid;place-items:center;width:88px;height:88px;border-radius:26px;background:#ffb629;color:#101010;font-style:normal;font-size:38px;font-weight:900;transform:rotate(9deg);box-shadow:0 22px 45px rgba(181,116,0,.22)}.hb-commission{background:linear-gradient(145deg,#071a38,#103f82);color:#fff;transform:rotate(4deg)}.hb-commission strong{color:#67f0b8}.hb-object-agent>i{background:#5bdfad}
@keyframes hbOrbit{to{transform:rotate(360deg)}}
@media(max-width:900px){.hb-shell{width:calc(100% - 44px)}.hb-scene{grid-template-columns:1fr}.hb-copy{align-self:end;padding-bottom:44vh}.hb-copy h2{font-size:clamp(50px,9vw,74px)}.hb-copy p{font-size:15px}.hb-object{position:absolute;right:0;bottom:0;width:min(54vw,430px)}.hb-topline{top:30px}.hb-bottomline{bottom:25px}.hb-progress{margin-inline:14px}}
@media(max-width:560px){.haoqi-benefits{height:300vh}.hb-sticky{min-height:590px}.hb-shell{width:calc(100% - 30px)}.hb-topline{grid-template-columns:1fr auto}.hb-topline span{display:none}.hb-scenes{inset:72px 0 62px}.hb-copy{align-self:start;padding:52px 0 0}.hb-label{margin-bottom:18px;font-size:10px}.hb-copy h2{font-size:45px;line-height:.94}.hb-copy p{max-width:92%;margin-top:20px;font-size:14px}.hb-copy a{margin-top:18px}.hb-object{width:66vw;right:-8vw;bottom:2vh}.hb-object-trial img{width:52px}.hb-object-gift>i,.hb-object-agent>i{width:62px;height:62px;font-size:28px}.hb-ticket,.hb-commission{padding:28px}.hb-bottomline{grid-template-columns:1fr 1fr}.hb-bottomline>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.hb-sticky{transition:none}.hb-object:before,.hb-object:after{animation:none}.hb-scene{transform:none!important}}

/* Haoqi-inspired motion mechanisms, re-authored for JITU branding. */
.hb-sticky:after{content:"";position:absolute;z-index:1;left:-18%;top:18%;width:42%;height:4px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(35,125,255,.2),#fff 64%,rgba(52,147,255,.92),transparent);filter:drop-shadow(0 0 14px rgba(53,139,255,.95));transform:rotate(-18deg);animation:hbRouteFlare 5.4s cubic-bezier(.45,0,.2,1) infinite}
.hb-ticket,.hb-commission,.benefit-ticket,.agent-mini{--glare-x:25%;--glare-y:18%;background-blend-mode:screen,normal;transition:filter .25s ease,transform .25s ease}
.hb-ticket,.hb-commission{background-image:radial-gradient(circle at var(--glare-x) var(--glare-y),rgba(255,255,255,.72),transparent 27%),linear-gradient(145deg,rgba(255,255,255,.92),rgba(199,230,255,.68));background-size:170% 170%,100% 100%;animation:hbGlassDrift 6.8s ease-in-out infinite}
.hb-commission{background-image:radial-gradient(circle at var(--glare-x) var(--glare-y),rgba(94,244,194,.28),transparent 28%),linear-gradient(145deg,#071a38,#103f82)}
.benefit-ticket{background-image:radial-gradient(circle at var(--glare-x) var(--glare-y),rgba(255,255,255,.86),transparent 28%),linear-gradient(155deg,#fff9d9,#ffd569)}
.agent-mini{background-image:radial-gradient(circle at var(--glare-x) var(--glare-y),rgba(92,212,255,.24),transparent 30%),linear-gradient(rgba(4,24,55,.76),rgba(4,24,55,.76))}
[data-scramble]{font-variant-numeric:tabular-nums}
.hb-scene.is-active .hb-label{animation:hbCopyReveal .58s both}
.hb-scene.is-active .hb-copy h2{animation:hbTitleReveal .78s cubic-bezier(.2,.75,.2,1) both}
.hb-scene.is-active .hb-copy p{animation:hbCopyReveal .68s .14s both}
.hb-scene.is-active .hb-copy>a{animation:hbCopyReveal .68s .24s both}
.hb-scene.is-active .hb-object{animation:hbObjectEnter .82s cubic-bezier(.16,.82,.26,1) both}
.hb-object-trial .hb-glass{animation:hbTrialFloat 4.4s ease-in-out infinite}
.hb-object-gift .hb-ticket{animation:hbGiftFloat 4.8s ease-in-out infinite,hbGlassDrift 5.2s ease-in-out infinite}
.hb-object-agent .hb-commission{animation:hbAgentFloat 5s ease-in-out infinite,hbGlassDrift 5.2s ease-in-out infinite}
.hb-object>i{animation:hbBadgePulse 2.3s ease-in-out infinite}
.hb-topline>span:after{content:" ↓";display:inline-block;color:#116df5;animation:hbScrollHint 1.25s ease-in-out infinite}
@keyframes hbRouteFlare{0%{left:-24%;top:24%;opacity:0}14%{opacity:1}58%{opacity:.85}78%,100%{left:108%;top:62%;opacity:0}}
@keyframes hbGlassDrift{0%,100%{background-position:10% 15%,0 0}50%{background-position:85% 70%,0 0}}
@keyframes hbTitleReveal{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(28px)}100%{opacity:1;clip-path:inset(0);transform:translateY(0)}}
@keyframes hbCopyReveal{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:translateY(0)}}
@keyframes hbObjectEnter{0%{opacity:0;transform:translate(70px,34px) scale(.88) rotate(7deg)}100%{opacity:1;transform:translate(0) scale(1) rotate(0)}}
@keyframes hbTrialFloat{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-18px) rotate(-4deg)}}
@keyframes hbGiftFloat{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-16px) rotate(-2deg)}}
@keyframes hbAgentFloat{0%,100%{transform:translateY(0) rotate(4deg)}50%{transform:translateY(-16px) rotate(1deg)}}
@keyframes hbBadgePulse{0%,100%{box-shadow:0 22px 45px rgba(27,99,180,.22);scale:1}50%{box-shadow:0 22px 52px rgba(27,99,180,.38),0 0 0 12px rgba(91,223,173,.12);scale:1.06}}
@keyframes hbScrollHint{0%,100%{transform:translateY(-2px);opacity:.55}50%{transform:translateY(4px);opacity:1}}
@keyframes hbRailSweep{to{transform:translateX(100%)}}
@keyframes hbRailComet{0%{left:8px;opacity:0}10%{opacity:1}88%{opacity:1}100%{left:calc(100% - 17px);opacity:0}}
@media(max-width:700px){.hb-sticky:after{width:48%;opacity:.62;animation-duration:10s}.hb-ticket,.hb-commission{animation-duration:8.5s}.hb-motion-rail{top:70px;width:calc(100% - 8px)}.hb-motion-rail span{padding:6px 4px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.hb-sticky:after{display:none}.hb-ticket,.hb-commission,.hb-glass,.hb-object>i,.hb-scene.is-active .hb-label,.hb-scene.is-active .hb-copy h2,.hb-scene.is-active .hb-copy p,.hb-scene.is-active .hb-copy>a,.hb-scene.is-active .hb-object,.hb-topline>span:after{animation:none!important}.hb-motion-rail:before,.hb-motion-rail>i{animation-duration:7s}}

/* R6.1 interaction polish: stable typewriter, scrollable menu, compact support. */
body.menu-open{overflow:auto}
.original-home-hero h1[data-hero-typed]{box-sizing:border-box;height:1.08em;min-height:1.08em;overflow:visible;white-space:nowrap;font-size:clamp(50px,4.2vw,68px)}
.site-header .nav.open{max-height:calc(100dvh - 92px);overflow-y:auto;overscroll-behavior:contain}
.telegram-support{right:24px;bottom:22px;display:flex;width:48px;height:65px;min-width:48px;padding:0;gap:4px;flex-direction:column;align-items:center;justify-content:flex-start;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.telegram-support>span{position:relative;display:grid;width:42px;height:42px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#31b9f5,#1787d2);box-shadow:inset 0 1px rgba(255,255,255,.42),0 8px 20px rgba(24,143,210,.28)}
.telegram-support svg{width:23px;height:23px;fill:#fff;transform:translate(-1px,1px)}
.telegram-support svg .tg-cut{fill:#ccefff}
.telegram-support>span>i{position:absolute;right:-1px;bottom:1px;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:#28cd87;box-shadow:0 0 0 2px rgba(40,205,135,.18)}
.telegram-support strong{display:block;padding:1px 4px;color:#0a325e;font-size:12px;line-height:1;font-weight:900;white-space:nowrap;text-shadow:0 1px 5px rgba(255,255,255,.95)}.telegram-support small{display:none}
.telegram-support:after{content:"Telegram 客服";position:absolute;right:66px;top:50%;padding:8px 11px;border-radius:9px;background:#071a38;color:#fff;font-size:11px;font-weight:750;white-space:nowrap;opacity:0;pointer-events:none;transform:translate(8px,-50%);transition:opacity .18s,transform .18s}
.telegram-support:hover:after,.telegram-support:focus-visible:after{opacity:1;transform:translate(0,-50%)}
@media(max-width:1250px){.original-home-hero h1[data-hero-typed]{font-size:clamp(44px,5.1vw,58px)}}
@media(max-width:980px){.site-header .nav.open{max-height:calc(100dvh - 76px)}}
@media(max-width:700px){.original-home-hero h1[data-hero-typed]{height:2.18em;min-height:2.18em;white-space:normal;font-size:clamp(34px,9.8vw,40px)}}
@media(max-width:640px){.site-header .nav.open{max-height:calc(100dvh - 66px);overflow-y:auto}.telegram-support{right:14px;bottom:14px;width:42px;height:58px;min-width:42px;padding:0;gap:4px;border-radius:0}.telegram-support>span{width:36px;height:36px}.telegram-support svg{width:20px;height:20px}.telegram-support strong{display:block;font-size:11px}.telegram-support:after{display:none}}

/* Unified secondary actions across hero, download cards, guides and final CTA. */
.original-secondary,.card-guide,.button-ghost,.button-outline-light{position:relative;isolation:isolate;overflow:hidden;border-width:1px;border-style:solid;transition:color .22s ease,border-color .22s ease,background-color .22s ease,box-shadow .22s ease,transform .22s ease}
.original-secondary,.button-outline-light{border-color:rgba(168,211,255,.34);background:rgba(5,24,53,.48);color:#fff;box-shadow:inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(12px)}
.card-guide,.button-ghost{border-color:#cbdcf1;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(237,246,255,.9));color:#21466f;box-shadow:0 8px 22px rgba(34,83,145,.08)}
.original-secondary:before,.card-guide:before,.button-ghost:before,.button-outline-light:before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(110deg,transparent 15%,rgba(91,183,255,.2) 48%,transparent 78%);transform:translateX(-115%);transition:transform .46s ease}
.original-secondary:hover,.button-outline-light:hover{border-color:rgba(148,218,255,.72);background:rgba(20,73,130,.58);box-shadow:0 12px 30px rgba(8,75,151,.2)}
.card-guide:hover,.button-ghost:hover{border-color:#83b9f6;background:#edf6ff;color:#0f67d7;box-shadow:0 12px 28px rgba(34,105,197,.14)}
.original-secondary:hover:before,.card-guide:hover:before,.button-ghost:hover:before,.button-outline-light:hover:before{transform:translateX(115%)}
.original-secondary:active,.card-guide:active,.button-ghost:active,.button-outline-light:active{transform:translateY(0) scale(.98)}
@media(max-width:700px){.original-secondary,.card-guide,.button-ghost,.button-outline-light{min-height:46px}.guide-actions .button-ghost{width:100%}.final-inner .button-outline-light{width:100%}}
