/* learn.html + article.html — visual layer only. Load LAST (after learn.css). */
:root{--ln-cu:#b4561f;--ln-cu2:#f0a35e;--ln-navy:#0b1530;--ln-ease:cubic-bezier(.2,.8,.2,1)}
@keyframes lnIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes lnFloat{50%{transform:translateY(16px) scale(1.06)}}
@keyframes lnShim{to{background-position:-200% 0}}

/* ----- learn: hero ----- */
.learn-hero-v2{position:relative;overflow:hidden;background:radial-gradient(620px 300px at 88% 0,rgba(240,163,94,.42),transparent 60%),linear-gradient(135deg,#0b1530,#14244d)!important;padding:56px 0 52px!important;border-radius:0 0 36px 36px}
.learn-hero-v2::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;inset-inline-start:4%;top:-110px;background:radial-gradient(circle,rgba(255,184,107,.55),transparent 65%);animation:lnFloat 7s ease-in-out infinite;pointer-events:none}
.learn-hero-v2 h1{font-size:clamp(1.9rem,5vw,2.9rem)!important;font-weight:800;animation:lnIn .7s both}.learn-hero-v2 p{animation:lnIn .7s .1s both}.learn-hero-v2__actions{animation:lnIn .7s .2s both}
.learn-hero-v2 .btn{min-height:50px;border-radius:99px;font-weight:800}.learn-hero-v2 .btn-cta{box-shadow:0 14px 30px rgba(180,86,31,.5)}
.learn-hero-note{border-radius:22px!important;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.22)!important;backdrop-filter:blur(12px)}
/* chips + filters */
.learn-sticky-filters{border-radius:0 0 22px 22px;box-shadow:0 12px 30px rgba(11,21,48,.08)}
.learn-chip{padding:9px 18px!important;font-weight:700!important;transition:transform .2s,box-shadow .2s,border-color .2s,background .2s}
.learn-chip:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(180,86,31,.16)}
.learn-chip.is-active,.learn-chip[aria-pressed="true"]{background:linear-gradient(135deg,var(--ln-cu),var(--ln-cu2))!important;border-color:var(--ln-cu)!important;color:#fff!important;box-shadow:0 10px 22px rgba(180,86,31,.35)}
.learn-search .input,.learn-controls .input,.learn-sort__select{min-height:48px;border-radius:16px;border:2px solid #e5e9f2;transition:.25s}
.learn-search .input:focus,.learn-controls .input:focus,.learn-sort__select:focus{outline:0;border-color:var(--ln-cu);box-shadow:0 0 0 5px rgba(180,86,31,.14)}
/* start cards */
.learn-start__card{position:relative;overflow:hidden;border-radius:22px!important;padding:20px!important;box-shadow:0 14px 36px rgba(11,21,48,.08)!important;transition:transform .35s var(--ln-ease),box-shadow .35s!important}
.learn-start__card:hover{transform:translateY(-8px)!important;box-shadow:0 26px 54px rgba(180,86,31,.2)!important}
.learn-start__num{display:inline-grid!important;place-items:center;width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--ln-cu),var(--ln-cu2));color:#fff!important;font-weight:800;box-shadow:0 8px 18px rgba(180,86,31,.35)}
/* featured + feed cards */
.learn-featured{border-radius:30px!important;box-shadow:0 26px 60px rgba(11,21,48,.18)!important;transition:transform .5s var(--ln-ease),box-shadow .5s!important}
.learn-featured:hover{transform:translateY(-6px);box-shadow:0 36px 76px rgba(180,86,31,.28)!important}
.learn-featured__media img{transition:transform 1s var(--ln-ease)}.learn-featured:hover .learn-featured__media img{transform:scale(1.07)}
.learn-post,.learn-card{border-radius:24px!important;box-shadow:0 14px 38px rgba(11,21,48,.08)!important;transition:transform .35s var(--ln-ease),box-shadow .35s!important}
.learn-post:hover,.learn-card:hover{transform:translateY(-6px)!important;box-shadow:0 26px 54px rgba(180,86,31,.18)!important}
.learn-post__media img{transition:transform .8s var(--ln-ease)}.learn-post:hover .learn-post__media img{transform:scale(1.07)}
.learn-post__more{color:var(--ln-cu);font-weight:800}
.learn-cat{border-radius:99px;font-weight:700}
.learn-series__card{border-radius:18px!important;transition:transform .3s var(--ln-ease),box-shadow .3s}.learn-series__card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(11,21,48,.12)}
.learn-skel-card,.mag-skel{background:linear-gradient(90deg,#eef1f8 25%,#f8fafd 50%,#eef1f8 75%)!important;background-size:200% 100%;animation:lnShim 1.4s linear infinite}
.learn-trust-box__inner{border-radius:26px!important;background:linear-gradient(160deg,#ecfdf5,#fff)!important;border:1px solid #a7f3d0!important;box-shadow:0 14px 34px rgba(15,118,110,.1)}
.learn-side-cta{border-radius:24px!important;background:linear-gradient(160deg,#fff4e8,#fff)!important}

/* ----- article ----- */
.mag-hero{border-radius:0 0 36px 36px;overflow:hidden}
.mag-hero__shade{background:linear-gradient(180deg,rgba(11,21,48,.25),rgba(11,21,48,.9))!important}
.mag-hero__title{font-weight:800;line-height:1.45;animation:lnIn .8s both}
.mag-hero__lead{animation:lnIn .8s .1s both}
.mag-tag,.mag-chip{border-radius:99px!important;font-weight:700}
.mag-author__avatar{background:linear-gradient(135deg,var(--ln-cu),var(--ln-cu2))!important;color:#fff;box-shadow:0 8px 18px rgba(180,86,31,.35)}
.mag-side-card{border-radius:24px!important;border:1px solid #fff!important;background:rgba(255,255,255,.95)!important;box-shadow:0 14px 38px rgba(11,21,48,.08)!important}
.mag-toc a{display:block;padding:7px 12px;border-radius:12px;transition:background .2s,color .2s,transform .2s}
.mag-toc a:hover,.mag-toc a.is-active{background:#fff4e8;color:var(--ln-cu);transform:translateX(-4px)}
.mag-tool{border-radius:14px!important;transition:transform .2s,box-shadow .2s}.mag-tool:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(11,21,48,.12)}
.mag-summary{border-radius:24px!important;background:linear-gradient(135deg,#fff4e8,#ffe9d2)!important;border:1px solid #fed7aa!important}
.mag-body{line-height:2.1}
.mag-body h2,.mag-body h3{scroll-margin-top:90px;color:var(--ln-navy)}
.mag-body blockquote,.mag-pull{border-radius:20px;background:linear-gradient(160deg,#fff4e8,#fff);border-inline-start:5px solid var(--ln-cu2);padding:16px 20px}
.mag-stat{border-radius:22px!important;background:linear-gradient(160deg,#eef3ff,#fff)!important;box-shadow:0 12px 30px rgba(11,21,48,.07)}
.mag-stat__value{color:var(--ln-cu)!important;font-weight:800}
.mag-figure img,.mag-gallery__slide img{border-radius:22px;box-shadow:0 18px 44px rgba(11,21,48,.14)}
.mag-table-wrap{border-radius:20px;overflow:auto;box-shadow:0 12px 30px rgba(11,21,48,.08)}
.mag-react__btn{border-radius:99px!important;transition:transform .25s var(--ln-ease),box-shadow .25s}.mag-react__btn:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 10px 22px rgba(180,86,31,.2)}.mag-react__btn:active{transform:scale(.92)}
.mag-faq__item{border-radius:18px!important;transition:box-shadow .25s}.mag-faq__item:hover{box-shadow:0 10px 24px rgba(11,21,48,.1)}
.mag-path,.mag-intlink,.mag-playlist{border-radius:22px!important;transition:transform .3s var(--ln-ease),box-shadow .3s}
.mag-path:hover,.mag-intlink:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(180,86,31,.16)}
.mag-playlist__bar{border-radius:10px;overflow:hidden}
.mag-related__card{border-radius:24px!important;overflow:hidden;box-shadow:0 14px 38px rgba(11,21,48,.08);transition:transform .35s var(--ln-ease),box-shadow .35s}
.mag-related__card:hover{transform:translateY(-8px);box-shadow:0 26px 54px rgba(180,86,31,.2)}
.mag-related__img{transition:transform .8s var(--ln-ease)}.mag-related__card:hover .mag-related__img{transform:scale(1.08)}
.mag-endcard__inner{border-radius:30px!important;background:radial-gradient(500px 240px at 85% 0,rgba(240,163,94,.4),transparent 60%),linear-gradient(135deg,#0b1530,#14244d)!important;color:#fff;box-shadow:0 30px 70px rgba(11,21,48,.3)}
.mag-endcard__inner .btn-cta{box-shadow:0 14px 30px rgba(180,86,31,.5)}
/* reading progress bar (Chromium; ignored elsewhere) */
@supports(animation-timeline:scroll()){
 @keyframes lnRead{from{transform:scaleX(0)}to{transform:scaleX(1)}}
 html:has(.mag-hero)::after{content:"";position:fixed;top:0;left:0;right:0;height:4px;z-index:200;background:linear-gradient(90deg,var(--ln-cu),var(--ln-cu2));transform-origin:100% 50%;transform:scaleX(0);animation:lnRead linear both;animation-timeline:scroll(root)}
}
@media(prefers-reduced-motion:reduce){.learn-hero-v2 *,.learn-hero-v2::after,.mag-hero *,html::after{animation:none!important}.learn-post,.learn-card,.mag-related__card{transition:none!important}}