.learning-intro{padding:96px 0 66px}
.learning-intro h1{font-size:clamp(44px,5.2vw,68px);font-weight:450;letter-spacing:-3.3px;line-height:1.08}
.learning-intro h1 span{color:var(--text-secondary)}
.learning-lead{color:var(--text-secondary);font-size:17px;line-height:1.7;margin-top:25px}
.start-learning{margin-top:29px;min-height:48px}






.lesson-library{scroll-margin-top:100px;padding-top:40px}
.lesson-tabs{display:none;gap:8px;overflow-x:auto;padding:12px 5px 15px;margin-inline:-5px;scrollbar-width:thin;overscroll-behavior-inline:contain;position:static;top:auto;background:var(--surface-canvas);border-bottom:1px solid var(--line)}
.has-lessons .lesson-tabs{display:flex}
.lesson-tabs button{flex-shrink:0;min-height:44px;border:1px solid transparent;padding:0 17px;border-radius:7px;font-size:13px;background:transparent;color:var(--text-secondary);white-space:nowrap}
.lesson-tabs button:hover{background:var(--surface-card);color:white}
.lesson-tabs button[aria-selected=true]{background:var(--surface-raised);border-color:var(--line-hover);color:white}
.library-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:23px 0 29px}
.library-heading h2{font-size:25px;font-weight:450;letter-spacing:-.8px}
.library-heading p{font-size:12px;color:var(--text-secondary);line-height:1.6}
.lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:27px 24px}
.lesson-card{min-width:0;border:1px solid var(--line);border-radius:14px;background:var(--surface-card);overflow:hidden}
.lesson-card:hover{border-color:var(--line-hover)}
.lesson-link{display:block;width:100%;height:100%;padding:0;border:0;background:transparent;text-align:left;font:inherit;color:inherit}
.lesson-link:focus-visible{outline-offset:-3px;border-radius:14px}
.lesson-cover{position:relative;aspect-ratio:16/10;background:var(--surface-canvas);border-bottom:1px solid var(--line);padding:18px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.lesson-cover img{width:100%;height:100%;object-fit:contain;border-radius:6px}
.lesson-card[data-lesson=overview] .lesson-cover{padding:0}
.lesson-card[data-lesson=overview] .lesson-cover img{object-fit:cover;border-radius:0}
.lesson-play{width:46px;height:46px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--surface-raised);border:1px solid var(--line-hover)}
.lesson-play svg{margin-left:2px}
.cover-status{position:absolute;right:12px;bottom:12px;padding:5px 8px;font-size:10px;color:var(--text-body);border:1px solid var(--line-hover);border-radius:5px;background:var(--surface-card)}
.lesson-card-copy{padding:23px 23px 22px}
.lesson-meta{font-size:11px;color:var(--text-secondary);line-height:1.5;margin-bottom:12px}
.lesson-card h3{font-size:19px;line-height:1.3;font-weight:450;letter-spacing:-.45px;margin-bottom:12px}
.lesson-card-copy>p:not(.lesson-meta){font-size:13px;line-height:1.7;color:var(--text-secondary);min-height:44px}
.lesson-action{display:flex;align-items:center;justify-content:space-between;margin-top:23px;min-height:25px;font-size:12px;color:var(--text-body)}
.lesson-action>span{color:var(--text-secondary);font-size:16px}
.library-note{color:var(--text-secondary);font-size:12px;line-height:1.8;margin:29px 0 0}
.learning-bottom{margin:96px 0 88px;padding-top:42px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:32px}
.learning-bottom .eyebrow{margin-bottom:14px}
.learning-bottom h2{font-size:35px;letter-spacing:-1.4px}
.learning-bottom p:last-child{margin-top:16px;font-size:14px;color:var(--text-secondary);line-height:1.8}
@media(max-width:1000px){.lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.lesson-library{padding-top:26px}.lesson-tabs{top:auto}.learning-intro{padding:62px 0 45px}.learning-intro h1{font-size:52px;letter-spacing:-2.7px}.library-heading{margin-top:15px}.lesson-grid{gap:20px 16px}.lesson-card-copy{padding:20px}.lesson-card h3{font-size:18px}.learning-bottom{margin-top:72px;margin-bottom:65px}.learning-bottom h2{font-size:31px}}
@media(max-width:540px){.lesson-library{padding-top:22px}.lesson-tabs{top:auto}.learning-intro{padding:48px 0 35px}.learning-intro h1{font-size:clamp(35px,9.4vw,48px);letter-spacing:-1.8px}.learning-intro .eyebrow{font-size:12px;margin-bottom:20px}.learning-lead{font-size:15px;line-height:1.7;margin-top:21px}.start-learning{margin-top:23px}.lesson-tabs{padding-bottom:12px}.lesson-tabs button{font-size:13px;padding-inline:14px}.library-heading{display:block;margin:15px 0 23px}.library-heading h2{font-size:25px}.library-heading p{margin-top:10px}.lesson-grid{grid-template-columns:1fr;gap:22px}.lesson-card-copy{padding:23px}.lesson-card h3{font-size:21px}.lesson-card-copy>p:not(.lesson-meta){font-size:14px;min-height:0}.lesson-action{font-size:13px;margin-top:21px;min-height:30px}.lesson-meta{font-size:12px}.cover-status{font-size:11px}.lesson-cover{padding:20px}.library-note{font-size:13px;margin-top:23px}.learning-bottom{display:block;margin:62px 0 55px;padding-top:32px}.learning-bottom h2{font-size:30px}.learning-bottom .button{margin-top:24px;width:100%;min-height:48px}}

/* Centered learning hero with the homepage ribbons. */
.learning-intro{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding:65px 0 82px;min-height:580px;height:min(760px,calc(100svh - 80px));display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line)}
.learning-hero-copy{width:100%;display:flex;flex-direction:column;align-items:center;max-width:1100px}
.learning-intro h1{font-size:clamp(52px,5.6vw,80px);letter-spacing:-3.6px;line-height:1.06;font-weight:450}
.learning-intro .eyebrow{margin-bottom:26px;font-size:13px}
.learning-lead{font-size:17px;line-height:1.8;color:#b6b6b6;margin-top:26px}
.start-learning{margin-top:30px}

.lesson-library{scroll-margin-top:16px}
.lesson-tabs{top:auto}
@media(max-width:800px){.learning-intro{height:calc(100svh - 70px);min-height:580px;padding:62px 0 74px}.learning-intro h1{font-size:60px;letter-spacing:-2.9px}.learning-lead{font-size:16px}}
@media(max-width:540px){.learning-intro{height:auto;min-height:calc(100svh - 64px);padding:82px 0 88px}.learning-intro h1{font-size:clamp(34px,9.5vw,48px);letter-spacing:-1.9px}.learning-lead{font-size:14px;margin-top:23px;max-width:310px}.learning-intro .eyebrow{font-size:12px;margin-bottom:25px}.start-learning{margin-top:26px}}