:root{
  --yellow:#F5B301;--yellow-d:#D99B00;--teal:#0E4D5C;--teal-d:#0A3A45;--teal-l:#16687C;
  --terra:#D9622B;--terra-d:#B84E1E;--cream:#FBF7EF;--charcoal:#2B2B2B;
  --white:#fff;--ink-60:#5C5A54;--ink-40:#8A877F;--line:#E9E1D2;--green:#1c7a4d;
  --r-sm:8px;--r:14px;--r-lg:20px;--r-xl:28px;
  --sh-sm:0 2px 8px rgba(43,43,43,.07);--sh:0 8px 24px rgba(43,43,43,.12);--sh-lg:0 18px 44px rgba(14,77,92,.18);
  --sans:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --display:"Poppins","Inter",system-ui,Arial,sans-serif;--maxw:1240px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--white);color:var(--charcoal);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.2;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(1.9rem,4vw,2.7rem)} h2{font-size:clamp(1.4rem,2.6vw,1.9rem)}
p{margin:0 0 1rem} a{color:inherit;text-decoration:none} img{max-width:100%;display:block}
button{font-family:var(--sans);cursor:pointer;border:none;background:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:3px solid var(--terra);outline-offset:2px;border-radius:5px}
.ic{width:1.25em;height:1.25em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic.fill{fill:currentColor;stroke:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:600;font-size:1rem;padding:.8rem 1.3rem;border-radius:12px;white-space:nowrap;transition:transform .1s,background .15s,box-shadow .15s}
.btn:active{transform:translateY(1px)}
.btn-pri{background:var(--yellow);color:var(--charcoal);box-shadow:0 5px 14px rgba(245,179,1,.32)}
.btn-pri:hover{background:var(--yellow-d)}
.btn-teal{background:var(--teal);color:#fff}.btn-teal:hover{background:var(--teal-d)}
.btn-terra{background:var(--terra);color:#fff}.btn-terra:hover{background:var(--terra-d)}
.btn-ghost{background:#fff;color:var(--teal);border:1.5px solid var(--teal)}.btn-ghost:hover{background:var(--cream)}
.btn-out{background:#fff;color:var(--charcoal);border:1.5px solid var(--line)}.btn-out:hover{border-color:var(--teal)}
.btn-block{width:100%}.btn-lg{padding:1rem 1.6rem;font-size:1.05rem}.btn-sm{padding:.5rem .9rem;font-size:.9rem}
.badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.76rem;font-weight:700;padding:.22rem .6rem;border-radius:6px}
.b-best{background:#FCEFCB;color:var(--yellow-d)} .b-free{background:#E6F2EC;color:var(--green)} .b-cat{background:var(--cream);color:var(--teal)}
.stars{display:inline-flex;align-items:center;gap:.2rem;color:var(--yellow-d);font-weight:700;font-size:.9rem}
.stars .ic{width:14px;height:14px;color:var(--yellow);fill:var(--yellow);stroke:none}
.stars .ic.off{color:var(--line);fill:var(--line)}
.muted{color:var(--ink-60)}

/* ---------- NAV (Udemy-style) ---------- */
.nav{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--sh-sm)}
.nav .wrap{max-width:none;padding:0 clamp(22px,3vw,40px)}
.nav-in{display:flex;align-items:center;gap:12px;height:70px}
.logo{display:flex;align-items:center;gap:.5rem;font-family:var(--display);font-weight:700;font-size:1.4rem;color:var(--teal);flex:none}
.logo .tile{width:34px;height:34px;border-radius:10px;background:var(--teal);display:grid;place-items:center}
.logo .tile .ic{width:20px;height:20px;fill:#fff;stroke:none}
.logo b{color:var(--yellow)}
.logo.wm{gap:0}
.logo.wm svg.wmk{height:30px;width:auto;display:block;color:var(--teal)}
.logo.wm{align-self:center}
.nav .logo.wm{margin-right:6px}
.nav .logo.wm svg.wmk{height:28px}
footer .logo.wm svg.wmk{color:#fff}
.inst .logo.wm svg.wmk{color:var(--teal)}
.inst footer .logo.wm svg.wmk, .foot .logo.wm svg.wmk{color:#fff}
.cat-btn{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem;border-radius:10px;font-weight:600;color:var(--charcoal);flex:none}
.cat-btn:hover{color:var(--teal);background:var(--cream)}
.navsearch{flex:1 1 280px;margin-left:1rem;margin-right:auto;display:flex;align-items:center;gap:.7rem;background:var(--cream);border:1.5px solid var(--line);border-radius:999px;padding:.6rem 1.05rem;min-width:170px;max-width:560px}
.navsearch:focus-within{border-color:var(--teal);background:#fff}
.navsearch .ic{color:var(--ink-40)} .navsearch input{border:none;outline:none;background:none;flex:1;min-width:0;font-size:1rem;font-family:var(--sans);text-overflow:ellipsis}
.nav-link{padding:.5rem .5rem;border-radius:10px;font-weight:600;font-size:.95rem;color:var(--charcoal);white-space:nowrap}
.nav-link:hover{color:var(--teal)}
.cart{position:relative;width:42px;height:42px;border-radius:10px;display:grid;place-items:center;color:var(--charcoal)}
.cart:hover{background:var(--cream);color:var(--teal)}
.cart .cnt{position:absolute;top:4px;right:4px;background:var(--terra);color:#fff;font-size:.66rem;font-weight:700;min-width:17px;height:17px;border-radius:9px;display:grid;place-items:center;padding:0 3px}
.menu-btn{display:none;color:var(--teal)}
.mdrawer{display:none;position:absolute;top:70px;left:0;right:0;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:var(--sh);padding:12px 22px;flex-direction:column;gap:4px;z-index:55}
.mdrawer.open{display:flex}
.mdrawer a,.mdrawer button{padding:.75rem .7rem;border-radius:10px;font-weight:600;color:var(--charcoal);text-align:left;font-size:1rem;cursor:pointer;background:none;border:none;font-family:var(--sans)}
.mdrawer a:hover,.mdrawer button:hover{background:var(--cream);color:var(--teal)}
.mdrawer hr{border:none;border-top:1px solid var(--line);margin:.4rem 0}
@media(min-width:1025px){.mdrawer{display:none!important}}
/* mega menu */
.mega{position:absolute;top:72px;left:0;background:#fff;border:1px solid var(--line);border-radius:0 0 16px 16px;box-shadow:var(--sh);padding:14px;display:none;min-width:300px}
.mega.open{display:block}
.mega a{display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;border-radius:10px;font-weight:500}
.mega a:hover{background:var(--cream);color:var(--teal)}
.mega .mi{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:#fff;flex:none}
.mega a small{display:block;color:var(--ink-40);font-weight:400;font-size:.8rem}
/* partner dropdown (nav) */
.partbtn{display:inline-flex;align-items:center;gap:.3rem;cursor:pointer}
.partmenu{position:absolute;top:46px;right:0;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh);padding:8px;display:none;min-width:280px;z-index:60}
.partmenu.open{display:block}
.partmenu a{display:block;padding:.65rem .85rem;border-radius:10px;font-weight:500;cursor:pointer}
.partmenu a:hover{background:var(--cream)}
.partmenu a b{display:block;font-family:var(--display);font-weight:600;color:var(--charcoal);margin-bottom:.1rem}
.partmenu a:hover b{color:var(--teal)}
.partmenu a small{display:block;color:var(--ink-40);font-size:.78rem;line-height:1.35}

/* views */
.view{display:none} .view.active{display:block}
section{padding:50px 0}
.eyebrow{font-family:var(--display);font-weight:600;color:var(--terra);text-transform:uppercase;letter-spacing:.07em;font-size:.78rem;margin-bottom:.5rem}

/* hero promo */
.promo{background:linear-gradient(120deg,#16687C,#0E4D5C);padding:0;position:relative;overflow:hidden}
.promo-in{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:30px;min-height:380px;padding:40px 0}
.promo-card{background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:28px 30px;max-width:420px}
.promo-card h1{font-size:clamp(1.8rem,3.4vw,2.4rem)} .promo-card h1 .hl{color:var(--teal);position:relative}
.promo-card h1 .hl::after{content:"";position:absolute;left:-2px;right:-2px;bottom:.06em;height:.32em;background:var(--yellow);z-index:-1;border-radius:3px}
.promo-card p{color:var(--ink-60);font-size:1.05rem;margin:.8rem 0 1.3rem}
.promo-art{position:relative;display:flex;justify-content:flex-end;align-items:center;min-height:360px}
/* phone mockup */
.phone-mock{position:relative;max-width:280px;width:100%;margin-right:10px}
.phone-frame{background:#1a1a1a;border-radius:38px;padding:9px;box-shadow:var(--sh-lg);position:relative}
.phone-frame::before{content:"";position:absolute;top:14px;left:50%;transform:translateX(-50%);width:100px;height:6px;background:#000;border-radius:3px;z-index:2}
.phone-screen{background:#fff;border-radius:30px;overflow:hidden;display:flex;flex-direction:column;aspect-ratio:9/15}
.phone-screen .ps-thumb{aspect-ratio:16/10;display:grid;place-items:center;position:relative}
.phone-screen .ps-body{padding:1.1rem 1.15rem 1.25rem;flex:1;display:flex;flex-direction:column;gap:.4rem}
.ps-cat{font-family:var(--display);font-size:.62rem;font-weight:700;letter-spacing:.08em;color:var(--teal-l);text-transform:uppercase}
.ps-body h4{font-family:var(--display);font-size:1rem;line-height:1.25;color:var(--charcoal);margin:0}
.ps-by{font-size:.78rem;color:var(--ink-40)}
.ps-progress{height:6px;background:var(--line);border-radius:999px;overflow:hidden;margin-top:.55rem}
.ps-progress i{display:block;height:100%;background:var(--yellow)}
.ps-pct{font-size:.72rem;color:var(--ink-60);font-weight:600}
.off-stamp{position:absolute;bottom:34px;right:-22px;background:var(--yellow);color:var(--charcoal);padding:.55rem .95rem;border-radius:12px;display:inline-flex;align-items:center;gap:.4rem;font-family:var(--display);font-weight:600;font-size:.82rem;box-shadow:var(--sh);transform:rotate(-4deg)}
.off-stamp .ic{width:16px;height:16px}
.play-fab{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--terra);box-shadow:var(--sh)}
.play-fab .ic{width:26px;height:26px;fill:var(--terra);stroke:none;margin-left:3px}

/* trust */
.trust{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:26px 0;border-bottom:1px solid var(--line)}
.trust .lbl{color:var(--ink-40);font-weight:600;font-size:.85rem;margin-right:.4rem}
.trust .org{font-family:var(--display);font-weight:600;color:var(--teal-l);font-size:.92rem;border:1.5px dashed var(--line);background:#fff;padding:.45rem .95rem;border-radius:999px;display:inline-flex;align-items:center;gap:.4rem}
.trust .org::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--yellow);opacity:.75}
.trust .cta{margin-left:auto;color:var(--teal);font-weight:600;font-size:.88rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.trust .cta:hover{color:var(--terra)}

/* shelves */
.shelf{position:relative;margin-bottom:14px}
.shelf-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.shelf-head a{color:var(--teal);font-weight:600;font-size:.9rem}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-behavior:smooth;padding:6px 2px 10px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.arrow{position:absolute;top:42%;width:44px;height:44px;border-radius:50%;background:#fff;box-shadow:var(--sh);display:grid;place-items:center;color:var(--charcoal);z-index:5;border:1px solid var(--line)}
.arrow:hover{background:var(--cream)} .arrow.l{left:-12px} .arrow.r{right:-12px}
/* course card (compact) */
.card{flex:none;width:248px;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:transform .14s,box-shadow .14s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh)}
.thumb{aspect-ratio:16/10;position:relative;display:grid;place-items:center}
.thumb>.ic{width:32px;height:32px;color:#fff;opacity:.9}
.thumb .tag{position:absolute;top:9px;left:9px}
.card-b{padding:.8rem .9rem 1rem;display:flex;flex-direction:column;flex:1}
.card-b h4{font-family:var(--display);font-size:1rem;font-weight:600;margin-bottom:.25rem;line-height:1.25}
.card-b .by{color:var(--ink-40);font-size:.8rem;margin-bottom:.35rem}
.card-b .rt{display:flex;align-items:center;gap:.4rem;font-size:.82rem;margin-bottom:.4rem}
.card-b .rt .n{color:var(--yellow-d);font-weight:700} .card-b .rt .c{color:var(--ink-40)}
.card-b .pr{font-family:var(--display);font-weight:700;color:var(--teal);font-size:1.1rem;margin-top:auto}

/* category tiles */
.cattiles{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.ctile{background:var(--cream);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem;text-align:center;cursor:pointer;transition:.14s}
.ctile:hover{background:#fff;box-shadow:var(--sh);transform:translateY(-3px)}
.ctile .ci{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;color:#fff;margin:0 auto .6rem}
.ctile b{font-family:var(--display);font-weight:600;font-size:.92rem;display:block}
.ctile small{color:var(--ink-40);font-size:.78rem}

/* instructor band */
.iband{background:var(--cream);border-radius:var(--r-lg);padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}

/* ---------- CATALOG (filters + results) ---------- */
.cat-head{padding:30px 0 10px}
.cat-layout{display:grid;grid-template-columns:260px 1fr;gap:34px;align-items:start}
.filters{position:sticky;top:90px}
.fgroup{border-bottom:1px solid var(--line);padding:16px 0}
.fgroup h4{font-family:var(--display);font-size:1rem;margin-bottom:.8rem}
.fopt{display:flex;align-items:center;gap:.6rem;padding:.3rem 0;font-size:.95rem;cursor:pointer}
.fopt input{width:18px;height:18px;accent-color:var(--teal)}
.results-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.sortbox{display:flex;align-items:center;gap:.5rem;border:1.5px solid var(--line);border-radius:10px;padding:.5rem .8rem;font-weight:600}
.sortbox select{border:none;background:none;font-family:var(--sans);font-weight:600;font-size:.95rem;outline:none}
.filters-toggle{display:none}
/* list card (wide) */
.lcard{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);cursor:pointer}
.lcard .lt{width:230px;aspect-ratio:16/10;border-radius:10px;flex:none;display:grid;place-items:center;position:relative}
.lcard .lt .ic{width:30px;height:30px;color:#fff}
.lcard .li{flex:1;min-width:0}
.lcard .li h3{font-family:var(--display);font-size:1.2rem;font-weight:700;margin-bottom:.2rem}
.lcard .li .d{color:var(--ink-60);font-size:.9rem;margin:.2rem 0 .4rem}
.lcard .li .by{color:var(--ink-40);font-size:.84rem}
.lcard .li .mt{display:flex;gap:.8rem;color:var(--ink-40);font-size:.8rem;margin-top:.4rem;flex-wrap:wrap}
.lcard .li .mt span{display:flex;align-items:center;gap:.3rem}
.lcard .pr{font-family:var(--display);font-weight:700;color:var(--teal);font-size:1.3rem;flex:none;text-align:right}

/* ---------- COURSE DETAIL (Udemy style) ---------- */
.cd-band{background:var(--teal-d);color:#fff;padding:38px 0 56px;position:relative}
.cd-band .wrap{max-width:var(--maxw)}
.cd-inner{max-width:62%}
.cd-band .crumbs{color:#9fd0d8;font-size:.85rem;margin-bottom:14px;display:flex;gap:.4rem;flex-wrap:wrap}
.cd-band .crumbs a{color:var(--yellow)}
.cd-band h1{color:#fff;font-size:clamp(1.7rem,3vw,2.3rem)}
.cd-band .sub{color:#d6e6e9;font-size:1.1rem;margin:.8rem 0}
.cd-rate{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;font-size:.9rem;color:#d6e6e9}
.cd-rate .b-best{font-size:.74rem}
.cd-meta{display:flex;gap:1.2rem;flex-wrap:wrap;color:#bcd6da;font-size:.85rem;margin-top:.8rem}
.cd-meta span{display:flex;align-items:center;gap:.4rem}
/* sponsor — global utilities */
.logo-mini{width:28px;height:28px;border-radius:50%;background:var(--yellow);color:var(--teal-d);font-family:var(--display);font-weight:700;font-size:.72rem;display:inline-grid;place-items:center;flex:none}
.sp-pill{display:inline-flex;align-items:center;gap:.35rem;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.2rem .65rem .2rem .25rem;font-size:.74rem;font-weight:600;color:var(--charcoal);max-width:100%}
.sp-pill .logo-mini{width:20px;height:20px;font-size:.58rem}
.sp-pill .lbl{color:var(--ink-40);font-weight:500}
.sp-pill.empty{background:#FFF7E0;border-color:#F1D88A;color:var(--yellow-d)}
.sp-pill.empty:hover{background:#FCEFCB}
/* sponsor slot (course detail) */
.cd-sponsor{display:inline-flex;align-items:center;gap:.55rem;margin-top:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:.4rem .95rem .4rem .55rem;color:#fff;font-size:.86rem;max-width:100%}
.cd-sponsor .lbl{color:#bcd6da;font-weight:500}
.cd-sponsor .sp{display:inline-flex;align-items:center;gap:.45rem;font-weight:600}
.cd-sponsor.empty{background:rgba(245,179,1,.12);border-color:rgba(245,179,1,.45);padding:.4rem .95rem}
.cd-sponsor.empty .lbl{color:var(--yellow);font-weight:600}
.cd-sponsor.empty a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px;margin-left:.3rem;cursor:pointer}
.cd-sponsor.empty a:hover{color:var(--yellow)}
/* chip on card thumb */
.thumb .tag.spchip{left:auto;right:9px;top:9px;background:rgba(255,255,255,.95);border-radius:999px;padding:.2rem .5rem .2rem .25rem;display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:600;color:var(--charcoal);box-shadow:0 2px 6px rgba(0,0,0,.18)}
.thumb .tag.spchip .logo-mini{width:18px;height:18px;font-size:.55rem}
.lcard .li .sp-line{display:inline-flex;align-items:center;gap:.4rem;margin-top:.45rem;font-size:.8rem;color:var(--ink-60)}
.lcard .li .sp-line .logo-mini{width:22px;height:22px;font-size:.62rem}
.lcard .li .sp-line.empty{color:var(--yellow-d);cursor:pointer}
.lcard .li .sp-line.empty:hover{color:var(--terra)}
/* floating purchase card */
.buycard{position:absolute;top:38px;right:max(22px,calc((100vw - var(--maxw))/2 + 22px));width:340px;background:#fff;color:var(--charcoal);border-radius:var(--r);box-shadow:var(--sh-lg);overflow:hidden;z-index:10}
.buycard .ph{aspect-ratio:16/9;display:grid;place-items:center;position:relative}
.buycard-b{padding:1.4rem}
.buycard .price{font-family:var(--display);font-weight:700;font-size:2rem;color:var(--teal);margin-bottom:.9rem}
.buycard .incl{list-style:none;padding:0;margin:1.2rem 0 0;display:flex;flex-direction:column;gap:.6rem;font-size:.9rem}
.buycard .incl li{display:flex;gap:.6rem;align-items:center;color:var(--ink-60)}
.buycard .incl .ic{color:var(--teal);width:18px;height:18px}
.guarantee{text-align:center;color:var(--ink-40);font-size:.82rem;margin-top:.9rem}
.cd-body{max-width:62%;padding:34px 0}
.learnbox{border:1px solid var(--line);border-radius:var(--r);padding:24px;margin-bottom:34px}
.learnbox h2{font-size:1.4rem;margin-bottom:1rem}
.learn-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1.6rem}
.learn-grid div{display:flex;gap:.6rem;font-size:.92rem;align-items:flex-start}
.learn-grid .ic{color:var(--green);width:18px;height:18px;flex:none;margin-top:3px}
.cd-sec{margin-bottom:34px}
.cd-sec h2{font-size:1.4rem;margin-bottom:.4rem}
.curr-meta{color:var(--ink-60);font-size:.88rem;margin-bottom:1rem;display:flex;justify-content:space-between;align-items:center}
.curr-meta a{color:var(--teal);font-weight:600}
.section{border:1px solid var(--line);border-top:none}
.section:first-child{border-top:1px solid var(--line);border-radius:8px 8px 0 0}
.section:last-child{border-radius:0 0 8px 8px}
.section-h{display:flex;align-items:center;gap:.6rem;padding:.95rem 1.1rem;background:var(--cream);cursor:pointer;font-family:var(--display);font-weight:600;font-size:.96rem}
.section-h .ic{width:18px} .section-h .sp{flex:1} .section-h small{color:var(--ink-40);font-weight:400;font-family:var(--sans)}
.section-l{display:none} .section.open .section-l{display:block}
.lec{display:flex;align-items:center;gap:.7rem;padding:.7rem 1.1rem 0.7rem 2.4rem;font-size:.9rem;border-top:1px solid var(--line)}
.lec .ic{width:16px;height:16px;color:var(--teal)} .lec .lt2{flex:1} .lec small{color:var(--ink-40)}
.reqs{list-style:disc;padding-left:1.2rem;color:var(--ink-60)} .reqs li{margin-bottom:.4rem}
.desc{color:var(--ink-60)}
.instructor h3{color:var(--teal);font-size:1.3rem;text-decoration:underline}
.instr-head{display:flex;gap:1rem;align-items:center;margin:1rem 0}
.instr-stats{display:flex;gap:1.4rem;color:var(--ink-60);font-size:.86rem;margin:.6rem 0 1rem;flex-wrap:wrap}
.instr-stats span{display:flex;align-items:center;gap:.4rem}
/* reviews */
.rev-top{display:grid;grid-template-columns:200px 1fr;gap:30px;align-items:center;margin-bottom:24px}
.rev-big{text-align:center} .rev-big .n{font-family:var(--display);font-weight:700;font-size:3.4rem;color:var(--yellow-d);line-height:1}
.bars{display:flex;flex-direction:column;gap:.5rem}
.bar-row{display:flex;align-items:center;gap:.7rem;font-size:.85rem}
.bar{flex:1;height:9px;background:var(--line);border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--yellow);border-radius:999px}
.review{border-top:1px solid var(--line);padding:18px 0;display:flex;gap:14px}
.review .av{width:46px;height:46px;flex:none}
.review b{font-family:var(--display)} .review .when{color:var(--ink-40);font-size:.8rem}

.avatar{border-radius:50%;display:grid;place-items:center;color:#fff;font-family:var(--display);font-weight:700;flex:none}

/* generic player/exam/dash/pay reused (compact) */
.simple-head{padding:30px 0 6px}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:20px}
.progress{height:9px;background:var(--line);border-radius:999px;overflow:hidden}.progress i{display:block;height:100%;background:var(--yellow)}
.player-top{background:var(--teal-d);color:#fff;padding:13px 0}.player-top .wrap{display:flex;gap:1rem;align-items:center}.player-top h3{color:#fff;flex:1;font-size:1rem}
.stage{background:#000;border-radius:var(--r);aspect-ratio:16/9;display:grid;place-items:center}
.player-grid{display:grid;grid-template-columns:1fr 320px;gap:24px;padding:24px 0}
.side-list{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.side-list .sh{padding:.9rem 1.1rem;border-bottom:1px solid var(--line);font-family:var(--display);font-weight:600}
.pl-item{display:flex;align-items:center;gap:.6rem;padding:.75rem 1.1rem;border-bottom:1px solid var(--line);cursor:pointer;font-size:.9rem}
.pl-item:hover{background:var(--cream)} .pl-item.active{background:#FCEFCB}
.pl-item .tick{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;flex:none;color:#fff}
.pl-item.done .tick{background:var(--green);border-color:var(--green)} .pl-item .tick .ic{width:13px;height:13px;display:none} .pl-item.done .tick .ic{display:block}
.pl-item .pt{flex:1}
.exam-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:1.2rem 0}
.exam-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem}
.dash-empty{text-align:center;padding:42px 28px;border:1.5px dashed var(--line);border-radius:var(--r-lg);background:var(--cream);margin-bottom:1.5rem}
.dash-empty h2{margin-bottom:.5rem}
.dash-empty p{max-width:46ch;margin:0 auto 1.4rem;color:var(--ink-60)}
.dash-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:.8rem}
.dash-head .dash-toggle{font-size:.82rem}
.exam-card .ci{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;color:#fff;margin-bottom:.9rem}
.quiz{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:none}.quiz.active{display:block}
.quiz-h{display:flex;justify-content:space-between;align-items:center;padding:1.1rem 1.5rem;background:var(--teal);color:#fff}
.quiz-h .timer{font-family:var(--display);font-weight:700;display:flex;gap:.4rem;align-items:center}
.opt{width:100%;text-align:left;padding:.95rem 1.1rem;border:2px solid var(--line);border-radius:12px;background:#fff;font-size:1rem;display:flex;gap:.7rem;align-items:center;margin-bottom:.6rem}
.opt .k{width:28px;height:28px;border-radius:7px;background:var(--cream);display:grid;place-items:center;font-weight:700;font-family:var(--display)}
.opt.sel{border-color:var(--teal);background:#EAF1F2}.opt.correct{border-color:var(--green);background:#E6F2EC}.opt.wrong{border-color:var(--terra);background:#FBEAE1}
.topic{display:grid;grid-template-columns:140px 1fr 44px;gap:1rem;align-items:center;margin-bottom:.8rem}
.method{display:flex;align-items:center;gap:1rem;border:2px solid var(--line);border-radius:var(--r);padding:1rem 1.2rem;cursor:pointer;margin-bottom:.8rem}
.method.sel{border-color:var(--teal);background:#EAF1F2}
.method .ci{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;color:#fff;font-family:var(--display);font-weight:700;font-size:.78rem}
.pay-grid{display:grid;grid-template-columns:1fr .75fr;gap:34px;align-items:start}
.summary{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem;position:sticky;top:90px}
.summary .total{display:flex;justify-content:space-between;font-family:var(--display);font-weight:700;font-size:1.3rem;color:var(--teal);border-top:1px solid var(--line);margin-top:.6rem;padding-top:.8rem}
.field{margin:.7rem 0}.field label{font-weight:600;font-size:.88rem;display:block;margin-bottom:.4rem}
.field input{width:100%;padding:.85rem 1rem;border:1.5px solid var(--line);border-radius:11px;font-size:1.02rem;font-family:var(--sans)}

/* newsletter strip */
.newsletter{background:var(--cream);padding:54px 0;border-top:1px solid var(--line)}
.news-card{display:flex;justify-content:space-between;align-items:center;gap:30px;max-width:980px;margin:0 auto;flex-wrap:wrap}
.news-card h2{margin-bottom:.4rem}
.news-card p{color:var(--ink-60);max-width:48ch;margin:0}
.news-form{display:flex;gap:.5rem;flex-wrap:wrap;align-items:flex-start}
.news-form input{padding:.85rem 1.1rem;border:1.5px solid var(--line);border-radius:11px;font-size:1rem;font-family:var(--sans);min-width:240px;background:#fff}
.news-form input:focus{outline:none;border-color:var(--teal)}
.news-form .ok{width:100%;align-items:center;gap:.3rem;color:var(--green);font-size:.85rem;font-weight:600;margin-top:.6rem;display:none}
.news-form .ok.show{display:inline-flex}
@media(max-width:720px){.news-card{flex-direction:column;align-items:flex-start} .news-form{width:100%} .news-form input{flex:1;min-width:0}}

/* footer */
footer{background:var(--teal-d);color:rgba(255,255,255,.8);padding:50px 0 28px;margin-top:0}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:28px}
footer h4{color:#fff;margin-bottom:.9rem} footer .logo{color:#fff;margin-bottom:.8rem} footer .logo .tile{background:var(--yellow)} footer .logo .tile .ic{fill:var(--teal)}
footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem;font-size:.92rem}
footer ul a:hover{color:var(--yellow)}
.foot-b{border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:18px;font-size:.85rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

/* modal */
.modal{position:fixed;inset:0;background:rgba(14,77,92,.5);display:none;place-items:center;z-index:200;padding:20px}
.modal.open{display:grid}
.modal-card{background:#fff;border-radius:var(--r-lg);max-width:420px;width:100%;padding:2rem;box-shadow:var(--sh-lg)}
.auth-tabs{display:flex;background:var(--cream);border-radius:999px;padding:5px;margin:1.1rem 0}
.auth-tabs button{flex:1;padding:.6rem;border-radius:999px;font-weight:600;color:var(--ink-60)} .auth-tabs button.active{background:#fff;color:var(--teal);box-shadow:var(--sh-sm)}

@media(max-width:1040px){
  .cd-inner,.cd-body{max-width:100%} .buycard{position:static;width:auto;margin-top:22px;max-width:420px}
  .promo-in{grid-template-columns:1fr;padding:36px 0 50px}
  .promo-art{min-height:auto;justify-content:center;padding-top:10px}
  .phone-mock{margin:0 auto}
}
@media(max-width:600px){
  .off-stamp{right:auto;left:-10px;bottom:42px}
}
@media(max-width:1024px){
  .nav-link.hideable{display:none} .menu-btn{display:grid}
  .nav-in .btn-ghost.hideable{display:none}
  .navsearch{max-width:none}
}
@media(max-width:900px){
  .cat-layout{grid-template-columns:1fr} .filters{position:static;display:none} .filters.open{display:block}
  .filters-toggle{display:inline-flex} .cattiles{grid-template-columns:repeat(3,1fr)}
  .iband,.pay-grid,.player-grid{grid-template-columns:1fr} .exam-cards{grid-template-columns:1fr}
}
@media(max-width:720px){
  .navsearch{order:3;flex-basis:100%;min-width:0}
  .nav-in{flex-wrap:wrap;height:auto;padding:12px 0;gap:10px}
  .learn-grid{grid-template-columns:1fr} .cattiles{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr} .rev-top{grid-template-columns:1fr}
  .lcard .lt{width:130px}
}

/* ===== institutional pages (scoped) ===== */
.inst{font-size:16px;line-height:1.65}
.inst h1{font-size:clamp(2rem,4.4vw,3rem)}
.inst h2{font-size:clamp(1.5rem,2.8vw,2.1rem)}
.inst h3{font-size:1.2rem}
.inst .center{text-align:center}
.inst .eyebrow{letter-spacing:.08em;font-size:.8rem;margin-bottom:.6rem}
.inst .lead{font-size:1.2rem;color:var(--ink-60);max-width:60ch}
.inst .btn{padding:.85rem 1.5rem}
.inst .btn-white{background:#fff;color:var(--teal)}
.inst .btn-white:hover{background:var(--cream)}
.inst .btn-lg{padding:1rem 1.8rem;font-size:1.08rem}
.inst .ipill{display:inline-flex;align-items:center;gap:.3rem;font-size:.78rem;font-weight:700;padding:.25rem .7rem;border-radius:999px;background:#FCEFCB;color:var(--yellow-d)}
.inst section{padding:64px 0}
.inst .hero{padding:64px 0 50px}
.inst .hero.dark{background:linear-gradient(120deg,var(--teal),var(--teal-l));color:#fff}
.inst .hero.dark h1, .inst .hero.dark .eyebrow{color:#fff}
.inst .hero.dark .eyebrow{color:var(--yellow)}
.inst .hero.dark .lead{color:#dcebee}
.inst .hero.cream{background:var(--cream)}
.inst .hgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:46px;align-items:center}
.inst .hero-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.inst .art-card{background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-lg);overflow:hidden}
.inst .art-thumb{aspect-ratio:16/11;display:grid;place-items:center}
.inst .art-card .am{padding:1rem 1.2rem}
.inst .art-card .am h4{font-family:var(--display);font-size:1.1rem}
.inst .art-card .am .r{color:var(--ink-60);font-size:.9rem;display:flex;gap:.4rem;align-items:center;margin-top:.4rem}
.inst .sec-head{max-width:62ch;margin-bottom:2rem}
.inst .sec-head.center{margin-left:auto;margin-right:auto}
.inst .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.inst .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.inst .grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.inst .icard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem}
.inst .icard .ci{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;color:#fff;margin-bottom:1rem}
.inst .icard h3{font-family:var(--display);font-size:1.15rem;margin-bottom:.5rem}
.inst .icard p{color:var(--ink-60);margin:0;font-size:.96rem}
.inst .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.inst .stat{text-align:center;background:var(--cream);border-radius:var(--r-lg);padding:1.6rem 1rem}
.inst .stat b{font-family:var(--display);font-weight:700;font-size:2.6rem;color:var(--teal);display:block;line-height:1}
.inst .stat span{color:var(--ink-60);font-size:.92rem}
.inst .value{display:flex;gap:1rem;align-items:flex-start}
.inst .value .vi{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;flex:none}
.inst .value h4{font-family:var(--display);font-size:1.05rem;margin-bottom:.2rem}
.inst .value p{margin:0;color:var(--ink-60);font-size:.94rem}
.inst .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.inst .step .num{width:48px;height:48px;border-radius:14px;background:var(--cream);color:var(--teal);font-family:var(--display);font-weight:700;display:grid;place-items:center;font-size:1.3rem;margin-bottom:.8rem}
.inst .step h4{font-family:var(--display);font-size:1.1rem;margin-bottom:.3rem}
.inst .step p{color:var(--ink-60);margin:0}
.inst .band{background:linear-gradient(120deg,var(--teal),var(--teal-l));color:#fff;border-radius:var(--r-xl);padding:48px;text-align:center}
.inst .band h2{color:#fff}
.inst .band p{color:#dcebee;max-width:54ch;margin:.6rem auto 1.6rem}
.inst .band.yellow{background:linear-gradient(120deg,var(--yellow),#F0A500);color:var(--charcoal)}
.inst .band.yellow h2{color:var(--charcoal)}
.inst .band.yellow p{color:#6b5500}
.inst .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.inst .tier{background:#fff;border:1.5px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;display:flex;flex-direction:column}
.inst .tier.feat{border:2px solid var(--teal);box-shadow:var(--sh)}
.inst .tier .tag{align-self:flex-start;margin-bottom:.8rem}
.inst .tier h3{font-family:var(--display);font-size:1.25rem}
.inst .tier .amt{font-family:var(--display);font-weight:700;color:var(--teal);font-size:1.6rem;margin:.4rem 0}
.inst .tier .amt small{font-size:.9rem;color:var(--ink-40);font-weight:400}
.inst .tier ul{list-style:none;padding:0;margin:1rem 0 1.4rem;display:flex;flex-direction:column;gap:.6rem;font-size:.94rem}
.inst .tier ul li{display:flex;gap:.6rem;align-items:flex-start;color:var(--ink-60)}
.inst .tier ul li .ic{color:var(--green);width:18px;height:18px;flex:none;margin-top:3px}
.inst .tier .btn{margin-top:auto}
.inst .orgs{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.inst .iorg{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1rem 1.6rem;font-family:var(--display);font-weight:700;color:var(--teal-l);font-size:1.05rem}
.inst .report{display:flex;gap:.8rem;align-items:flex-start;padding:.6rem 0}
.inst .report .ic{color:var(--green);flex:none;margin-top:3px}
.inst .quote{background:var(--cream);border-radius:var(--r-xl);padding:40px;text-align:center}
.inst .quote p{font-family:var(--display);font-size:1.4rem;font-weight:600;max-width:40ch;margin:0 auto 1rem;line-height:1.35}
.inst .quote .who{display:flex;gap:.7rem;align-items:center;justify-content:center;color:var(--ink-60);font-size:.92rem}
.inst .pts-cta{display:flex;align-items:center;gap:1rem;background:#FFF7E0;border:1.5px dashed #F1D88A;border-radius:14px;padding:.95rem 1.2rem;margin-bottom:18px;flex-wrap:wrap}
.inst .pts-cta .lbl{font-family:var(--display);font-weight:600;color:var(--yellow-d);flex:1;min-width:220px;display:inline-flex;align-items:center;gap:.5rem}
.inst .pts-cta .lbl::before{content:"⚡";font-size:1.1rem}
.inst .points{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.inst .point{display:flex;gap:.8rem;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.2rem}
.inst .point .pi{width:42px;height:42px;border-radius:12px;background:var(--cream);color:var(--teal);display:grid;place-items:center;flex:none}
.inst .point b{font-family:var(--display)}
.inst .point small{color:var(--ink-40)}
.inst .point .st{margin-left:auto;font-size:.78rem;font-weight:700;padding:.2rem .6rem;border-radius:999px;background:#E6F2EC;color:var(--green)}
.inst .point .st.soon{background:#FCEFCB;color:var(--yellow-d)}
.inst .contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:start}
.inst .cinfo{display:flex;flex-direction:column;gap:14px}
.inst .crow{display:flex;gap:1rem;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.3rem}
.inst .crow .ci{width:46px;height:46px;border-radius:12px;background:var(--cream);color:var(--teal);display:grid;place-items:center;flex:none}
.inst .crow b{font-family:var(--display);display:block}
.inst .crow span{color:var(--ink-60);font-size:.94rem}
.inst .form{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem}
.inst .field{margin-bottom:1rem}
.inst .field label{font-weight:600;font-size:.9rem;display:block;margin-bottom:.4rem}
.inst .field input, .inst .field textarea, .inst .field select{width:100%;padding:.85rem 1.1rem;border:1.5px solid var(--line);border-radius:11px;font-size:1rem;font-family:var(--sans)}
.inst .field textarea{min-height:120px;resize:vertical}
.inst .frow{display:flex;gap:1rem}
.inst .frow .field{flex:1}
.inst .legal{max-width:760px}
.inst .legal h3{font-family:var(--display);font-size:1.2rem;margin:1.6rem 0 .5rem;color:var(--teal)}
.inst .legal p,.inst .legal li{color:var(--ink-60)}
.inst .legal ul{padding-left:1.2rem}
.inst .updated{color:var(--ink-40);font-size:.9rem;margin-bottom:1rem}
.inst details{background:#fff;border:1px solid var(--line);border-radius:var(--r);margin-bottom:.7rem;overflow:hidden}
.inst details summary{padding:1.05rem 1.2rem;font-family:var(--display);font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.inst details summary::-webkit-details-marker{display:none}
.inst details summary::after{content:"+";font-size:1.4rem;color:var(--teal);font-weight:400}
.inst details[open] summary::after{content:"\2212"}
.inst details .ans{padding:0 1.2rem 1.1rem;color:var(--ink-60)}
.inst .faq-cat{font-family:var(--display);font-weight:600;color:var(--teal-l);margin:1.6rem 0 .8rem;font-size:1.05rem}

@media(max-width:1024px){
  .inst .hgrid, .inst .grid-2, .inst .contact-grid{grid-template-columns:1fr}
  .inst .grid-3, .inst .steps, .inst .tiers{grid-template-columns:1fr}
  .inst .grid-4, .inst .stats{grid-template-columns:1fr 1fr}
  .inst .points{grid-template-columns:1fr}
}
@media(max-width:600px){
  .inst .grid-4, .inst .stats{grid-template-columns:1fr}
  .inst .band, .inst .quote{padding:28px}
}

/* ---- illustrations ---- */
.illu{width:100%;height:100%;display:block}
.thumb{overflow:hidden}
.lcard .lt{overflow:hidden}
.illfill{position:absolute;inset:0;overflow:hidden}
.inst .illu-mini{height:140px;border-radius:14px;overflow:hidden;margin-bottom:16px}
.inst .illu-thumb{overflow:hidden}