:root{--bg:#071116;--bg2:#0b191d;--ink:#f4f0e7;--sub:#9eaeb1;--cyan:#62ded7;--mint:#95ece3;--gold:#e8bb7f;--line:rgba(182,230,224,.16);--content:1320px;--radius:22px;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:84px}body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}::selection{color:#082024;background:var(--cyan)}.serif{font-family:"Songti SC","Noto Serif CJK SC","STSong",serif}.container{width:min(calc(100% - 96px),var(--content));margin-inline:auto}.eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--mint);font-size:12px;letter-spacing:.27em;font-weight:650}.eyebrow:before{content:"";width:24px;height:1px;background:currentColor;opacity:.8}.section-title{font-family:"Songti SC","Noto Serif CJK SC","STSong",serif;font-size:clamp(42px,5.7vw,82px);font-weight:600;letter-spacing:-.025em;line-height:1.15;margin:22px 0}.muted{color:var(--sub)}.section-intro{color:#bcc7c5;font-size:16px;line-height:2.05;max-width:610px}.section{position:relative;padding:145px 0;isolation:isolate}.section:before{pointer-events:none}.gold{color:var(--gold)}.cyan{color:var(--cyan)}.sr-only{position:absolute!important;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden;white-space:nowrap}.reveal{opacity:0;transform:translateY(32px);transition:opacity 1s var(--ease),transform 1s var(--ease)}.reveal.visible{opacity:1;transform:translateY(0)}.arrow{display:inline-block;transition:transform .25s}.btn:hover .arrow,.mini-link:hover .arrow{transform:translateX(4px)}
/* Header */
#progress{position:fixed;left:0;top:0;z-index:1000;width:0;height:2px;background:linear-gradient(90deg,var(--cyan),var(--gold));box-shadow:0 0 14px var(--cyan)}
.site-header{position:fixed;z-index:200;left:0;right:0;top:0;background:rgba(4,15,19,.78);border-bottom:1px solid rgba(255,255,255,.09);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);transition:background .25s}
.site-header.scrolled{background:rgba(4,15,19,.94)}.nav-row{height:78px;display:flex;align-items:center;justify-content:space-between;gap:34px}.brand{display:flex;align-items:center;gap:17px;white-space:nowrap}.brand-cn{font-family:"Songti SC","STSong",serif;font-size:32px;letter-spacing:.05em;color:#f2d6a5;line-height:1}.brand-right{display:flex;flex-direction:column;gap:3px;border-left:1px solid #ffffff30;padding-left:15px}.brand-title{font-family:"Songti SC","STSong",serif;font-size:16px;letter-spacing:.13em}.brand-caption{font-size:8px;color:#bccbca;letter-spacing:.33em}.nav-links{display:flex;align-items:center;gap:clamp(16px,2.4vw,38px)}.nav-links a{position:relative;font-size:13px;color:#c0cecd;transition:color .2s;white-space:nowrap}.nav-links a:hover,.nav-links a.active{color:#fff}.nav-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:-13px;height:1px;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.nav-tools{display:flex;align-items:center;gap:12px}.sound-btn,.icon-btn{height:39px;width:39px;display:grid;place-items:center;background:transparent;border:1px solid #ffffff25;border-radius:50%;color:#d9ece9;transition:background .2s,border-color .2s}.sound-btn:hover,.icon-btn:hover{border-color:var(--cyan);background:#62ded718}.sound-btn svg,.icon-btn svg{width:17px;height:17px}.menu-toggle{display:none}.pill{border-radius:99px;padding:13px 22px;border:1px solid #ffffff27;display:inline-flex;align-items:center;justify-content:center;gap:13px;transition:transform .2s,background .2s,border-color .2s}.pill:hover,.btn:hover{transform:translateY(-2px)}.pill.primary{background:var(--cyan);color:#08302f;border-color:var(--cyan);font-weight:750}.pill.ghost{background:#ffffff06;color:white}.mobile-menu{display:none}
/* Hero */
.hero{height:min(940px,100svh);min-height:735px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 20% 40%,#1a3432 0%,#071115 64%,#051015 100%);isolation:isolate}
.hero:before{content:"";position:absolute;inset:0;z-index:-3;background:radial-gradient(ellipse at 75% 30%,rgba(13,90,93,.24),transparent 52%),linear-gradient(135deg,#111e22,#040e12 70%)}
.hero-scene{position:absolute;z-index:-2;top:75px;bottom:0;left:0;width:64%;background-image:url('../images/hero-classroom-scene.webp');background-size:cover;background-repeat:no-repeat;background-position:center 34%;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 65%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 24%,#000 94%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 65%,transparent 100%);opacity:.99;pointer-events:none}.hero-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#061318,transparent 28%)}
.hero-warmth{position:absolute;z-index:-2;left:-120px;bottom:0;width:700px;height:330px;background:radial-gradient(ellipse,rgba(224,139,55,.16),transparent 70%);filter:blur(45px);pointer-events:none}
.hero-stars{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.65}#dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hero-inner{height:100%;display:grid;grid-template-columns:52% 48%;align-items:center;padding-top:60px}.hero-content{grid-column:2;position:relative;z-index:4;padding-left:4px;margin-top:18px}.hero-kicker{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:#aecbc9;display:flex;align-items:center;gap:14px}.hero-kicker:before{content:"";width:28px;height:1px;background:var(--cyan)}.hero-title{font-family:"Songti SC","Noto Serif CJK SC","STSong",serif;font-weight:600;font-size:clamp(66px,6.75vw,116px);line-height:1.19;letter-spacing:-.08em;margin:24px 0 27px;white-space:nowrap;text-shadow:0 7px 40px #050d11}.hero-title em{color:#f1c98f;font-style:normal;text-shadow:0 0 32px #edbd7030}.hero-title .underline{position:relative}.hero-title .underline:after{content:"";position:absolute;bottom:-2px;left:6%;right:-6%;height:13px;border-bottom:2px solid var(--gold);border-radius:50%;transform:rotate(-1deg);opacity:.7}.hero-sub{font-family:"Songti SC","STSong",serif;font-size:clamp(16px,1.6vw,24px);letter-spacing:.06em;line-height:1.7;color:#eee9df;margin:0 0 16px}.hero-meta{font-size:13px;color:#a9b7b9;letter-spacing:.15em;margin:0 0 37px}.hero-buttons{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.btn{padding:16px 24px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;gap:15px;font-size:14px;font-weight:650;border:1px solid #ffffff33;transition:transform .3s var(--ease),box-shadow .3s,background .3s}.btn.main{background:var(--cyan);border-color:var(--cyan);color:#09282b;box-shadow:0 12px 35px #47ded323}.btn.main:hover{box-shadow:0 12px 48px #47ded357}.btn.alt{background:#00101270;color:#e3eae8;border-color:#b4c6c990}.btn.alt:hover{border-color:var(--cyan);background:#0a3135}.hero-values{display:flex;gap:35px;margin-top:50px;max-width:550px}.hero-value{display:grid;gap:10px;align-content:start;min-width:75px;transition:transform .3s}.hero-value:hover{transform:translateY(-4px)}.hero-value .symbol{width:48px;height:48px;border:1px solid #c79e61;border-radius:50%;display:grid;place-items:center;font-size:22px;color:var(--gold);box-shadow:inset 0 0 22px #bd965c10}.hero-value span{font-size:12px;letter-spacing:.1em}.hero-value small{font-size:9px;color:#799696;letter-spacing:.13em}.hero-feature{margin-top:46px;max-width:550px;display:flex;align-items:center;gap:18px;border:1px solid #ffffff2a;background:linear-gradient(110deg,rgba(15,46,46,.84),rgba(13,38,42,.47));padding:13px 17px;border-radius:16px;backdrop-filter:blur(14px);box-shadow:0 15px 40px #0003;transition:transform .25s,border-color .25s}.hero-feature:hover{transform:translateY(-3px);border-color:#68dcd780}.hero-feature img{width:67px;height:67px;border-radius:17px;flex-shrink:0}.hero-feature h3{font-family:"Songti SC","STSong",serif;font-size:21px;margin:0 0 7px}.hero-feature p{font-size:12px;color:#bec9c7;line-height:1.7;margin:0}.hero-feature .round-arrow{margin-left:auto;border:1px solid #ffffff50;border-radius:50%;height:34px;width:34px;display:grid;place-items:center;flex-shrink:0}.hero-bottom{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:9px;z-index:5;font-size:9px;letter-spacing:.24em;color:#b9c9c8}.scroll-mouse{height:28px;width:17px;border:1px solid #bbd9d1;border-radius:12px;display:flex;justify-content:center;padding-top:5px}.scroll-mouse:before{content:"";height:6px;width:2px;background:var(--gold);border-radius:9px;animation:wheel 1.8s infinite}@keyframes wheel{0%{transform:translateY(0);opacity:1}100%{transform:translateY(9px);opacity:0}}
/* About */
.about{background:radial-gradient(ellipse at 80% 30%,rgba(29,83,79,.21),transparent 58%),linear-gradient(#071116,#0a181b)}.split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10%}.about-image-wrap{position:relative;height:670px;border:1px solid #73968a36;border-radius:300px 300px 30px 30px;overflow:hidden;background:radial-gradient(ellipse at 40% 30%,#34413b,#131f22 57%,#0a1015);box-shadow:0 25px 70px #0004}.about-image-wrap:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#091619 1%,transparent 42%);z-index:2}.about-image{position:absolute;inset:0;background-image:none;background-size:cover;background-position:50% 34%;filter:saturate(.95)}.about-float{position:absolute;z-index:3;right:-7px;bottom:36px;padding:18px 24px;background:#102628de;border:1px solid #609a9166;border-radius:14px;backdrop-filter:blur(10px);font-family:"Songti SC",serif;line-height:1.75}.about-copy .lead{font-family:"Songti SC",serif;font-size:clamp(23px,2.5vw,35px);line-height:1.65;margin:32px 0;color:#eee7dd}.about-copy .body{font-size:15px;color:#9eaeb1;line-height:2.2;margin-bottom:37px}.about-tags{display:grid;gap:14px}.about-tags>div{display:flex;gap:13px;align-items:center;padding:14px 0;border-bottom:1px solid #ffffff17;color:#d2d9d6}.about-tags b{color:var(--gold);font-size:12px;letter-spacing:.15em;min-width:86px}
/* Philosophy */
.philosophy{background:linear-gradient(180deg,#0a181b 0%,#071215 65%,#071116 100%);overflow:hidden}.philosophy:before{content:"";position:absolute;inset:5% -10%;background:radial-gradient(ellipse at 60% 40%,#16777820,transparent 49%);z-index:-1}.philosophy-header{text-align:center}.philosophy-header .section-intro{margin:auto}.philosophy-header .eyebrow:before{display:none}.lab-wrap{margin-top:65px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(340px,.6fr);gap:20px}.lab-stage{position:relative;height:590px;border:1px solid #6cd9cc30;background:radial-gradient(circle at 49% 48%,#184d4c73 0%,#0b2224 30%,#07171b 71%);border-radius:26px;overflow:hidden;isolation:isolate;display:grid;place-items:center}.lab-grid{position:absolute;inset:0;background-image:linear-gradient(#87d7c50a 1px,transparent 1px),linear-gradient(90deg,#87d7c50a 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(ellipse,black 10%,transparent 75%)}.lab-stage:after{content:"";position:absolute;inset:10%;border:1px solid #acdcd522;border-radius:50%;transform:rotateX(59deg);box-shadow:0 0 0 55px #5ecbc807,0 0 0 120px #5ecbc803;pointer-events:none}.orb{position:relative;z-index:3;width:245px;height:245px;border-radius:50%;display:grid;place-items:center;text-align:center;isolation:isolate;box-shadow:0 0 74px #3fd5d12c,0 0 0 1px #94e9de8c,inset 0 0 55px #74d9d62c;transform-style:preserve-3d;transition:box-shadow .5s,transform .7s var(--ease);background:radial-gradient(circle at 33% 28%,#a2e8ea41,transparent 35%),radial-gradient(circle at 70% 78%,#30c6c21d,transparent 65%),linear-gradient(145deg,#12535580,#0b2030bb)}.orb.goldish{box-shadow:0 0 74px #f3b56f39,0 0 0 1px #efcb97bc,inset 0 0 55px #d7ac6b33;background:radial-gradient(circle at 33% 28%,#eed1a653,transparent 35%),linear-gradient(145deg,#604b3199,#30211cbb)}.orb-inner{display:flex;flex-direction:column;align-items:center;gap:8px}.orb-character{font-family:"Songti SC",serif;font-size:92px;line-height:1;font-weight:600;color:#e4fffc;text-shadow:0 0 32px #5bf5f7aa}.orb.goldish .orb-character{text-shadow:0 0 32px #ffc77aaa}.orb-word{font-size:14px;letter-spacing:.4em;color:#c4e9e4}.orb:before,.orb:after{content:"";position:absolute;inset:-19px;border:1px solid #84e0da46;border-radius:50%;animation:orb-spin 16s linear infinite;transform:rotateX(70deg)}.orb:after{inset:-48px;border-color:#d5af7859;animation-duration:23s;animation-direction:reverse;transform:rotateY(65deg)}@keyframes orb-spin{to{transform:rotate(360deg) rotateX(67deg)}}.orbit-point{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 15px var(--cyan)}.orbit-point.a{top:18%;left:26%}.orbit-point.b{top:36%;right:14%;background:var(--gold);box-shadow:0 0 15px var(--gold)}.orbit-point.c{bottom:23%;left:19%}.orbit-point.d{bottom:18%;right:24%}.lab-action{position:absolute;z-index:5;bottom:28px;left:50%;transform:translateX(-50%);white-space:nowrap}.lab-action:hover{transform:translateX(-50%) translateY(-2px)}.lab-caption{position:absolute;top:22px;left:25px;font-size:10px;letter-spacing:.2em;color:#89b6b0}.stage-info{border:1px solid #87d9cf2b;background:linear-gradient(150deg,#102529,#09171a);border-radius:26px;padding:33px;display:flex;flex-direction:column}.stage-select{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.stage-tab{border:1px solid #ffffff24;color:#b0c9c4;border-radius:13px;background:#ffffff06;padding:17px 7px;text-align:center;transition:all .25s}.stage-tab strong{display:block;font-family:"Songti SC",serif;font-size:27px;font-weight:500;margin-bottom:4px}.stage-tab small{font-size:10px;letter-spacing:.2em}.stage-tab[aria-selected="true"]{background:#62ded719;border-color:var(--cyan);color:#f0fffd;box-shadow:0 0 18px #62ded718}.stage-text{margin-top:52px;min-height:188px}.stage-index{font-size:11px;color:var(--gold);letter-spacing:.25em}.stage-text h3{font-family:"Songti SC",serif;font-size:32px;font-weight:500;margin:14px 0}.stage-text p{color:#afbebc;font-size:14px;line-height:2}.stage-status{margin-top:auto;padding-top:25px;border-top:1px solid #ffffff23;font-size:12px;color:#89b1ad;min-height:76px}.stage-status b{color:var(--cyan)}.mini-modules{position:absolute;left:25px;bottom:32px;z-index:5;display:none;gap:10px}.mini-modules.show{display:flex}.module{display:grid;place-items:center;border:1px solid #7bdad2a3;background:#0c363a;width:68px;height:52px;border-radius:12px;color:#d6fff9;touch-action:none;cursor:grab;user-select:none;font-size:12px}.module:active{cursor:grabbing}.drop-target{position:absolute;right:30px;bottom:32px;z-index:4;border:1px dashed #e6bc79a0;border-radius:12px;width:105px;height:52px;display:none;place-items:center;color:#d7bf92;font-size:11px;letter-spacing:.1em}.drop-target.show{display:grid}.pulse{animation:pulse-effect .8s ease-out}@keyframes pulse-effect{50%{transform:scale(1.12);filter:brightness(1.7)}}
/* Works */
.works{background:#071116}.works-top{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:50px}.works-top .section-title{margin-bottom:0}.project-feature{display:grid;grid-template-columns:.8fr 1.2fr;position:relative;background:linear-gradient(130deg,#0b382d,#092a25 50%,#15392f);border:1px solid #43857765;border-radius:28px;min-height:495px;overflow:hidden;box-shadow:0 25px 80px #0004}.project-feature:before{content:"";position:absolute;right:-15%;top:-70%;width:80%;height:170%;border:1px solid #c9e6b427;border-radius:50%;transform:rotate(25deg)}.project-copy{padding:65px;position:relative;z-index:2}.project-copy .product-brand{display:flex;align-items:center;gap:14px;margin-bottom:36px}.project-copy .product-brand img{width:59px;height:59px;border-radius:17px}.project-copy .product-brand strong{font-size:26px;font-family:"Songti SC",serif}.project-copy h3{font-family:"Songti SC",serif;font-size:clamp(34px,3.3vw,54px);font-weight:500;line-height:1.34;letter-spacing:.04em;margin:0 0 20px}.project-copy p{color:#c4d5cd;font-size:14px;line-height:2.1;max-width:385px;margin-bottom:30px}.project-shot{align-self:center;justify-self:start;width:120%;transform:perspective(1200px) rotateY(-8deg) rotateX(4deg) translate(30px,12px);border:8px solid #d1e1d8;border-radius:18px;box-shadow:0 40px 60px #0008;overflow:hidden;background:#e8ede7;transition:transform .7s var(--ease)}.project-feature:hover .project-shot{transform:perspective(1200px) rotateY(-3deg) rotateX(1deg) translate(15px,2px)}.project-shot img{display:block;width:100%}.project-more{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:20px}.mini-project{background:linear-gradient(140deg,#12252b,#0a1a20);border:1px solid #ffffff18;border-radius:21px;padding:28px;min-height:318px;position:relative;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,border-color .3s}.mini-project:hover{transform:translateY(-6px);border-color:#63d9d66a}.mini-project-art{height:142px;display:grid;place-items:center;margin:-8px -4px 13px;position:relative}.mini-project h4{margin:0 0 11px;font-family:"Songti SC",serif;font-size:24px;font-weight:500}.mini-project p{margin:0;font-size:12px;color:#9db4b2;line-height:1.8;max-width:280px}.mini-project .mini-link{margin-top:auto;padding-top:15px;color:var(--cyan);font-size:12px;align-self:flex-start;border:0;background:none;padding-left:0}.net-art svg{width:220px;height:130px;filter:drop-shadow(0 0 14px #66d5ef40)}.tiles-art{display:flex;gap:10px;align-items:center;justify-content:center;transform:rotate(-11deg)}.tile{height:70px;width:61px;border:1px solid #96d5ed7a;border-radius:13px;background:linear-gradient(145deg,#13364c,#1a6073);font-size:36px;color:#d4fbf8;display:grid;place-items:center;box-shadow:0 10px 30px #18abc51d}.tile:nth-child(2){transform:translateY(-18px);background:linear-gradient(145deg,#5d4c37,#b48b56);color:#fff4dd}.tile:nth-child(3){transform:translateY(9px)}.analysis-art{background:linear-gradient(140deg,#f3f5f2,#d4e9e3);border-radius:10px;width:212px;height:113px;padding:14px;box-shadow:0 15px 30px #0004;transform:rotate(6deg)}.analysis-art .line{height:5px;width:65%;border-radius:5px;background:#8fb6b4;margin-bottom:9px}.analysis-art .bar-row{display:flex;align-items:end;height:55px;gap:7px;border-bottom:1px solid #aac8c3}.analysis-art .bar-row i{width:20px;background:#6abdbb;border-radius:3px 3px 0 0}.analysis-art .bar-row i:nth-child(1){height:45%}.analysis-art .bar-row i:nth-child(2){height:72%}.analysis-art .bar-row i:nth-child(3){height:38%}.analysis-art .bar-row i:nth-child(4){height:90%}.analysis-art .bar-row i:nth-child(5){height:57%}
/* Classroom */
.classroom{background:linear-gradient(180deg,#071116,#152327 54%,#08191d);overflow:hidden}.classroom-inner{display:grid;grid-template-columns:1.07fr 1fr;gap:8%;align-items:center}.classroom-visual{height:625px;position:relative;border-radius:25px;overflow:hidden;background:#212f2f;box-shadow:0 35px 90px #0006}.classroom-visual img{height:100%;width:100%;object-fit:cover;object-position:center}.classroom-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#111c20b5,transparent 40%)}.classroom-visual .visual-label{position:absolute;bottom:28px;left:30px;z-index:2;font-size:10px;letter-spacing:.22em;color:#eed5b0}.classroom-copy blockquote{font-family:"Songti SC",serif;font-weight:500;font-size:clamp(26px,3.1vw,46px);line-height:1.72;margin:36px 0;color:#f1e4d0}.classroom-copy p{font-size:15px;line-height:2.2;color:#b4c2c0}.classroom-quote-line{width:70px;height:1px;background:var(--gold);margin-top:32px}.classroom .eyebrow{color:var(--gold)}
/* Journal */
.journal{background:radial-gradient(ellipse at 30% 13%,#1c343332,transparent 40%),#071116}.journal-heading{text-align:center;margin-bottom:58px}.journal-heading .eyebrow:before{display:none}.journal-heading .section-intro{margin-inline:auto}.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.journal-card{text-align:left;background:linear-gradient(150deg,#17282c,#0a191d);border:1px solid #ffffff20;border-radius:21px;overflow:hidden;padding:35px 31px;min-height:330px;display:flex;flex-direction:column;transition:transform .3s,border-color .3s}.journal-card:hover{transform:translateY(-5px);border-color:#d4c29b70}.journal-num{color:var(--gold);font-size:12px;letter-spacing:.2em}.journal-card h3{font-family:"Songti SC",serif;font-weight:500;font-size:27px;line-height:1.55;margin:42px 0 16px}.journal-card p{font-size:13px;color:#9caeaf;line-height:2}.journal-card .mini-link{margin-top:auto;border:0;background:none;padding:25px 0 0;text-align:left;color:#bfe5da;font-size:12px}
/* Footer */
.footer-hero{min-height:590px;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden;background:linear-gradient(180deg,#071116 0%,#13272b 63%,#4c4137 110%);isolation:isolate}.footer-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 69%,#e5a86d33,transparent 30%),radial-gradient(ellipse at 50% 100%,#e2c39f29,transparent 60%);pointer-events:none}.footer-horizon{position:absolute;bottom:0;left:0;right:0;height:40%;background:linear-gradient(0deg,#050d13e8,transparent);clip-path:polygon(0 62%,9% 53%,20% 64%,31% 48%,42% 57%,50% 43%,57% 51%,71% 46%,85% 58%,100% 46%,100% 100%,0 100%)}.footer-content{position:relative;z-index:2}.footer-title{font-family:"Songti SC",serif;font-size:clamp(35px,5vw,72px);font-weight:500;line-height:1.5;letter-spacing:.05em;margin:19px 0 20px}.footer-sub{color:#cbbba8;font-size:15px;letter-spacing:.12em;margin-bottom:38px}.site-footer{background:#050d11;border-top:1px solid #ffffff15}.footer-row{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:30px;color:#8b9d9f;font-size:12px}.footer-row a:hover{color:var(--cyan)}.footer-links{display:flex;gap:25px}.back-top{position:fixed;z-index:70;bottom:26px;right:23px;height:44px;width:44px;border:1px solid #ffffff2f;border-radius:12px;background:#0e2c30cf;color:#d5f7ee;backdrop-filter:blur(10px);display:grid;place-items:center;opacity:0;transform:translateY(15px);pointer-events:none;transition:.3s}.back-top.show{opacity:1;transform:none;pointer-events:auto}
/* Modals / toast */
.modal-shell{position:fixed;inset:0;background:#000c;backdrop-filter:blur(15px);z-index:600;display:none;place-items:center;padding:25px}.modal-shell.open{display:grid}.modal{width:min(680px,100%);max-height:min(86vh,850px);overflow-y:auto;background:#102124;border:1px solid #7ec7ba4b;border-radius:23px;box-shadow:0 30px 120px #000c;padding:38px;position:relative}.modal-close{position:absolute;right:20px;top:20px;color:#e8f1e9;background:#ffffff15;border:1px solid #ffffff2b;border-radius:50%;height:39px;width:39px;font-size:24px;line-height:1}.modal-label{font-size:10px;letter-spacing:.28em;color:var(--cyan);margin-bottom:14px}.modal h2{font-family:"Songti SC",serif;font-size:37px;font-weight:500;line-height:1.4;margin:0 40px 20px 0}.modal p{font-size:14px;color:#c4d2cb;line-height:2.1}.modal img{width:100%;border-radius:12px;margin:10px 0 19px}.modal-meta{color:#e8ba7d;font-size:12px;margin:20px 0}.modal .btn{margin-top:12px}.toast{position:fixed;z-index:900;bottom:25px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#d0f8ef;color:#103332;padding:13px 20px;border-radius:12px;font-size:13px;transition:.3s}.toast.show{opacity:1;transform:translate(-50%,0)}
/* Tablet */
@media(max-width:1100px){.container{width:min(calc(100% - 60px),var(--content))}.brand-caption{display:none}.brand-title{font-size:13px}.nav-links{gap:16px}.hero-inner{grid-template-columns:45% 55%}.hero-scene{width:66%;background-position:48% center}.hero-title{font-size:clamp(64px,7.5vw,90px)}.hero-values{gap:20px;margin-top:29px}.hero-feature{margin-top:24px}.about-image-wrap{height:560px}.lab-wrap{grid-template-columns:1.1fr .9fr}.lab-stage{height:560px}.project-copy{padding:40px}.classroom-inner{gap:5%}}
/* Mobile */
@media(max-width:760px){.container{width:calc(100% - 38px)}.section{padding:95px 0}.nav-row{height:67px}.brand-cn{font-size:28px}.brand-right{padding-left:11px;gap:1px}.brand-title{font-size:11px}.brand-caption{display:block;font-size:6px;letter-spacing:.2em}.nav-links,.desktop-cta{display:none}.menu-toggle{display:grid}.sound-btn{height:36px;width:36px}.site-header{background:#071318dc}.mobile-menu{display:block;position:fixed;z-index:199;top:67px;left:0;right:0;background:#091d20f7;backdrop-filter:blur(20px);border-bottom:1px solid #62ded73c;padding:10px 25px 26px;transform:translateY(-125%);opacity:0;pointer-events:none;transition:transform .45s var(--ease),opacity .3s}.mobile-menu.open{transform:translateY(0);opacity:1;pointer-events:auto}.mobile-menu a{display:block;padding:15px;border-bottom:1px solid #ffffff17;font-size:15px}.hero{min-height:810px;height:100svh;max-height:1050px}.hero-scene{top:64px;left:0;width:100%;height:63%;bottom:auto;background-position:center 22%;background-size:cover;opacity:.83;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 62%,transparent 99%);mask-image:linear-gradient(180deg,#000 0%,#000 62%,transparent 99%)}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#071116 5%,#071116a6 35%,transparent 67%);pointer-events:none}.hero-inner{display:flex;align-items:flex-end;padding-top:70px;padding-bottom:93px}.hero-content{width:100%;margin:0;padding:0}.hero-kicker{font-size:10px}.hero-title{font-size:clamp(50px,11vw,74px);margin:15px 0 14px;letter-spacing:-.07em}.hero-title .underline:after{bottom:-3px}.hero-sub{font-size:16px;line-height:1.65;letter-spacing:0}.hero-meta{font-size:11px;margin:8px 0 21px;letter-spacing:.08em}.btn{padding:14px 17px;font-size:12px}.hero-values{gap:0;justify-content:space-between;margin-top:27px}.hero-value{min-width:auto;text-align:center;justify-items:center;gap:5px}.hero-value .symbol{height:37px;width:37px;font-size:18px}.hero-value span{font-size:10px}.hero-value small{font-size:8px}.hero-feature{display:none}.hero-bottom{bottom:14px}.section-title{font-size:clamp(36px,9vw,56px)}.section-intro{font-size:14px}.split,.classroom-inner{grid-template-columns:1fr;gap:38px}.about-image-wrap{height:420px;max-width:490px;order:2}.about-copy{order:1}.about-copy .lead{font-size:25px;margin:22px 0}.about-copy .body{font-size:13px}.about-float{right:0;bottom:18px;padding:12px 17px}.lab-wrap{grid-template-columns:1fr;margin-top:40px}.lab-stage{height:390px}.orb{width:175px;height:175px}.orb-character{font-size:64px}.orb:before{inset:-15px}.orb:after{inset:-35px}.lab-action{bottom:16px}.mini-modules{left:10px;bottom:15px;gap:4px}.module{width:48px;height:40px;font-size:11px}.drop-target{bottom:15px;right:10px;width:72px;height:40px;font-size:10px}.stage-info{padding:23px}.stage-text{margin-top:26px;min-height:105px}.stage-text h3{font-size:27px}.stage-status{padding-top:20px}.works-top{align-items:start;flex-direction:column;gap:15px}.project-feature{grid-template-columns:1fr}.project-copy{padding:32px 25px 10px}.project-copy .product-brand{margin-bottom:20px}.project-copy h3{font-size:36px}.project-shot{width:111%;justify-self:center;transform:perspective(1200px) rotateY(-4deg) rotateX(3deg) translate(15px,30px);margin-top:20px;margin-bottom:20px}.project-more,.journal-grid{grid-template-columns:1fr}.mini-project{min-height:300px}.classroom-visual{height:420px}.classroom-copy blockquote{font-size:30px}.journal-card{min-height:275px}.footer-hero{min-height:540px}.footer-title{font-size:36px}.footer-row{min-height:140px;flex-wrap:wrap;align-content:center;gap:18px}.footer-links{gap:15px}.modal{padding:28px 22px}.modal h2{font-size:27px}.back-top{bottom:16px;right:12px}.hero-values .hero-value:last-child{display:none}}
@media(max-width:385px){.hero-title{font-size:48px}.hero-values .hero-value:last-child{display:none}.hero-buttons .btn{padding:13px 14px}.hero{min-height:760px}.hero-scene{height:57%}.hero-content{padding-bottom:5px}}
@media(min-width:761px) and (max-height:780px){.hero{min-height:730px}.hero-content{transform:scale(.93);transform-origin:left center}.hero-values{margin-top:28px}.hero-feature{margin-top:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none}}
/* ===== JINGRAN CINEMA V1.2 : art direction ===== */
:root{--cinema-cyan:#66e0d8;--cinema-blue:#3b8baa;--cinema-gold:#edc48d}
body{background:#050e13}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:48;opacity:.11;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 130 130' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.58' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.26'/%3E%3C/svg%3E")}
/* True WebGL render surface intentionally above opaque section backgrounds, below navigation and dialogs. */
#cinema-webgl{position:fixed;inset:0;z-index:18;width:100vw;height:100svh;pointer-events:none;opacity:.94;mix-blend-mode:screen;transition:opacity .5s ease;transform:translateZ(0)}
#cinema-webgl.is-muted{opacity:0}
.site-header{z-index:200}.mobile-menu{z-index:210}.modal-shell{z-index:600}.back-top{z-index:70}#progress{z-index:1000}
.hero{min-height:780px;height:min(980px,100svh);background:radial-gradient(ellipse at 76% 42%,#0b333b 0%,#07151b 43%,#030b10 90%)}
.hero::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 35%,rgba(0,17,22,.22) 55%,#06141b 97%),linear-gradient(0deg,#061014 0%,transparent 25%)}
.hero-scene{transform:translate3d(calc(var(--mx,0px)*.16),calc(var(--my,0px)*.10 + var(--heroParallax,0px)),0) scale(var(--heroScale,1));transform-origin:44% 62%;transition:transform .17s linear;will-change:transform;filter:saturate(.91) contrast(1.06)}
.hero-warmth{background:radial-gradient(ellipse,rgba(235,174,92,.20),transparent 70%);width:750px}
.hero-content{position:relative;transform:translate3d(calc(var(--mx,0px)*-.08),calc(var(--my,0px)*-.05),0);transition:transform .2s ease-out}
.hero-content::before{content:"";position:absolute;left:0;top:-55px;width:110px;height:1px;background:linear-gradient(90deg,var(--cyan),transparent);opacity:.75}
.hero-title{letter-spacing:-.04em;text-shadow:0 10px 35px #0009}
.hero-kicker{letter-spacing:.31em}
.hero-feature{box-shadow:0 15px 50px #0006,0 0 0 1px #b2eed018 inset}
.cinema-top-line{position:absolute;z-index:4;left:3%;right:3%;top:102px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;font:600 10px/1.5 ui-monospace,Consolas,monospace;color:rgba(198,226,225,.65);letter-spacing:.25em}
.cinema-top-line span:first-child::before{content:"";display:inline-block;width:6px;height:6px;margin-right:12px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
.cinema-corner{position:absolute;z-index:2;pointer-events:none;width:45px;height:45px;opacity:.38;filter:drop-shadow(0 0 5px #65dcd1)}
.cinema-corner.tl{left:28px;top:135px;border-left:1px solid #6fdcd2;border-top:1px solid #6fdcd2}
.cinema-corner.tr{right:28px;top:135px;border-right:1px solid #6fdcd2;border-top:1px solid #6fdcd2}
.cinema-corner.bl{left:28px;bottom:52px;border-left:1px solid #6fdcd2;border-bottom:1px solid #6fdcd2}
.cinema-corner.br{right:28px;bottom:52px;border-right:1px solid #6fdcd2;border-bottom:1px solid #6fdcd2}
.hero-film-index{position:absolute;z-index:5;left:50%;bottom:29px;transform:translateX(-50%);color:#c4e6e1b8;font:500 10px/1.4 ui-monospace,monospace;letter-spacing:.25em;pointer-events:none}
.hero-film-index span{color:var(--gold)}
/* Desktop film rail */
.cinema-rail{position:fixed;z-index:65;right:22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.cinema-rail a{display:flex;align-items:center;gap:10px;min-height:21px;justify-content:end;text-decoration:none;outline-offset:5px}
.cinema-rail .rail-name{opacity:0;transform:translateX(5px);color:#e0e9e6;letter-spacing:.12em;font-size:10px;transition:opacity .22s,transform .22s}
.cinema-rail a:hover .rail-name,.cinema-rail a.active .rail-name,.cinema-rail a:focus-visible .rail-name{opacity:1;transform:none}
.cinema-rail .rail-dot{display:block;width:5px;height:5px;border-radius:50%;background:#819ca4;box-shadow:0 0 0 3px #061219;border:1px solid #b8d9da6b;transition:all .3s}
.cinema-rail a.active .rail-dot{background:var(--cyan);width:7px;height:7px;box-shadow:0 0 13px var(--cyan),0 0 0 3px #06252b}
.film-chapter{position:fixed;left:28px;bottom:27px;z-index:60;color:#b7d5d4;font-size:10px;letter-spacing:.22em;font-family:ui-monospace,Consolas,monospace;pointer-events:none;display:flex;gap:12px;align-items:center;text-shadow:0 1px 10px #061019}
.film-chapter b{font-weight:500;color:var(--gold);font-size:14px}
.film-chapter::before{content:"";width:23px;height:1px;background:var(--gold)}
/* Portal between chapters – room for WebGL photon gate */
.film-portal{position:relative;min-height:76svh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:linear-gradient(180deg,#071116 0%,#06151d 45%,#071116 100%);isolation:isolate}
.film-portal:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(44,129,141,.18),transparent 51%),radial-gradient(ellipse at 48% 56%,rgba(238,169,94,.08),transparent 32%);pointer-events:none}
.film-portal .container{position:relative;z-index:3}
.film-portal .portal-en{font:500 11px/1.5 ui-monospace,monospace;letter-spacing:.45em;color:#7fc9c9}
.film-portal .portal-title{font-family:"Songti SC","Noto Serif CJK SC",serif;font-weight:500;font-size:clamp(39px,5vw,80px);letter-spacing:.12em;margin:30px 0;line-height:1.55;text-shadow:0 4px 30px #000c}
.film-portal .portal-desc{font-size:15px;line-height:2.1;color:#aec4c5;margin:0 auto;max-width:550px}
.film-portal .portal-line{display:block;height:1px;width:70px;margin:26px auto;background:linear-gradient(90deg,transparent,var(--cyan),transparent)}
.film-portal .portal-index{position:absolute;right:5%;bottom:8%;color:#a7cdca80;font:10px ui-monospace,monospace;letter-spacing:.23em}
.portal-gate{position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at center,transparent 22%,#071116ee 87%)}
/* Clear independent characters & artistic miniature frames */
.about-image-wrap{height:620px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:250px 250px 30px 30px;isolation:isolate;background:radial-gradient(ellipse at 55% 30%,#173d46,#101d25 55%,#080f14 92%)}
.about-image-wrap:before{z-index:2;pointer-events:none;background:linear-gradient(0deg,#061116 0%,transparent 37%)}
.about-image{position:relative;inset:auto;width:min(83%,365px);aspect-ratio:1;height:auto;border-radius:30px;background-image:none!important;background-size:cover;background-position:center;box-shadow:0 35px 85px #0009,0 0 0 1px #ffffff2b;transform:rotate(-3deg);filter:saturate(.98)}
.about-image::before{content:"";position:absolute;inset:-12px;border:1px solid #62ded735;border-radius:36px;transform:rotate(6deg)}
.about-image-wrap::after{content:"CONCEPT / THINKING";position:absolute;bottom:105px;left:50%;transform:translateX(-50%);z-index:3;font:500 10px/1.5 ui-monospace,monospace;color:#a7ccc8;letter-spacing:.3em;white-space:nowrap}
.about-float{z-index:4}
.works-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:30px;align-items:end}
.works-side{display:grid;gap:16px}
.works-side .section-intro{margin:0;font-size:15px;line-height:1.9}
.mentor-strip{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:11px;align-items:center;border:1px solid #a3d7d02b;border-radius:18px;background:linear-gradient(120deg,#123039c9,#09181ce8);box-shadow:0 17px 40px #0005}
.mentor-strip .mentor-portrait{height:122px;background:linear-gradient(#05111622,#05111644),none center/cover no-repeat;border-radius:12px;box-shadow:inset 0 0 0 1px #ffffff14}
.mentor-strip h3{font-size:16px;font-weight:500;margin:0 0 8px;color:#e7e7db}
.mentor-strip p{font-size:12px;color:#b3cbc9;line-height:1.85;margin:0}
.mentor-strip small{font:500 9px ui-monospace,Consolas,monospace;color:var(--cyan);letter-spacing:.13em}
.journal-heading{margin-bottom:36px}
.journal-feature{display:grid;grid-template-columns:minmax(180px,310px) 1fr;max-width:930px;margin:0 auto 46px;align-items:center;gap:33px;padding:20px 24px 20px 20px;border:1px solid #a3d7d028;border-radius:27px;background:linear-gradient(125deg,#0b2931cc,#0b171c);box-shadow:0 28px 60px #0005}
.journal-feature .journal-pose{height:195px;background:linear-gradient(0deg,#0005,transparent 60%),none center/cover no-repeat;border-radius:18px}
.journal-feature h3{font:500 clamp(23px,3vw,33px)/1.55 "Songti SC",serif;margin:6px 0 12px}
.journal-feature p{color:#b7c7c7;font-size:14px;line-height:2.05;margin:0}
.journal-feature .eyebrow{font-size:10px}
/* 3D illusion preserving readable text */
.film-depth{transform:perspective(1250px) translateY(var(--filmY,0px)) rotateX(var(--filmRX,0deg));transform-origin:50% 50%;transition:transform .2s ease-out;will-change:transform}
.lab-stage{perspective:1100px;transform-style:preserve-3d;box-shadow:0 50px 100px #0008,0 0 0 1px #59b7c522 inset}
.lab-grid{transform:perspective(850px) rotateX(17deg) scale(1.12);transform-origin:50% 55%;opacity:.35}
.orb{transform-style:preserve-3d;filter:drop-shadow(0 0 24px #6ff2e05f);transition:transform .7s cubic-bezier(.22,1,.36,1),filter .6s}
.lab-wrap[data-active="0"] .orb{transform:translateZ(32px) rotateY(-6deg)}
.lab-wrap[data-active="1"] .orb{transform:translateZ(70px) rotateY(18deg) rotateX(-6deg)}
.lab-wrap[data-active="2"] .orb{transform:translateZ(40px) rotateY(-14deg) rotateX(5deg)}
.lab-stage::after{content:"DEPTH / REALTIME";position:absolute;right:22px;bottom:17px;font:9px ui-monospace,monospace;color:#7acdc3aa;letter-spacing:.22em;pointer-events:none}
/* cinematic controls */
.motion-control{appearance:none;display:flex;align-items:center;gap:8px;color:#c8e3df;border:1px solid #a2c8c62e;background:transparent;border-radius:999px;padding:9px 13px;font-size:11px;letter-spacing:.06em;transition:.2s}
.motion-control:hover{border-color:#62ded7aa;color:#fff}
.motion-control .motion-led{display:block;width:6px;height:6px;border-radius:50%;background:#61e1d8;box-shadow:0 0 11px #61e1d8}
.motion-control[aria-pressed="true"] .motion-led{background:#94a6a5;box-shadow:none}
.cinema-fallback{position:fixed;z-index:15;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(ellipse at 60% 42%,#4bafab17,transparent 53%)}
.no-webgl .cinema-fallback{opacity:1}
/* responsive cinematic recompose */
@media(max-width:1100px){.cinema-rail{display:none}.film-chapter{left:21px;bottom:16px}.works-top{grid-template-columns:1fr}.works-side{grid-template-columns:1fr 1fr;align-items:center}.mentor-strip{max-width:380px}}
@media(max-width:760px){
  .cinema-top-line,.cinema-corner{display:none}.film-chapter{display:none}#cinema-webgl{opacity:.7}
  .hero{height:auto;min-height:840px}.hero-scene{background-size:cover;background-position:center 34%;transform:translateY(calc(var(--heroParallax,0px)*.45)) scale(var(--heroScale,1))}
  .hero-content{transform:none}.hero-film-index{bottom:17px;letter-spacing:.15em}
  .film-portal{min-height:570px}.film-portal .portal-title{font-size:39px;letter-spacing:.08em}.film-portal .portal-desc{font-size:13px;padding:0 12px}
  .about-image-wrap{height:470px}.about-image{width:min(75%,280px)}.about-image-wrap::after{bottom:68px}
  .works-side{grid-template-columns:1fr}.mentor-strip{grid-template-columns:112px 1fr;max-width:none}.mentor-strip .mentor-portrait{height:96px}
  .journal-feature{grid-template-columns:1fr;gap:18px;padding:13px}.journal-feature .journal-pose{height:240px}.journal-feature>div:last-child{padding:2px 7px 15px}
  .motion-control{padding:8px 9px;font-size:0;gap:0}.motion-control .motion-led{width:8px;height:8px}
  .film-depth{transform:none!important}
}
@media(prefers-reduced-motion:reduce){#cinema-webgl{display:none!important}.hero-scene,.hero-content,.film-depth{transform:none!important;transition:none!important}.portal-gate{opacity:.4}}
/* V1.2 final composition refinements */
.hero-film-index{display:none}
@media(max-width:760px){.hero{height:100svh;min-height:840px}.hero-inner{height:100%;padding-bottom:106px}.hero-content{margin-top:auto}.hero-scene{opacity:.78}.hero-kicker{color:#aad6d1}}



/* ===== Clean Cinematic V1.2.1 — contrast and focus, not particle saturation ===== */
#cinema-webgl{opacity:var(--cinema-opacity,.08)!important;mix-blend-mode:screen!important;filter:saturate(.72)!important;transition:opacity .65s ease!important}
.hero-stars,#dust{display:none!important}
.hero{background:radial-gradient(ellipse at 75% 34%,#0a262e,#07141c 48%,#050c11 90%)!important;overflow:hidden}
.hero::after{background:linear-gradient(90deg,transparent 40%,rgba(3,12,17,.16) 60%,#061219 99%),linear-gradient(0deg,#060e12 0%,transparent 23%)!important}
.hero-warmth{background:radial-gradient(ellipse,rgba(223,171,113,.09),transparent 75%)!important;filter:blur(38px)!important;width:530px!important;height:220px!important;left:-40px!important}
.hero-scene{left:0!important;top:78px!important;bottom:0!important;width:57%!important;z-index:-2!important;
  background-image:none!important;background-repeat:no-repeat!important;background-size:contain!important;background-position:19% 100%!important;
  transform:translate3d(calc(var(--mx,0px)*.07),calc(var(--my,0px)*.06 + var(--heroParallax,0px)*.55),0) scale(var(--heroScale,1))!important;
  transform-origin:35% 80%!important;opacity:1!important;filter:drop-shadow(0 24px 42px rgba(0,0,0,.22))!important}
.hero-title{text-shadow:0 5px 20px rgba(0,0,0,.45)!important}.hero-title em{text-shadow:none!important}
.hero-rings{opacity:.23!important;filter:none!important}.hero-content:before{opacity:.34!important}
.hero-feature{box-shadow:0 13px 32px rgba(0,0,0,.23)!important}
.section{background-image:none!important}
.film-portal{background:linear-gradient(180deg,#071116,#08151b 48%,#071116)!important}
.film-portal:before{background:radial-gradient(ellipse at 50% 49%,rgba(54,148,151,.08),transparent 49%)!important}
.portal-gate{background:radial-gradient(ellipse at center,transparent 18%,rgba(7,17,22,.52) 78%,rgba(7,17,22,.84) 100%)!important}
.project-feature,.journal-feature,.mentor-strip,.lab-stage,.classroom-visual,.journal-card,.project-card{box-shadow:0 20px 47px rgba(0,0,0,.23)!important;border-color:rgba(163,215,208,.14)!important}
.about-image-wrap{background:radial-gradient(ellipse at 48% 42%,#143239,#0d1b22 62%,#091117 98%)!important}
.about-image{display:grid!important;place-items:center!important;width:83%!important;height:78%!important;inset:auto!important;position:relative!important;
 background:none!important;border:1px solid rgba(132,215,207,.21)!important;border-radius:45% 45% 17% 17%!important;
 box-shadow:inset 0 0 85px rgba(34,99,104,.13)!important;transform:none!important;filter:none!important;overflow:visible!important}
.about-image:before{display:none!important}.about-image .idea-map{width:100%;height:100%;overflow:visible}
.about-image .idea-rune{filter:drop-shadow(0 0 15px rgba(95,220,208,.1))}
.about-image-wrap::after{content:"EXPLORE  /  CREATE  /  SHARE"!important;position:absolute;bottom:46px;left:40px;transform:none!important;z-index:3;color:#93c9c3;font:500 10px ui-monospace,Consolas,monospace;letter-spacing:.18em;white-space:nowrap}
.about-float{z-index:4}
.works-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:30px;align-items:end}
.works-side{display:grid;gap:16px}.works-side .section-intro{margin:0;font-size:15px;line-height:1.9}
.mentor-strip{display:grid;grid-template-columns:145px 1fr;gap:16px;padding:11px;align-items:center;border-radius:18px;background:linear-gradient(120deg,rgba(13,36,43,.87),rgba(8,24,28,.9))!important}
.mentor-strip .mentor-portrait{height:138px;background:radial-gradient(circle at 50% 15%,rgba(99,215,207,.07),transparent 58%),none center center/contain no-repeat!important;border-radius:12px;box-shadow:none!important}
.mentor-strip h3{font-size:16px;font-weight:500;margin:0 0 8px;color:#edf2e9}.mentor-strip p{font-size:12px;color:#b3cbc9;line-height:1.85;margin:0}.mentor-strip small{font:500 9px ui-monospace,Consolas,monospace;color:var(--cyan);letter-spacing:.13em}
.journal-heading{margin-bottom:36px}.journal-feature{display:grid;grid-template-columns:minmax(180px,310px) 1fr;max-width:930px;margin:0 auto 46px;align-items:center;gap:33px;padding:20px 24px 20px 20px;border-radius:27px;background:linear-gradient(125deg,#102b32,#0b171d)!important}
.journal-feature .journal-pose{height:208px;background:var(--journal-visual, none) center center/contain no-repeat!important;border-radius:18px;box-shadow:none!important}
.journal-feature h3{font:500 clamp(23px,3vw,33px)/1.55 "Songti SC",serif;margin:6px 0 12px}.journal-feature p{color:#b7c7c7;font-size:14px;line-height:2.05;margin:0}.journal-feature .eyebrow{font-size:10px}
.cinema-corner{opacity:.14!important;filter:none!important}
.lab-grid{opacity:.18!important}.orb{filter:drop-shadow(0 0 10px rgba(100,221,206,.25))!important}
.film-depth{transition:transform .2s ease-out,box-shadow .25s ease-out!important}
@media(max-width:1100px){.hero-scene{width:57%!important;background-position:14% 100%!important}.works-top{grid-template-columns:1fr}.works-side{grid-template-columns:1fr 1fr;align-items:center}.mentor-strip{max-width:380px}}
@media(max-width:760px){
 #cinema-webgl{opacity:var(--cinema-opacity,.06)!important}
 .hero{min-height:820px!important;height:100svh!important;background:radial-gradient(ellipse at 50% 28%,#0c2630,#07151b 46%,#050b11 92%)!important}
 .hero-scene{position:absolute!important;left:0!important;right:0!important;top:102px!important;bottom:auto!important;width:100%!important;height:48%!important;background-size:contain!important;background-position:center top!important;opacity:1!important;
   -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 65%,transparent 100%)!important;mask-image:linear-gradient(180deg,#000 0%,#000 65%,transparent 100%)!important}
 .hero-content{position:relative;z-index:2}.hero-kicker{color:#bbdad5!important}
 .works-side{grid-template-columns:1fr}.mentor-strip{grid-template-columns:112px 1fr;max-width:none}.mentor-strip .mentor-portrait{height:124px}
 .about-image-wrap{height:440px!important}.about-image{width:85%!important;height:78%!important}.about-image-wrap::after{bottom:27px!important;left:28px!important}
 .journal-feature{grid-template-columns:1fr;gap:18px;padding:13px}.journal-feature .journal-pose{height:190px}.journal-feature>div:last-child{padding:2px 7px 15px}
 .film-depth{transform:none!important}
}
@media(prefers-reduced-motion:reduce){#cinema-webgl{display:none!important}.hero-scene,.hero-content,.film-depth{transform:none!important;transition:none!important}}

/* ===== V1.2.2 Balanced Cinematic: scenic hero, only one philosophy lab ===== */
:root{--v122-space:#071317;--v122-white:#f7f3eb;--v122-line:rgba(142,209,201,.20)}
.hero{background:linear-gradient(110deg,#09171b,#08161b 55%,#07171c)!important;isolation:isolate!important}
.hero-scene{
  left:0!important;top:78px!important;bottom:0!important;right:auto!important;
  height:auto!important;width:66.5%!important;
  background-image:url('../images/hero-classroom-scene.webp')!important;
  background-repeat:no-repeat!important;background-size:cover!important;
  background-position:44% 34%!important;
  opacity:.98!important;
  -webkit-mask-image:none!important;mask-image:none!important;
  transform:translate3d(calc(var(--mx,0px)*.025),calc(var(--heroParallax,0px)*.35),0) scale(var(--heroScale,1))!important;
  filter:saturate(.92) contrast(1.015)!important;transform-origin:45% 65%!important;
}
.hero::after{
  background:linear-gradient(90deg,rgba(1,11,16,.02) 0%,rgba(2,13,18,.07) 36%,rgba(3,17,22,.69) 54%,#06171c 69%,#06171c 100%),
             linear-gradient(0deg,#061217 0%,transparent 16%,transparent 82%,rgba(3,11,15,.06) 100%)!important;
}
.hero-title{text-shadow:0 5px 20px rgba(0,0,0,.18)!important}
.hero-warmth{opacity:.3!important}
#cinema-webgl{filter:saturate(.65)!important}
/* The intro section must introduce the maker, not repeat a second schematic of the philosophy. */
.about-image-wrap{
  background:radial-gradient(ellipse at 48% 25%,#1d4348 0%,#0d2630 50%,#08171d 100%)!important;
  border:1px solid var(--v122-line)!important;
  border-radius:260px 260px 28px 28px!important;
  position:relative!important;overflow:hidden!important;
}
.about-image-wrap:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 48% 84%,rgba(237,183,119,.10),transparent 50%);}
.about-image-wrap:after{display:none!important;content:none!important}
.about-image{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  border:0!important;border-radius:0!important;
  background:none!important;box-shadow:none!important;filter:none!important;transform:none!important;
  display:flex!important;align-items:flex-end!important;justify-content:center!important;overflow:hidden!important;
}
.about-portrait{position:relative;display:block;width:91%;height:99%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 28px rgba(0,0,0,.28));}
.about-image-wrap:focus-within{outline:2px solid var(--cyan)}
.about-float{bottom:28px!important;right:19px!important;max-width:215px!important;background:rgba(7,22,28,.82)!important;backdrop-filter:blur(14px)!important;border:1px solid rgba(174,213,200,.2)!important;border-radius:14px!important;box-shadow:0 10px 30px rgba(0,0,0,.22)!important}
.about-float::before{content:'JINGRAN / NOTES';display:block;font:500 9px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.16em;color:#8dcfc8;margin-bottom:10px}
.identity-caption{color:#a2cec7;font:500 11px ui-monospace,Consolas,monospace;letter-spacing:.12em;margin:0 0 15px}
.identity-caption span{color:var(--gold);padding:0 .4em}
/* Scenic cover carries emotion; text and cards have their own quiet stage. */
.hero-content{position:relative;z-index:3}
.hero-feature{background:rgba(12,39,40,.70)!important;backdrop-filter:blur(16px)!important;border-color:rgba(165,211,190,.19)!important}
.lab-stage{background-color:#081d24!important;border-color:rgba(139,213,204,.20)!important}
.lab-grid{opacity:.11!important}
.orbit-point{opacity:.62}
.works .mentor-portrait{height:174px!important;background-image:none!important;background-size:contain!important;background-position:center bottom!important}
.mentor-strip{grid-template-columns:155px 1fr!important;min-height:184px!important;gap:12px!important;padding:10px 16px 10px 10px!important}
.mentor-strip p{line-height:1.8!important}
.journal-feature .journal-pose{height:246px!important;background-size:contain!important;background-position:center!important}
.journal-feature{gap:24px!important}
/* contrast, focus and scene-number readability */
.cinema-corner{opacity:.12!important}
.hero .scene-label,.hero .hero-status,.hero .hero-kicker{letter-spacing:.17em!important}
#cinema-webgl{opacity:min(var(--cinema-opacity,.06),.13)!important}
@media(max-width:1100px){
 .hero-scene{width:70%!important;background-position:46% center!important}
 .hero::after{background:linear-gradient(90deg,transparent 0%,rgba(4,15,20,.16) 32%,rgba(5,20,26,.82) 57%,#06171c 76%),linear-gradient(0deg,#061217,transparent 23%)!important}
}
@media(max-width:760px){
 .hero{min-height:840px!important;height:100svh!important;background:linear-gradient(180deg,#08191f,#07131a 70%,#061116)!important}
 .hero-scene{width:100%!important;left:0!important;right:0!important;top:78px!important;bottom:auto!important;height:57%!important;
   background-size:cover!important;background-position:43% 34%!important;opacity:.92!important;
   -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 54%,transparent 100%)!important;
   mask-image:linear-gradient(180deg,#000 0%,#000 54%,transparent 100%)!important;
   transform:none!important}
 .hero::after{background:linear-gradient(180deg,rgba(5,15,20,.08) 0%,rgba(5,18,23,.07) 32%,#07171e 61%,#07151b 100%)!important}
 .hero-content{z-index:4!important}
 .about-image-wrap{height:510px!important;border-radius:220px 220px 22px 22px!important}
 .about-portrait{height:100%!important;width:90%!important}
 .about-float{right:12px!important;bottom:22px!important;max-width:190px!important;font-size:12px!important}
 .mentor-strip{grid-template-columns:112px 1fr!important;min-height:145px!important}
 .works .mentor-portrait{height:139px!important}
 .journal-feature .journal-pose{height:213px!important}
}
@media(max-width:400px){.about-image-wrap{height:450px!important}.hero-scene{height:55%!important;background-position:46% 30%!important}}
@media(prefers-reduced-motion:reduce){.hero-scene{transform:none!important;animation:none!important}}

/* =======================================================
   V1.2.3 — Unframed cinematic portrait / 人物章节视觉重构
   No hard arch, no picture-in-card, no overlay on the legs.
   ======================================================= */
#about{overflow:hidden}
#about .split{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(50px,7vw,112px);align-items:center}
#about .about-image-wrap{
 position:relative!important;isolation:isolate!important;overflow:visible!important;
 height:clamp(570px,49vw,740px)!important;min-width:0!important;
 border:0!important;border-radius:0!important;box-shadow:none!important;
 background:radial-gradient(ellipse 60% 50% at 52% 43%,rgba(35,113,120,.24),transparent 90%),
            radial-gradient(ellipse 38% 19% at 49% 88%,rgba(232,181,110,.09),transparent 100%)!important;
 clip-path:none!important;-webkit-mask-image:none!important;mask-image:none!important;
}
#about .about-image-wrap::before{
 content:''!important;display:block!important;position:absolute!important;inset:12% 7% 13%!important;
 z-index:-1!important;pointer-events:none!important;
 background:radial-gradient(ellipse 43% 45% at 49% 44%,rgba(85,177,178,.20),rgba(21,71,78,.07) 59%,transparent 91%)!important;
 filter:blur(38px)!important;border:0!important;border-radius:0!important;
}
#about .about-image-wrap::after{
 content:''!important;display:block!important;position:absolute!important;
 bottom:3%!important;left:9%!important;right:9%!important;width:auto!important;height:1px!important;
 background:linear-gradient(90deg,transparent,rgba(210,187,143,.30) 35%,rgba(109,207,203,.25) 69%,transparent)!important;
 opacity:.64!important;z-index:1!important;pointer-events:none!important;
 border-radius:0!important;box-shadow:none!important;
}
#about .about-image{
 display:flex!important;align-items:flex-end!important;justify-content:center!important;
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 background:transparent!important;border:0!important;border-radius:0!important;
 box-shadow:none!important;overflow:visible!important;transform:none!important;filter:none!important;
}
#about .about-portrait{
 display:block!important;position:relative!important;
 width:auto!important;max-width:110%!important;height:98%!important;max-height:100%!important;
 object-fit:contain!important;object-position:center bottom!important;
 border:0!important;border-radius:0!important;box-shadow:none!important;
 transform:scale(1.06)!important;transform-origin:center bottom!important;filter:drop-shadow(0 24px 29px rgba(0,0,0,.22))!important;
 -webkit-mask-image:none!important;mask-image:none!important;
}
#about .about-float{display:none!important}
#about .about-copy{max-width:550px}
#about .about-editorial-quote{
 display:flex;align-items:start;gap:19px;margin:25px 0 28px;padding:4px 0 4px 23px;
 border-left:1.5px solid rgba(224,177,111,.76);background:none;box-shadow:none;
}
#about .about-editorial-mark{font-family:Georgia,serif;font-size:44px;line-height:.85;color:rgba(233,191,130,.75);font-style:italic}
#about .about-editorial-quote p{font:400 clamp(16px,1.45vw,21px)/1.7 'Songti SC','Noto Serif CJK SC',serif;letter-spacing:.035em;color:#ecdfcb;margin:0 0 7px}
#about .about-editorial-quote small{font-size:10px;font-weight:600;letter-spacing:.18em;color:#809d9c}
#about .identity-caption{letter-spacing:.17em}
@media(max-width:900px){
 #about .split{grid-template-columns:1fr;gap:22px!important}
 #about .about-image-wrap{height:clamp(420px,92vw,590px)!important;max-width:550px;width:100%;margin-inline:auto;order:0!important}
 #about .about-portrait{height:100%!important;max-width:100%!important}
 #about .about-copy{max-width:680px;width:100%;margin-inline:auto;order:1!important}
 #about .about-editorial-quote{margin:20px 0 27px}
}
@media(max-width:480px){
 #about .about-image-wrap{height:clamp(375px,103vw,495px)!important;margin-top:-6px}
 #about .about-portrait{height:100%!important;max-width:114%!important;transform:scale(1.08)!important;transform-origin:center bottom!important}
 #about .about-editorial-quote{padding-left:16px;gap:9px}
 #about .about-editorial-quote small{font-size:9px;letter-spacing:.12em}
}
@media(prefers-reduced-motion:reduce){#about .about-image-wrap,#about .about-portrait{transform:none!important;animation:none!important}}


/* ============================================================
   V1.2.4 · WORKS SECTION — OPEN CINEMATIC CHARACTER
   Remove framed thumbnail, make speaker a large independent subject.
   ============================================================ */
#works{overflow:hidden}
#works .works-top{
 display:grid!important;grid-template-columns:minmax(0,1.10fr) minmax(0,.90fr)!important;
 min-height:490px;margin-bottom:14px!important;gap:10px!important;
 align-items:end!important;position:relative;isolation:isolate;
}
#works .works-heading{position:relative;z-index:3;align-self:center;padding:20px 0 28px}
#works .works-heading .section-title{margin:27px 0 30px!important;font-size:clamp(54px,5.2vw,84px);line-height:1.26;white-space:nowrap;letter-spacing:.015em}
#works .works-lead{font-size:16px;line-height:2.05;color:#bfcfcd;margin:0;max-width:600px}
#works .works-note{display:flex;align-items:center;gap:17px;margin-top:25px;font-size:12px;color:#92c5c2;letter-spacing:.06em;line-height:1.8}
#works .works-note-rule{display:block;width:41px;flex:0 0 41px;height:1px;background:linear-gradient(90deg,#e9bd87,#72dad0)}
#works .works-character{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:center;
 margin:0 -28px -16px -48px;min-height:515px;height:515px;pointer-events:none;
}
#works .works-character:before{content:'';position:absolute;z-index:-1;
 inset:8% 3% 4%;border-radius:50%;background:radial-gradient(ellipse at 53% 53%,rgba(73,151,158,.19) 0%,rgba(50,119,124,.08) 33%,transparent 68%);filter:blur(10px);pointer-events:none}
#works .works-character-halo{position:absolute;bottom:22px;left:23%;right:12%;height:28px;
 background:radial-gradient(ellipse,rgba(235,183,117,.15),transparent 72%);filter:blur(16px)}
#works .works-character img{position:relative;z-index:1;height:100%;width:auto;max-width:100%;object-fit:contain;object-position:bottom center;
 filter:drop-shadow(0 22px 24px rgba(0,0,0,.2));transform:translateY(0);transition:transform .65s cubic-bezier(.22,1,.36,1)}
#works .works-character figcaption{position:absolute;z-index:3;right:16px;top:20px;
 color:#78c7c2;font-size:10px;letter-spacing:.16em;white-space:nowrap;font-weight:650}
#works .works-character figcaption span{color:#caad7e;margin:0 5px}
#works .project-feature{position:relative;z-index:3}
@media(min-width:1350px){
 #works .works-top{min-height:540px}
 #works .works-character{height:570px;min-height:570px;margin-right:0;margin-left:-65px;margin-bottom:-18px}
}
@media(min-width:790px) and (max-width:1200px){
 #works .works-top{grid-template-columns:minmax(0,1fr) minmax(0,.76fr)!important;min-height:465px}
 #works .works-heading .section-title{white-space:normal;font-size:clamp(53px,5.5vw,72px)}
 #works .works-character{height:475px;min-height:475px;margin-left:-35px;margin-right:-18px}
 #works .works-character figcaption{top:26px;right:4px}
}
@media(max-width:789px){
 #works{padding-top:95px}
 #works .works-top{grid-template-columns:1fr!important;min-height:0;gap:3px!important;margin-bottom:16px!important}
 #works .works-heading{align-self:start;padding:0;z-index:3}
 #works .works-heading .section-title{font-size:clamp(43px,9.4vw,65px);white-space:normal;letter-spacing:0;margin:20px 0 15px!important}
 #works .works-lead{font-size:14px;line-height:1.9;max-width:100%;}
 #works .works-desktop-break{display:none}
 #works .works-note{font-size:11px;gap:10px;margin-top:15px;letter-spacing:0}
 #works .works-note-rule{width:25px;flex-basis:25px}
 #works .works-character{justify-content:center;height:355px;min-height:355px;margin:8px -14px -6px}
 #works .works-character img{height:100%;max-width:100%}
 #works .works-character figcaption{top:12px;right:6px;letter-spacing:.09em;font-size:9px}
 #works .works-character:before{inset:6% 8% 7%;background:radial-gradient(ellipse at 50% 55%,rgba(69,149,154,.17),transparent 67%)}
 #works .project-feature{margin-top:12px}
}
@media(max-width:400px){#works .works-character{height:318px;min-height:318px}#works .works-heading .section-title{font-size:43px}}
@media(prefers-reduced-motion:reduce){#works .works-character img{transition:none!important;transform:none!important}}


/* v1.3: site-wide legal footer and resource management */
.site-footer{padding-bottom:0}
.legal-footer{border-top:1px solid rgba(194,227,221,.11);color:#97abae;padding:18px 0 26px;font-size:12px;line-height:1.9}
.legal-footer-inner{display:flex;justify-content:space-between;align-items:center;gap:10px 28px;flex-wrap:wrap}
.legal-footer a{color:#b3d4d0;text-decoration:none;transition:color .2s}
.legal-footer a:hover,.legal-footer a:focus-visible{color:var(--cyan)}
.legal-records{display:flex;gap:8px 20px;flex-wrap:wrap;align-items:center}
.legal-records .pending{color:#82949a}
@media(max-width:700px){.legal-footer-inner{flex-direction:column;align-items:flex-start}.legal-records{gap:4px 16px}}
/* Idle off-screen sections stay paint-light; keep section sizes governed by their natural content. */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}