/* Games headline with a quiet, one-time learning revision. */
.learning-hero{max-width:960px;padding-block:48px}
.learning-hero .games-title{max-width:850px;margin:22px auto 28px;font-size:clamp(36px,5.2vw,70px);line-height:1.08;letter-spacing:-.04em;font-weight:500;color:#e4edea}
.learning-hero .learning-title{margin:0 0 28px;font-size:26px;line-height:1.4;font-weight:400;letter-spacing:-.025em}
.learning-visual{display:flex;align-items:baseline;justify-content:center;gap:.25em;white-space:nowrap}
.learning-lead{color:#b9cec4}
.learning-revision{display:inline-flex;align-items:baseline;justify-content:center;gap:.25em;white-space:nowrap}
.learning-doing{display:inline-block;position:relative;color:#8aaba0;text-decoration:none;font-weight:400}
.learning-doing::after{content:'';position:absolute;left:-.04em;right:-.04em;top:54%;height:1.5px;background:#b1d7c4;transform:rotate(-7deg) scaleX(1);transform-origin:left center;animation:learning-strike .55s cubic-bezier(.3,.65,.25,1) .9s both}
.learning-playing{display:inline-block;color:#c3e9d3;animation:learning-reveal .7s cubic-bezier(.2,.7,.2,1) 1.25s both}
.learning-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.learning-hero .model-intro{margin:0 auto 12px}
.learning-hero .model-heading h2{font-size:23px;color:#bad6c9;font-weight:400;letter-spacing:.01em}
.learning-hero .launch{margin-top:24px;color:#92b2a2;font-size:13px}
.learning-hero .actions{margin-top:26px}
.learning-hero .join-link{min-height:46px;padding:12px 22px;display:inline-flex;align-items:center;justify-content:center;font-size:13px}
@keyframes learning-strike{from{transform:rotate(-7deg) scaleX(0)}to{transform:rotate(-7deg) scaleX(1)}}
@keyframes learning-reveal{from{opacity:0;transform:translateY(.1em)}to{opacity:1;transform:none}}
@media(max-width:700px){
 .games-landing .learning-hero .games-title{order:1;font-size:clamp(36px,10.5vw,48px);line-height:1.12;margin:16px 0 18px}
 .learning-hero .learning-secondary{order:2;margin:0 0 10px;width:100%}
 .games-landing .learning-hero .learning-title{order:3;font-size:clamp(19px,6.2vw,25px);margin:0 0 24px}
 .learning-hero .model-heading{gap:9px}
 .learning-hero .model-heading h2{font-size:19px}
 .learning-hero #model-eye{height:44px;width:44px}
 .learning-hero .mobile-invitation-copy{order:4}
 .games-landing .learning-hero .mobile-payoff{order:5;margin-top:22px;width:min(100%,220px);font-size:14px;gap:6px}
 .learning-hero .mobile-payoff span{min-height:42px}
 .games-landing .learning-hero .actions{order:6;margin-top:24px}
 .games-landing .learning-hero>.launch{order:7;margin-top:15px}
}
@media(prefers-reduced-motion:reduce){
 .learning-doing::after,.learning-playing{animation:none!important}
 .learning-playing{opacity:1;transform:none}
}

/* The learning line is the single games CTA, matching the original button. */
.learning-hero .learning-title{margin:22px 0 28px}
.learning-hero .learning-button{min-height:46px;padding:12px 22px;font-size:13px;line-height:1.4;letter-spacing:0;background:#d4eadd;color:#162b25;border-radius:6px}
.learning-button .learning-lead,.learning-button .learning-playing{color:#162b25}
.learning-button .learning-doing{color:#53685d}
.learning-button .learning-doing::after{background:#42594b}
.learning-button .learning-arrow{margin-left:7px;font-size:18px;line-height:1}
.learning-button:hover{background:#e0f0e6}
@media(max-width:700px){
 .games-landing .learning-hero .learning-title{width:100%;max-width:330px;margin:18px 0 26px}
 .learning-hero .learning-button{width:100%;font-size:14px}
}
