:root{--bg:#0a0a0a;--fg:#f6f4f2;--muted:#b4b0aa;--border:#ffffff26}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid #fff;outline-offset:6px}header{position:fixed;z-index:20;top:0;left:0;width:100%;padding:24px 4vw;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#000b,transparent)}.brand{display:flex;gap:13px;align-items:center;font-size:12px;letter-spacing:2px;line-height:1.4}.brand small{font-size:9px;letter-spacing:4px}.monogram{font-family:Georgia,serif;font-size:42px;line-height:1}nav{display:flex;gap:35px;font-size:13px}nav span{margin-left:12px}#sound{background:#0004;border:1px solid var(--border);padding:11px 16px;font-size:12px}#sound span{margin-left:14px}.journey{height:310vh}.stage{height:100svh;position:sticky;top:0;overflow:hidden;background:#000}.scene{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;will-change:transform,opacity}.interior{background-image:url('assets/interior.webp');background-position:50% 60%;transform:scale(1.65);transform-origin:50% 85%}.performance{background-image:url('assets/performance.webp');background-position:38% center;opacity:0}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#0005,transparent 40%,#0005),linear-gradient(0deg,#000b,transparent 45%)}.opening{position:absolute;top:29%;left:7vw;max-width:750px}.eyebrow{font-size:10px;letter-spacing:3px;line-height:1.8;margin:0 0 24px}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.045em}h1{font-size:clamp(60px,7.8vw,120px);line-height:.98;margin:0 0 28px}h2{font-size:clamp(42px,5vw,76px);line-height:1.06;margin:0 0 24px}p{color:var(--muted);font-size:16px;line-height:1.7}.intro{font-size:16px}.text-link{display:inline-flex;gap:36px;border-bottom:1px solid #ffffff70;padding:12px 0;font-size:13px;margin-top:15px}.reveal{position:absolute;left:55%;right:5%;top:38%;opacity:0;transform:translateY(30px)}.reveal h2{font-size:clamp(38px,4vw,62px)}.scroll-cue{position:absolute;left:7vw;bottom:42px;font-size:9px;letter-spacing:2px;display:flex;align-items:center;gap:18px}.line{height:1px;width:50px;background:#fff8}.chapter{position:absolute;right:5vw;bottom:42px;font-size:9px;letter-spacing:1.7px;display:flex;gap:25px;align-items:center}.progress{width:70px;height:1px;background:#ffffff30}.progress i{height:1px;background:#fff;display:block;width:0}.keyboard-section{padding:100px 5vw 50px;overflow:hidden}.section-heading{text-align:center;max-width:700px;margin:0 auto 70px}.keys{height:220px;max-width:1300px;margin:auto;position:relative;display:flex;perspective:900px}.key{border:0;border-right:2px solid #222;border-radius:0 0 4px 4px;background:linear-gradient(90deg,#cbc8c2,#fff 25%,#eee);height:100%;flex:1;box-shadow:inset 0 -12px 0 #aaa;position:relative;transform-origin:top;transition:transform .16s,background .16s}.key.active{transform:rotateX(-9deg);background:linear-gradient(#ead1ac,#fff0d9);box-shadow:inset 0 -7px 0 #a58252,0 0 22px #d6a96550}.black{position:absolute;z-index:3;width:2.5%;height:63%;background:linear-gradient(90deg,#080808,#333 40%,#050505);box-shadow:inset 0 -8px 0 #000;border:1px solid #333}.black.active{background:linear-gradient(#75543a,#20130b)}.keyboard-foot{display:flex;justify-content:space-between;max-width:1300px;margin:25px auto;color:#999;font-size:9px;letter-spacing:2px}.mary-section{padding:120px 9vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:center}.mary-photo{position:relative}.mary-photo img{display:block;width:100%;max-height:700px;object-fit:cover}.mary-photo span{position:absolute;bottom:22px;left:22px;font-size:9px;letter-spacing:3px}.mary-copy h2{font-size:clamp(42px,4.4vw,65px)}.mary-copy p{max-width:460px}dl{margin-top:40px}dl div{border-top:1px solid var(--border);padding:17px 0;display:flex;justify-content:space-between;gap:20px}dt{font-size:13px}dd{margin:0;color:#999;font-size:12px}.program-section{padding:100px 7vw;background:#131313}.program-intro{position:relative;margin-bottom:60px}.program-intro>p:last-child{font-size:18px}.status{position:absolute;top:0;right:0;font-size:9px;letter-spacing:2px;border:1px solid #ffffff35;padding:10px 14px}.program-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:7vw;align-items:start}.program-layout>img{width:100%;height:610px;object-fit:cover;object-position:55% center}.program-details h3{font-family:Georgia,serif;font-weight:400;font-size:36px;margin:0 0 18px}.program-details>p{max-width:440px}ol{list-style:none;margin:30px 0;padding:0}li{display:flex;gap:22px;padding:23px 0;border-top:1px solid var(--border)}li>span{font-size:10px;color:#999;padding-top:4px}h4{font-weight:400;font-size:17px;margin:0}li p{font-size:14px;margin:8px 0 0}.launch-button{padding:16px 22px;background:transparent;border:1px solid #aaa;font-size:13px;display:flex;gap:40px}.launch-note{padding:25px 30px;margin-top:35px;border:1px solid var(--border);max-width:850px}.launch-note h3{font-weight:400}.disclaimer{font-size:11px;margin:45px 0 0;max-width:650px}.closing{position:relative;min-height:75vh;display:flex;align-items:center;padding:100px 7vw;overflow:hidden}.closing>img{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;object-position:25% center;opacity:.45}.closing>div{position:relative;margin-left:50%}footer{padding:30px 5vw;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#aaa;letter-spacing:1px}@media(max-width:700px){header{padding:20px}.brand{font-size:10px}.monogram{font-size:34px}nav{gap:15px}nav a:first-child{display:none}#sound{font-size:10px;padding:9px}.opening{left:7%;right:7%;top:32%}h1{font-size:62px}.interior{background-position:50% center}.performance{background-position:25% center}.reveal{left:7%;right:7%;top:58%;background:#0005;padding:15px}.reveal h2{font-size:40px}.chapter{right:7%;bottom:25px}.scroll-cue{bottom:65px}.keyboard-section{padding-top:65px}.keys{height:145px;min-width:580px;margin-left:calc((100% - 580px)/2)}.keyboard-foot{font-size:8px;letter-spacing:1px;gap:15px}.mary-section{padding:70px 7%;grid-template-columns:1fr;gap:45px}.mary-photo img{max-height:560px}.program-section{padding:70px 7%}.status{position:static;display:inline-block;margin-bottom:20px}.program-layout{grid-template-columns:1fr;gap:35px}.program-layout>img{height:300px}.program-intro h2{font-size:44px}.closing>div{margin-left:0}.closing{min-height:65vh}.closing>img{opacity:.25}footer{flex-wrap:wrap;font-size:9px}.section-heading{margin-bottom:40px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.journey{height:100svh}.interior{transform:none!important}.opening{opacity:1!important;transform:none!important}.performance,.reveal{display:none}.key{transition:none}}

/* Three-photo scroll study: 5x -> 2x -> 1x. */
.piano-wide,.piano-medium,.piano-close{background-position:center;transform-origin:center}
.piano-wide{background-image:url('assets/piano-1x.webp')}
.piano-medium{background-image:url('assets/piano-2x.webp')}
.piano-close{background-image:url('assets/piano-5x.webp')}
.shade{background:linear-gradient(90deg,#000b 0%,#0005 55%,#0002),linear-gradient(0deg,#000b,transparent 45%)}
.reveal{left:7vw;right:auto;max-width:650px;top:38%}
@media(max-width:700px){.reveal{left:7%;right:7%;top:45%}.chapter{font-size:8px;letter-spacing:1px}}
@media(prefers-reduced-motion:reduce){.piano-wide{transform:none!important}.piano-medium,.piano-close{display:none}}
/* Student achievements: real evidence within the established dark canvas. */
.success-section{padding:100px 7vw 80px;border-top:1px solid var(--border)}
.success-intro{display:grid;grid-template-columns:1.3fr 1fr;gap:8vw;align-items:end;margin-bottom:60px}.success-intro>p{max-width:420px;margin-bottom:28px}.success-intro h2{margin:0;text-wrap:balance}
.success-feature{display:grid;grid-template-columns:1.5fr 1fr;gap:4vw;align-items:start}.success-stage{margin:0;position:relative;min-height:660px;background:#171717;overflow:hidden}.success-stage>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:55% center}.success-stage:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,#000e)}.success-stage figcaption{position:absolute;bottom:32px;left:32px;right:32px;z-index:1}.success-section h3{font-family:Georgia,serif;font-size:clamp(30px,3vw,46px);font-weight:400;letter-spacing:-.035em;line-height:1.1;margin:0 0 20px;text-wrap:balance}.success-stage figcaption p{font-size:14px;margin:0}.success-stage .eyebrow{display:block;margin-bottom:15px;color:#e2d1b9}.carnegie-feature{padding:15px 0}.carnegie-feature>p{font-size:14px}.carnegie-feature .evidence-image{height:360px;margin-top:20px;width:100%;background:#171717}.evidence-image{position:relative;display:block;padding:0;border:0;background:#171717;width:100%;overflow:hidden}.evidence-image img{width:100%;height:100%;object-fit:contain;display:block}.evidence-image>span{position:absolute;right:12px;bottom:12px;padding:8px 12px;background:#080808e8;color:#fff;font-size:10px;letter-spacing:.4px}.evidence-image:hover>span{background:#36312a}.evidence-note{font-size:12px!important;line-height:1.6;max-width:340px}.success-subheading{margin:90px 0 35px;border-top:1px solid var(--border);padding-top:35px}.success-subheading .eyebrow{margin-bottom:14px}.success-subheading>p:last-child{font-size:14px;margin:0}.award-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:35px 24px}.award-card[hidden]{display:none}.award-card .evidence-image{height:240px;padding:12px}.award-caption{padding-top:17px}.award-year{font-size:10px!important;letter-spacing:1px;color:#d3b58c;margin:0 0 12px;line-height:1.5}.success-section h4{font-size:16px;line-height:1.4;font-weight:400}.award-caption>p:last-child{font-size:12px;line-height:1.6;margin:10px 0 0}.award-caption>p span{color:#888}.archive-toggle{border:1px solid #ffffff50;background:transparent;padding:16px 22px;display:flex;gap:40px;font-size:13px;margin:40px auto 0}.concert-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.concert-card .evidence-image{height:310px;margin-bottom:22px}.concert-card:not(.poster) .evidence-image img{object-fit:cover}.concert-card>p:last-child{font-size:13px;margin-top:10px}.teaching-recognition{display:grid;grid-template-columns:1fr 1fr;gap:6vw;margin-top:85px;padding-top:45px;border-top:1px solid var(--border);align-items:center}.teaching-recognition p{font-size:14px;max-width:460px}.teacher-evidence{display:grid;grid-template-columns:1fr 1fr;gap:18px}.teacher-evidence .evidence-image{height:260px}.success-footnote{font-size:11px;margin:50px 0 0;max-width:650px;color:#92908a}#evidence-dialog{background:#0c0c0c;color:#fff;border:1px solid #ffffff40;padding:58px 20px 18px;width:min(1000px,94vw);max-height:94svh}#evidence-dialog::backdrop{background:#000d}#evidence-full{display:block;width:100%;max-height:75svh;object-fit:contain}#evidence-caption{font-size:13px;margin:15px 0 0;text-align:center} .evidence-close{position:absolute;right:20px;top:14px;border:1px solid #ffffff60;padding:8px 14px;background:transparent;font-size:12px}
@media(max-width:1000px){.award-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.success-stage{min-height:620px}.concert-card .evidence-image{height:250px}}
@media(max-width:700px){nav a[href="#success"]{display:none}.success-section{padding:70px 7%}.success-intro,.success-feature,.teaching-recognition{grid-template-columns:1fr;gap:30px}.success-intro{margin-bottom:35px}.success-intro>p{margin:0}.success-stage{min-height:440px}.success-stage figcaption{left:22px;right:22px;bottom:24px}.carnegie-feature{padding:0}.carnegie-feature .evidence-image{height:350px}.award-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.award-card .evidence-image{height:190px;padding:8px}.award-card .evidence-image>span{font-size:8px;padding:6px;right:6px;bottom:6px}.success-section h4{font-size:14px}.award-year{font-size:9px!important}.success-subheading{margin-top:60px}.concert-grid{grid-template-columns:1fr;gap:35px}.concert-card .evidence-image{height:300px}.teacher-evidence .evidence-image{height:220px}.archive-toggle{padding:15px;gap:20px}.teaching-recognition{margin-top:60px}}
.teacher-evidence{grid-template-columns:repeat(3,minmax(0,1fr))}.teacher-evidence .evidence-image{height:240px}
@media(max-width:700px){.teacher-evidence{grid-template-columns:1fr 1fr}.teacher-evidence .evidence-image:first-child{grid-column:1/-1}.teacher-evidence .evidence-image{height:220px}}
.success-stage>img{object-position:left center}
/* Continuous camera movement from the user's darkened video. */
.hero-video{position:absolute;top:80px;left:0;width:100%;height:calc(100% - 80px);object-fit:cover;object-position:center top;pointer-events:none;filter:brightness(.52) contrast(1.12) saturate(.72)}
.stage{background:#070707}.stage.video-fallback{background:#070707 url('assets/piano-opener-poster.webp') center/cover no-repeat}
.shade{background:linear-gradient(90deg,#000a,#0001 65%),linear-gradient(0deg,#000d,transparent 55%),linear-gradient(#0009,transparent 30%),radial-gradient(ellipse at 55% 45%,transparent 30%,#0006 100%)}
.reveal{top:48%}.reveal h2{font-size:clamp(38px,4vw,62px)}
@media(max-width:700px){.hero-video{top:70px;height:calc(100% - 70px)}.reveal{top:49%}}
@media(prefers-reduced-motion:reduce){.hero-video{display:none}.stage{background-image:url('assets/piano-opener-poster.webp')}}

.brand .school-brand-name{font:400 25px/1.08 Georgia,serif;letter-spacing:-.4px;white-space:nowrap}.brand .school-brand-name small{font:11px/1.8 Arial,sans-serif;letter-spacing:1.4px}@media(max-width:700px){.brand .school-brand-name{font-size:22px}.brand .school-brand-name small{font-size:10px;letter-spacing:1.2px}}

/* Shared school logo, sized for both desktop and mobile headers. */
header .brand{flex-shrink:0}header .brand .school-brand-logo{display:block;width:210px;height:60px;object-fit:contain;object-position:left center}@media(max-width:700px){header .brand .school-brand-logo{width:180px;height:51px}}

/* Metallic gold drawn through the original logo's alpha mask. Piano brass: #ac8951; fallboard gold: #d8b66e. */
header .brand .school-brand-metallic{display:block;width:210px;height:60px;background:linear-gradient(112deg,#92703c 0%,#d8b66e 16%,#fff0bd 23%,#ac8951 32%,#dfbd77 45%,#fff2c8 49%,#d8b66e 54%,#a17b40 67%,#f1d598 80%,#b99050 100%);background-size:220% 100%;background-position:40% 50%;-webkit-mask:url('/assets/dr-gao-school-logo-white.png') left center/contain no-repeat;mask:url('/assets/dr-gao-school-logo-white.png') left center/contain no-repeat;animation:school-gold-shimmer 9s ease-in-out infinite}
@keyframes school-gold-shimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@media(max-width:700px){header .brand .school-brand-metallic{width:180px;height:51px}}
@media(prefers-reduced-motion:reduce){header .brand .school-brand-metallic{animation:none;background-position:40% 50%}}
