.learning-center-page{background:#07090d;color:#fff;min-height:100vh}.learning-center-page .learning-hero{align-items:center;background:url(https://hitem3dstatic.zaohaowu.net/FE/static/sparc3d-website/ssr-learning/learningBg.webp) top/cover no-repeat;display:flex;height:30.5rem;justify-content:center;padding-top:6rem;width:100%}.learning-center-page .learning-hero .hero-overlay{margin-bottom:2.2rem;text-align:center}.learning-center-page .learning-hero .hero-overlay .hero-tag{align-items:center;background:linear-gradient(90deg,#fff,#31ffcc);background-clip:text;-webkit-background-clip:text;border:.1rem solid hsla(0,0%,94%,.15);border-radius:2.4rem;display:inline-flex;font-weight:510;height:2.8rem;padding:0 1.6rem;-webkit-text-fill-color:transparent;-webkit-backdrop-filter:blur(1.35px);backdrop-filter:blur(1.35px);box-shadow:inset 0 1.138px 1.18px #ffffff26,inset 0 4.637px 4.72px #ffffff1a,inset 0 -1.932px 6.977px #ffffff26,inset 0 -1.159px 3.864px #ffffff26;font-size:1.4rem}.learning-center-page .learning-hero .hero-overlay .hero-title{background:linear-gradient(90deg,#fff 52%,#35ffcf);background-clip:text;-webkit-background-clip:text;font-size:4.8rem;font-weight:700;letter-spacing:.04rem;line-height:1.1;margin:1.4rem 0 .8rem;-webkit-text-fill-color:transparent}.learning-center-page .learning-hero .hero-overlay .hero-desc{color:#ffffffad;font-size:1.8rem;line-height:1.2;margin:0}.learning-center-page .learning-content{background:#030303;margin:4.2rem auto 0;width:calc(100% - 11.2rem)}.learning-center-page .learning-content .filter-row{display:flex;flex-wrap:wrap;gap:.8rem}.learning-center-page .learning-content .filter-row .filter-chip{background:#141414cc;border:.1rem solid hsla(0,0%,94%,.15);border-radius:3rem;color:#ffffffb8;font-size:1.4rem;height:2.8rem;padding:0 1.6rem;transition:all .3s ease}.learning-center-page .learning-content .filter-row .filter-chip.active{background:#252525;border-color:transparent;color:var(--color-primary)}.learning-center-page .learning-content .cards-grid{display:grid;gap:1.6rem;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:2.4rem}.learning-center-page .learning-content .cards-grid .tutorial-card{background:#141414;border:1px solid hsla(0,0%,94%,.1);border-radius:1.6rem;cursor:pointer;overflow:hidden;transition:transform .22s ease}.learning-center-page .learning-content .cards-grid .tutorial-card:hover{transform:translateY(-.4rem)}.learning-center-page .learning-content .cards-grid .tutorial-card .cover-wrap{aspect-ratio:16/9;background-position:50%;background-repeat:no-repeat;background-size:cover;position:relative}.learning-center-page .learning-content .cards-grid .tutorial-card .cover-wrap .cover-content{display:flex;flex-direction:column-reverse;gap:1rem;justify-content:center;left:2.4rem;position:absolute;top:45%;transform:translateY(-50%);width:calc(50% - 2.4rem)}.learning-center-page .learning-content .cards-grid .tutorial-card .cover-wrap .cover-card-title{color:#fff;display:-webkit-box;font-size:2rem;font-weight:700;-webkit-line-clamp:4;line-height:1.2;width:100%;-webkit-box-orient:vertical;overflow:hidden}.learning-center-page .learning-content .cards-grid .tutorial-card .cover-wrap .cover-duration{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;border:.5px solid hsla(0,0%,94%,.1);border-radius:88px;font-size:1.2rem;height:2.2rem;line-height:2.2rem;opacity:0;padding:0 .8rem;position:absolute;right:.8rem;top:.8rem;transform:translateY(-.4rem);transition:opacity .22s ease,transform .22s ease}.learning-center-page .learning-content .cards-grid .tutorial-card:focus-visible .cover-duration,.learning-center-page .learning-content .cards-grid .tutorial-card:hover .cover-duration{opacity:1;transform:translateY(0)}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body{padding:1.6rem 1.6rem 1.2rem}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-tags .tag-pill{background:#00000061;border:.1rem solid rgba(108,238,213,.25);border-radius:1.4rem;color:#ffffffbd;font-size:1.2rem;height:2.4rem;line-height:2.2rem;padding:0 1rem}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-title{background:linear-gradient(95deg,#fff,#bcb8ff 58%);background-clip:text;-webkit-background-clip:text;font-size:1.8rem;font-weight:600;letter-spacing:.02rem;line-height:1.22;margin:0;min-height:5rem;-webkit-text-fill-color:transparent}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta{align-items:center;border-top:.1rem solid hsla(0,0%,94%,.12);display:flex;gap:1.2rem;justify-content:space-between;margin-top:1.6rem;padding-top:1.2rem}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .author{align-items:center;display:inline-flex;font-size:1.4rem;font-weight:500}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .author .author-icon{font-size:1.4rem;margin-right:.4rem}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .author .sparc-guanfang{color:#2dffce}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .author .sparc-geren1{background:linear-gradient(101deg,#ffbce6 25.13%,#afff99 96.52%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .author.official{color:#72ffd3}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .author.creator{background:linear-gradient(101deg,#ffbce6 25.13%,#afff99 96.52%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.learning-center-page .learning-content .cards-grid .tutorial-card .card-body .card-meta .date{color:#fffc;font-size:1.2rem}.learning-center-page .recommend-section{background:#101010;margin:12rem auto 0;padding:8rem 5.6rem 7.2rem;width:100%}.learning-center-page .recommend-section .recommend-title{background:linear-gradient(90deg,#fffb82 -22.02%,#2dffce);background-clip:text;-webkit-background-clip:text;font-size:4rem;line-height:1.2;margin:0 auto;text-align:center;width:-moz-fit-content;width:fit-content;-webkit-text-fill-color:transparent}.learning-center-page .recommend-section .recommend-subtitle{color:#ffffffa6;font-size:1.8rem;margin:.4rem 0 0;text-align:center}.learning-center-page .recommend-section .recommend-grid{display:grid;gap:1.6rem;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:4rem}.learning-center-page .recommend-section .recommend-grid .recommend-card{background:#141414;border:.1rem solid hsla(0,0%,94%,.1);border-radius:1.6rem;overflow:hidden;transition:transform .22s ease}.learning-center-page .recommend-section .recommend-grid .recommend-card:hover{transform:translateY(-.4rem)}.learning-center-page .recommend-section .recommend-grid .recommend-card .recommend-image{aspect-ratio:16/9;display:block;-o-object-fit:cover;object-fit:cover;width:100%}.learning-center-page .recommend-section .recommend-grid .recommend-card .recommend-body{padding:1.6rem 1.6rem 1.2rem}.learning-center-page .recommend-section .recommend-grid .recommend-card .recommend-body h3{background:linear-gradient(90deg,#fff,#bcb8ff 37.15%);background-clip:text;-webkit-background-clip:text;font-size:1.8rem;font-weight:590;line-height:1.2;margin:0;-webkit-text-fill-color:transparent}.learning-center-page .recommend-section .recommend-grid .recommend-card .recommend-body p{color:#ffffffad;font-size:1.3rem;line-height:1.3;margin:.8rem 0 1.4rem;min-height:4rem}.learning-center-page .recommend-section .recommend-grid .recommend-card .recommend-body .recommend-cta{align-items:center;background:linear-gradient(90deg,#fffb82 -22.02%,#2dffce);background-clip:text;-webkit-background-clip:text;border:1px solid #2dffce;border-radius:1.6rem;display:inline-flex;height:3.2rem;padding:0 .8rem 0 1.2rem;-webkit-text-fill-color:transparent;cursor:pointer;font-size:1.4rem;font-weight:590}.learning-center-page .recommend-section .recommend-grid .recommend-card .recommend-body .recommend-cta .arrow{align-items:center;border:.6px solid rgba(185,255,214,.55);border-radius:2.4rem;color:#000;display:flex;font-size:1.8rem;height:2.4rem;justify-content:center;margin-left:1.6rem;width:2.4rem;-webkit-text-fill-color:#000;animation:recommend-arrow-float-right 1.2s ease-in-out infinite;background:radial-gradient(63.28% 85.63% at 65% 43.75%,#bfff8be3 0,#2dffce00),radial-gradient(707.2% 60.93% at 26.91% 50%,#42d3ff 0,#2dffce),#c7ffbc;box-shadow:inset 0 -1.8px 2.7px #bcf9ff91}.learning-center-page .video-modal{align-items:center;background:#020408d1;display:flex;inset:0;justify-content:center;padding:2rem;position:fixed;z-index:1300}.learning-center-page .video-modal .video-panel{background:#0d1017;border:1px solid hsla(0,0%,94%,.15);border-radius:1.6rem;overflow:hidden;position:relative}.learning-center-page .video-modal .video-panel .close-btn{align-items:center;background:#323232;border:.1rem solid hsla(0,0%,100%,.2);border-radius:50%;color:#fff;display:flex;height:3.2rem;justify-content:center;position:absolute;right:1.2rem;top:1.2rem;width:3.2rem;z-index:2}.learning-center-page .video-modal .video-panel .video-player{background:#000;border-radius:1.2rem 1.2rem 0 0;display:block;height:52rem;width:92.4rem}.learning-center-page .video-modal .video-panel .video-detail{align-items:center;background:#141414;border-radius:1.6rem;display:flex;gap:2.4rem;justify-content:space-between;padding:2.4rem}.learning-center-page .video-modal .video-panel .video-detail .video-detail-main{display:flex;flex-direction:column;gap:.8rem;min-width:0}.learning-center-page .video-modal .video-panel .video-detail .video-detail-tags{align-items:center;display:flex;flex-wrap:wrap;gap:.4rem}.learning-center-page .video-modal .video-panel .video-detail .video-detail-tag{background:#0000005c;border:.1rem solid rgba(108,238,213,.25);border-radius:3rem;color:#ffffffa6;font-size:1.2rem;height:2.4rem;line-height:2.2rem;padding:0 1.2rem}.learning-center-page .video-modal .video-panel .video-detail .video-detail-title{background:linear-gradient(95deg,#fff,#bcb8ff 60%);background-clip:text;-webkit-background-clip:text;font-size:2.4rem;font-weight:600;line-height:1.2;margin:0;-webkit-text-fill-color:transparent}.learning-center-page .video-modal .video-panel .video-detail .video-detail-meta{align-items:center;display:flex;gap:1.2rem;margin-top:.8rem}.learning-center-page .video-modal .video-panel .video-detail .video-detail-author{align-items:center;display:inline-flex;font-size:1.6rem;font-weight:500}.learning-center-page .video-modal .video-panel .video-detail .video-detail-author .author-icon{font-size:1.6rem;margin-right:.4rem}.learning-center-page .video-modal .video-panel .video-detail .video-detail-author .sparc-guanfang{color:#2dffce}.learning-center-page .video-modal .video-panel .video-detail .video-detail-author .sparc-geren1{background:linear-gradient(101deg,#ffbce6 25.13%,#afff99 96.52%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.learning-center-page .video-modal .video-panel .video-detail .video-detail-author.official{color:#72ffd3}.learning-center-page .video-modal .video-panel .video-detail .video-detail-author.creator{background:linear-gradient(101deg,#ffbce6 25.13%,#afff99 96.52%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.learning-center-page .video-modal .video-panel .video-detail .video-detail-date{color:#fffc;font-size:1.2rem}.learning-center-page .video-modal .video-panel .video-detail .video-feature-btn{background:#0003;border:.1rem solid #2dffce;border-radius:8.8rem;box-shadow:inset 0 1.138px 1.18px #ffffff26,inset 0 4.637px 4.72px #ffffff1a,inset 0 -1.932px 6.977px #ffffff26,inset 0 -1.159px 3.864px #ffffff26;color:#d9ffe4;flex:none;font-size:2rem;font-weight:700;height:4rem;width:16rem}@keyframes recommend-arrow-float-right{0%,to{transform:translate(0)}50%{transform:translate(.4rem)}}@media(max-width:1024px){.learning-center-page .learning-main{padding-bottom:4rem}.learning-center-page .learning-hero{background:url(https://hitem3dstatic.zaohaowu.net/FE/static/sparc3d-website/ssr-learning/learningBg-mobile.webp) top/cover no-repeat;height:23.9rem;padding-top:4.8rem}.learning-center-page .learning-hero .hero-overlay{margin-bottom:0;width:calc(100% - 2.2rem)}.learning-center-page .learning-hero .hero-overlay .hero-tag{border-radius:1.4rem;font-size:1.2rem;height:2rem;padding:0 1.2rem}.learning-center-page .learning-hero .hero-overlay .hero-title{font-size:2.1rem;letter-spacing:0;line-height:1.2;margin:.6rem 0 0}.learning-center-page .learning-hero .hero-overlay .hero-desc{font-size:1.2rem;line-height:1.45;margin:0 auto;max-width:90%}.learning-center-page .learning-content{margin-top:0;width:100%}.learning-center-page .learning-content .filter-row{background:#030303;flex-wrap:nowrap;gap:.8rem;overflow-x:auto;padding:2.4rem 1.6rem;position:sticky;top:var(--header-height);z-index:20}.learning-center-page .learning-content .filter-row .filter-chip{flex:none;font-size:1.2rem;white-space:nowrap}.learning-center-page .learning-content .cards-grid{gap:1.6rem;grid-template-columns:1fr;margin:0 auto;width:calc(100% - 3.2rem)}.learning-center-page .learning-content .cards-grid .tutorial-card .cover-wrap .cover-duration{opacity:1;transform:translateY(0)}.learning-center-page .recommend-section{margin-top:8rem;padding:4rem 1.6rem 0}.learning-center-page .recommend-section .recommend-title{font-size:2.4rem}.learning-center-page .recommend-section .recommend-subtitle{font-size:1.4rem}.learning-center-page .recommend-section .recommend-grid{grid-template-columns:1fr;margin-top:2.4rem}.learning-center-page .video-modal{padding:1.2rem}.learning-center-page .video-modal .video-panel{width:calc(100% - .8rem)}.learning-center-page .video-modal .video-panel .video-player{aspect-ratio:16/9;height:auto;width:100%}.learning-center-page .video-modal .video-panel .video-detail{align-items:flex-start;flex-direction:column;padding:1.6rem}.learning-center-page .video-modal .video-panel .video-detail .video-detail-title{font-size:1.8rem}.learning-center-page .video-modal .video-panel .video-detail .video-feature-btn{font-size:1.4rem;height:3.2rem;width:100%}}
