/* blog index: academies carousel (/learn/). Loaded only on /blog/. */
.acr{padding-top:56px!important;padding-bottom:40px!important}
.acr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:22px}
.acr-kicker{display:block;color:#ff8116;font-size:13px;font-weight:700;letter-spacing:3px;margin-bottom:10px}
.acr h2{font-size:clamp(26px,3.4vw,40px);font-weight:900;line-height:1.15;margin:0 0 10px;color:#fff}
.acr-head p{margin:0;color:#a6a6a0;font-size:15.5px;line-height:1.7;max-width:640px}
.acr-nav{display:flex;gap:10px;flex:none}
.acr-btn{width:40px;height:40px;border:0;border-radius:6px;background:transparent;color:#c7c7c0;font-size:18px;cursor:pointer}
.acr-btn:hover{color:#ff8116;background:transparent}
.acr-btn:focus-visible{outline:2px solid #ff8116;outline-offset:2px}
.acr-btn:hover{background:transparent}.acr-btn:focus-visible{outline:2px solid #ff8116;outline-offset:3px}
.acr-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.acr-track::-webkit-scrollbar{display:none}.acr-track:focus-visible{outline:2px solid #ff8116;outline-offset:4px}
.acr-card{flex:0 0 clamp(250px,28%,320px);scroll-snap-align:start;display:flex;flex-direction:column;gap:8px;padding:12px 12px 18px!important;text-decoration:none;color:#f4f4f1}
.acr-card img{width:100%;aspect-ratio:1.6;object-fit:cover;object-position:center;display:block;border-radius:3px}
.acr-card:hover img{filter:none}
.acr-tag{color:#ff4d94;font-size:13px;font-weight:700;letter-spacing:1px;margin-top:6px}
.acr-card b{font-size:18px;font-weight:900;line-height:1.35;color:#fff}
.acr-card:hover b,.acr-card:focus-visible b{color:#ff8116}
.acr-p{font-size:14px;line-height:1.6;color:#a6a6a0}
.acr-all{justify-content:center;min-height:260px}
.acr-go{color:#ff8116;font-size:22px}
@media(max-width:700px){.acr-head{flex-direction:column;align-items:flex-start}.acr-card{flex-basis:78vw}}
@media(prefers-reduced-motion:reduce){.acr-track{scroll-behavior:auto}}

/* maind:fix:rail-aspect */
/* The card images carry width="800" height="500" attributes. With width:100% from CSS and a
   definite height from the attribute, the browser ignores aspect-ratio and rendered them as tall
   crops. height:auto makes aspect-ratio:1.6 take effect, which is the blog cards' ratio. */
.acr-card img{height:auto}
/* /maind:fix:rail-aspect */
