/* Edge-to-edge editorial landing. Text widths stay readable inside full-width sections. */
.welcome-page{margin:0;background:#fff;color:#202020}.welcome-page *{box-sizing:border-box}.welcome-page main{width:100%;padding:0}.site-width{width:100%;max-width:1560px;margin:0 auto;padding:0 clamp(24px,5.5vw,88px)}
.welcome-skip{position:fixed;top:12px;left:12px;z-index:99;padding:12px 18px;background:#222;color:white;transform:translateY(-150%)}.welcome-skip:focus{transform:none}
.welcome-header{display:block;min-height:0;border:0;background:#fff}.welcome-header>.site-width{display:flex;align-items:center;gap:32px;min-height:100px}.welcome-header .brand,.welcome-footer .brand{font:650 25px/1.2 var(--display);letter-spacing:-1.2px}.welcome-header nav{display:flex;align-items:center;gap:30px;margin-left:auto;font-size:14px}.welcome-header nav a{color:#444;padding:12px 0;text-decoration:none}.welcome-header nav a:hover{color:#111;text-decoration:underline;text-underline-offset:6px}.welcome-header .primary{margin-left:10px;min-height:45px}
.welcome-kicker{font-size:11px;letter-spacing:1.25px;line-height:1.7;font-weight:600;color:#555;margin:0 0 20px}.welcome-page h2{font:600 clamp(30px,3.5vw,50px)/1.18 var(--display);letter-spacing:-1.6px;margin:0}.welcome-page h3{font:600 23px/1.35 var(--display);letter-spacing:-.6px;margin:0 0 15px}.welcome-page p{line-height:1.85}.welcome-page a:focus-visible,.welcome-page button:focus-visible,.welcome-page summary:focus-visible{outline:2px solid #333;outline-offset:5px}
.welcome-hero{background:#fff;border-bottom:1px solid #ddd}.hero-canvas{position:relative;isolation:isolate;background:white;min-height:660px;overflow:hidden;padding-top:30px}.hero-canvas>.welcome-kicker{position:relative;z-index:4}.welcome-piano{position:absolute;z-index:1;right:3%;top:15px;width:56%;height:620px;object-fit:contain;pointer-events:none}.hero-canvas h1{position:absolute;left:5.5%;top:130px;z-index:2;font:700 clamp(70px,9.15vw,143px)/1.02 Georgia,'Times New Roman',serif;letter-spacing:-7px;white-space:nowrap;margin:0;color:#fff;mix-blend-mode:difference;pointer-events:none}.hero-canvas h1>span{display:inline}.welcome-hero-copy{position:relative;z-index:3;width:40%;max-width:470px;margin-top:276px;padding-bottom:80px}.welcome-hero-copy .welcome-promise{font:550 26px/1.35 var(--display);letter-spacing:-.7px;margin:0 0 17px}.welcome-hero-copy>p:not(.welcome-promise){font-size:15px;line-height:1.8;color:#555;max-width:350px;margin:0 0 22px}.welcome-hero-copy .primary{min-height:48px}.hero-scroll{position:absolute;bottom:24px;left:5.5%;z-index:4;font-size:12px;text-decoration:none;color:#555;display:flex;align-items:center;gap:30px}.hero-scroll span{font-size:20px}
.welcome-section{padding:90px 0;scroll-margin-top:25px}.section-heading{display:grid;grid-template-columns:1fr .85fr;gap:80px;align-items:end;margin-bottom:54px}.section-heading>p{font-size:17px;line-height:1.85;color:#555;max-width:530px;margin:0 0 3px}.offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px}.offer-grid article{border-top:1px solid #bbb;padding-top:25px}.section-number{font:500 17px/1 var(--display);color:#777;display:block;margin-bottom:26px}.offer-grid h3{margin-bottom:17px}.offer-grid p{font-size:15px;color:#555;margin:0;max-width:370px}
.lesson-preview-section{background:#f3f3f0}.lesson-showcase{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}.preview-steps{display:flex;flex-direction:column}.preview-steps button{display:flex;align-items:center;gap:22px;border:0;border-top:1px solid #d1d1ca;padding:24px 12px 24px 0;background:transparent;color:#666;text-align:left}.preview-steps button:last-child{border-bottom:1px solid #d1d1ca}.preview-steps button[aria-pressed=true]{color:#111}.preview-steps button>span{font-size:14px;align-self:flex-start;margin-top:5px}.preview-steps strong{display:block;font-size:22px;font-weight:600;letter-spacing:-.5px}.preview-steps small{display:block;font-size:13px;font-weight:400;margin-top:6px}.preview-steps b{margin-left:auto;font-size:23px;font-weight:400;opacity:0}.preview-steps button[aria-pressed=true] b{opacity:1}.lesson-preview{background:#fff;min-width:0;min-height:420px;padding:35px 38px;border:1px solid #deded7;border-radius:4px;box-shadow:0 12px 35px #00000006}.preview-top{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #eee;padding-bottom:17px;margin-bottom:26px;font-size:11px;letter-spacing:.5px;color:#666}.lesson-preview h3{font-size:26px}.lesson-preview p{font-size:15px;color:#555;max-width:52ch;margin:0 0 18px}.preview-definition{padding:20px 22px;background:#f7f7f4;margin:22px 0 0;border-left:2px solid #222;font-size:16px;line-height:1.8}.preview-definition b{color:#222}.preview-caption{font-size:12px;color:#666;line-height:1.8;max-width:920px;margin:25px 0 0}.preview-score{width:100%;height:155px;display:block;margin:4px 0 10px}.preview-score .staff{stroke:#8b8b87;stroke-width:.8}.preview-score .demo-note{fill:#222;stroke:#222;stroke-width:1.5}.preview-score .demo-note.current{fill:#fff;stroke:#222;stroke-width:2.5}.preview-score .demo-note.done{opacity:.35}.preview-score .demo-note.error{fill:#a84740;stroke:#a84740}.preview-score .current-zone{fill:#f1f1e9}.preview-score.has-error .current-zone{fill:#f9e9e7}.demo-keys{display:flex;gap:8px;margin-top:14px}.demo-keys button{font-size:15px;min-width:48px;min-height:47px;border:1px solid #aaa;border-radius:2px;background:white;color:#222}.demo-keys button:hover{background:#eee}.demo-feedback{font-size:14px!important;color:#444!important;margin:14px 0 0!important;min-height:48px}.demo-feedback.error{color:#963a34!important}.demo-reset{border:0;border-bottom:1px solid #888;color:#444;background:none;padding:4px 0;font-size:13px;margin:10px 0}.preview-answer{display:block;width:100%;text-align:left;border:1px solid #ccc;border-radius:2px;background:white;color:#333;padding:14px 18px;margin:12px 0;font-size:14px}.preview-answer:hover{background:#f6f6f1}.preview-check{width:44px;height:44px;border:1px solid #222;border-radius:50%;display:grid;place-items:center;margin-bottom:25px;font-size:23px}
.public-program{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin:0}.public-program li{border-top:1px solid #aaa;padding-top:20px;display:flex;flex-direction:column}.program-roman{font:400 60px/1.3 Georgia,serif;color:#444;margin-bottom:20px}.public-program .welcome-kicker{font-size:10px;margin:0 0 9px}.public-program h3{font-size:29px;margin-bottom:18px}.public-program li>p:not(.welcome-kicker){font-size:15px;color:#555;margin:0 0 25px;flex:1}.program-meta{font-size:13px;color:#555;line-height:1.8}.public-extra{display:flex;align-items:center;gap:30px;padding:30px;margin-top:42px;background:#f4f4f0;border-left:2px solid #555}.public-extra .section-number{font-size:36px;margin:0 14px 0 0;align-self:flex-start}.public-extra .welcome-kicker{font-size:10px;margin-bottom:6px}.public-extra h3{font-size:24px;margin-bottom:8px}.public-extra p:not(.welcome-kicker){font-size:15px;color:#555;margin:0;max-width:700px}.public-extra .program-meta{margin-left:auto;flex-shrink:0;text-align:right}
.connection-section{background:#222;color:#fff}.connection-layout{display:grid;grid-template-columns:1fr 1fr;gap:110px}.connection-section .welcome-kicker{color:#b9b9b0}.connection-section h2{color:white;margin-bottom:30px}.connection-section p{color:#c8c8c0;font-size:15px;max-width:490px}.connection-steps{list-style:none;margin:0;padding:0}.connection-steps li{display:flex;gap:25px;border-top:1px solid #555;padding:25px 0 10px}.connection-steps li>span{font-size:12px;color:#bbb;padding-top:4px}.connection-steps h3{font-size:22px;color:white;margin-bottom:9px}.connection-steps p{font-size:14px;line-height:1.8}
.faq-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:100px}.faq-layout>div>p:last-child{font-size:16px;color:#555;max-width:400px;margin:25px 0 0}.welcome-faq details{border-top:1px solid #ccc;padding:23px 0}.welcome-faq details:last-child{border-bottom:1px solid #ccc}.welcome-faq summary{list-style:none;font-size:17px;line-height:1.6;font-weight:500;cursor:pointer;position:relative;padding-right:30px}.welcome-faq summary::-webkit-details-marker{display:none}.welcome-faq summary:after{content:'+';position:absolute;right:0;font-size:24px;top:-4px;font-weight:400}.welcome-faq details[open] summary:after{content:'−'}.welcome-faq details p{font-size:15px;color:#555;margin:20px 30px 0 0}
.welcome-cta{background:#f3f3f0;padding:80px 0;text-align:center}.welcome-cta h2{font-size:clamp(38px,5vw,64px);margin-bottom:24px}.welcome-cta p:not(.welcome-kicker){font-size:16px;color:#555;margin:0 0 26px}.cta-note{display:block;font-size:12px;color:#666;margin-top:18px}.welcome-footer{margin:0;padding:0;border:0}.welcome-footer>.site-width{display:flex;align-items:center;gap:30px;min-height:125px}.welcome-footer p{font-size:13px;color:#555;margin:0}.welcome-footer a:last-child{margin-left:auto;font-size:14px;text-decoration:none;color:#333}
@media(min-width:1600px){.hero-canvas h1{left:88px}.hero-scroll{left:88px}}
@media(max-width:1050px){.welcome-header>.site-width{gap:20px}.welcome-header nav{gap:20px;font-size:12px}.welcome-header .brand{font-size:23px}.welcome-header .primary{font-size:12px;padding:11px 16px;margin:0}.hero-canvas{min-height:610px}.welcome-piano{height:530px;width:60%;right:0;top:55px}.hero-canvas h1{top:120px;letter-spacing:-4px;font-size:9.4vw}.welcome-hero-copy{margin-top:245px;width:42%}.welcome-hero-copy .welcome-promise{font-size:24px}.welcome-hero-copy>p:not(.welcome-promise){font-size:14px}.section-heading{gap:45px}.welcome-section{padding:70px 0}.lesson-showcase{gap:32px;grid-template-columns:.75fr 1.25fr}.lesson-preview{padding:30px}.connection-layout,.faq-layout{gap:60px}.offer-grid,.public-program{gap:27px}}
@media(max-width:760px){.welcome-header>.site-width{flex-wrap:wrap;min-height:0;padding-top:24px;padding-bottom:0;gap:20px}.welcome-header .brand{font-size:23px}.welcome-header .primary{margin-left:auto;font-size:13px;padding:10px 14px;min-height:43px}.welcome-header nav{width:100%;order:3;justify-content:space-between;gap:14px;margin:0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:3px 0;font-size:12px}.welcome-header nav a{padding:13px 0;white-space:nowrap}.hero-canvas{min-height:580px;padding-top:25px}.hero-canvas>.welcome-kicker{font-size:10px}.hero-canvas h1{top:84px;left:24px;white-space:nowrap;font-size:clamp(40px,16vw,106px);letter-spacing:-4px;line-height:.97}.hero-canvas h1>span{display:block}.hero-canvas h1>span+span{padding-left:24px}.welcome-hyphen{display:none}.welcome-piano{top:157px;right:-8%;width:80%;height:390px}.welcome-hero-copy{width:48%;margin-top:265px;padding-bottom:78px}.welcome-hero-copy .welcome-promise{font-size:20px;letter-spacing:-.5px}.welcome-hero-copy>p:not(.welcome-promise){display:none}.welcome-hero-copy .primary{min-height:44px;font-size:12px;padding:10px 12px;white-space:nowrap}.hero-scroll{left:24px;font-size:11px;bottom:22px}.welcome-page h2{font-size:33px;letter-spacing:-1px}.section-heading{grid-template-columns:1fr;gap:24px;margin-bottom:32px}.section-heading>p{font-size:16px;max-width:600px}.welcome-kicker{font-size:10px;margin-bottom:15px}.welcome-section{padding:56px 0}.offer-grid{grid-template-columns:1fr;gap:26px}.offer-grid article{display:grid;grid-template-columns:35px 1fr;column-gap:16px;padding-top:23px}.offer-grid .section-number{grid-row:span 2;font-size:14px;margin-top:5px}.offer-grid h3{font-size:23px;margin-bottom:10px}.offer-grid p{max-width:none;font-size:15px}.lesson-showcase{grid-template-columns:1fr;gap:24px}.preview-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}.preview-steps button{padding:18px 0;gap:12px}.preview-steps button:last-child{border-bottom:0}.preview-steps strong{font-size:18px}.preview-steps small{font-size:11px}.preview-steps b{display:none}.preview-steps button>span{font-size:11px}.lesson-preview{padding:26px 22px;min-height:400px}.lesson-preview h3{font-size:24px}.lesson-preview p{font-size:15px}.preview-top{font-size:10px;gap:12px;margin-bottom:22px}.preview-caption{font-size:12px}.public-program{grid-template-columns:1fr;gap:26px}.public-program li{display:grid;grid-template-columns:52px 1fr;column-gap:20px;padding-top:22px}.program-roman{grid-row:span 4;font-size:46px;line-height:1;margin:4px 0 0}.public-program h3{font-size:27px;margin-bottom:12px}.public-program li>p:not(.welcome-kicker){margin-bottom:16px}.public-extra{padding:25px 20px;margin-top:32px;gap:16px;flex-wrap:wrap}.public-extra>div{flex:1;min-width:180px}.public-extra h3{font-size:22px}.public-extra .section-number{margin-right:0}.public-extra .program-meta{margin:0 0 0 38px;text-align:left}.public-extra .program-meta br{display:none}.public-extra .program-meta br:after{content:' · '}.connection-layout,.faq-layout{grid-template-columns:1fr;gap:30px}.connection-section h2{margin-bottom:24px}.connection-steps li{padding-top:22px}.faq-layout>div>p:last-child{max-width:none;font-size:15px}.welcome-faq summary{font-size:16px}.welcome-cta{padding:58px 0}.welcome-cta h2{font-size:43px}.welcome-cta .primary{font-size:14px}.welcome-footer>.site-width{padding-top:32px;padding-bottom:32px;min-height:0;flex-wrap:wrap;gap:17px}.welcome-footer .brand{font-size:23px}.welcome-footer p{width:100%;order:3;font-size:12px}.welcome-footer a:last-child{font-size:13px}.welcome-page .section-number{line-height:1.3}}
@media(max-width:380px){.welcome-header .brand{font-size:20px}.welcome-header nav{font-size:11px;gap:9px}.welcome-header .primary{font-size:12px;padding:9px 12px}.hero-canvas{min-height:545px}.welcome-piano{height:330px;top:150px}.welcome-hero-copy{margin-top:230px;width:52%}.welcome-hero-copy .welcome-promise{font-size:18px}.welcome-page h2{font-size:30px}.preview-steps{gap:0 12px}.preview-steps button{gap:8px}.preview-steps strong{font-size:17px}.preview-steps small{font-size:10px}.lesson-preview{padding:24px 17px}.preview-top{font-size:9px}.demo-keys{gap:7px}.demo-keys button{min-width:42px}.public-program li{grid-template-columns:42px 1fr;gap:0 14px}}
@media(prefers-reduced-motion:reduce){.welcome-page{scroll-behavior:auto}}
@media(min-width:381px) and (max-width:760px){.welcome-piano{height:300px;top:140px;width:75%;right:-1%}.welcome-hero-copy{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;max-width:none;margin-top:400px}.welcome-hero-copy .welcome-promise{font-size:19px;margin:0;flex:1}.welcome-hero-copy .primary{flex-shrink:0}.hero-canvas{min-height:600px}}
@media(max-width:380px){.welcome-piano{height:270px;top:145px;width:78%;right:-4%}.welcome-hero-copy{display:block;width:100%;max-width:none;margin-top:380px}.welcome-hero-copy .welcome-promise{font-size:20px;margin:0 0 20px;max-width:230px}.hero-canvas{min-height:620px}}
