/* bgph：首页背景——两位学生的照片做成活的背景（镜头缓推 + 窗光扫过 + 飘尘 + 鼠标视差 + 悬浮的学习卡片）。照片：Antoni Shkraba / Pexels（Pexels License）。 */
.bgph{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.bgph .pw{position:absolute;inset:0;transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.bgph .ph{position:absolute;inset:0;background:url(/home-assets/hero-real.webp) 12% 40%/cover no-repeat;opacity:0;animation:phin 1.6s ease .1s forwards}
.bgph .ph video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:12% 40%;opacity:0;transition:opacity 1.4s ease}
.bgph .ph video.on{opacity:1}
.bgph::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,10,20,.78) 0%,rgba(7,10,20,.52) 45%,rgba(7,10,20,.3) 100%),linear-gradient(180deg,rgba(7,10,20,.3) 0%,rgba(7,10,20,.05) 25%,rgba(7,10,20,.7) 100%)}
.bgph .beam{display:none;position:absolute;top:-25%;left:-35%;width:42%;height:150%;background:linear-gradient(100deg,transparent 0%,rgba(255,238,200,.16) 50%,transparent 100%);transform:rotate(14deg);mix-blend-mode:screen;animation:beam 13s ease-in-out infinite}
.bgph .dust{display:none;position:absolute;inset:0;opacity:.5;background:radial-gradient(circle,rgba(255,248,225,.7) 0 1px,transparent 2px) 0 0/110px 110px,radial-gradient(circle,rgba(255,248,225,.5) 0 1.2px,transparent 2.4px) 47px 63px/170px 170px,radial-gradient(circle,rgba(190,220,255,.45) 0 1px,transparent 2px) 21px 29px/230px 230px;animation:dust 46s linear infinite}
.bgph .chip{display:none!important;z-index:2;position:absolute;display:flex;align-items:center;gap:8px;padding:8px 13px 8px 10px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#EAF0FF;font:600 12px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;white-space:nowrap;box-shadow:0 10px 30px rgba(0,0,0,.3);opacity:0;animation:chin .9s ease forwards,chf 7s ease-in-out infinite alternate}
.bgph .chip i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:10px;color:#06101F;background:linear-gradient(135deg,#7C6CFF,#4FE3B0)}
.bgph .c3{left:61%;top:13%;animation-delay:4.2s,4.2s;animation-duration:.9s,6.5s}
@keyframes phin{to{opacity:1}}
@keyframes beam{0%,12%{left:-35%;opacity:0}30%{opacity:1}70%{opacity:1}88%,100%{left:105%;opacity:0}}
@keyframes dust{to{background-position:0 -220px,47px -340px,21px -460px}}
@keyframes chin{to{opacity:1}}
@keyframes chf{from{transform:translateY(0)}to{transform:translateY(-12px)}}
.bgph.paused *{animation-play-state:paused!important}
@media (max-width:900px){.bgph::after{background:linear-gradient(180deg,rgba(7,10,20,.55) 0%,rgba(7,10,20,.6) 45%,rgba(7,10,20,.9) 100%)}}
@media (max-width:760px){.bgph .ph{top:46px;bottom:auto;height:auto;aspect-ratio:1.9/1;background-image:url(/home-assets/hero-real-m.webp);background-position:center;-webkit-mask-image:linear-gradient(180deg,#000 50%,transparent 100%);mask-image:linear-gradient(180deg,#000 50%,transparent 100%)}.bgph .ph video{object-position:center}}
@media (prefers-reduced-motion:reduce){.bgph .ph{animation:phin .6s ease forwards}.bgph .beam,.bgph .dust,.bgph .chip{animation:none}.bgph .chip{opacity:1}.bgph .beam{display:none}}