/* TecPal site styles — layered on styles.css tokens. Motion spec: 200–400ms, --ease-out, transform/opacity only. */
:root{--cut:clamp(28px,4vw,56px);--cream:#fdf6ea;--hdr-h:72px}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--text-body);background:var(--white);font-size:16px;line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--info-600);text-decoration:none}
/* Underline only where a link sits in a run of prose. Everything else, cards, nav,
   buttons, chips, tiles, rows, never underlines regardless of its class. */
p a:hover,li a:hover,dd a:hover,td a:hover,small a:hover,label a:hover,figcaption a:hover,blockquote a:hover,.notes a:hover,.method a:hover,.disclaimer a:hover,.vat-note a:hover,.lsn-lede a:hover,.art-body a:hover{text-decoration:underline;text-underline-offset:3px}
img{max-width:100%;display:block}
.wrap{max-width:var(--container-page);margin:0 auto;padding-inline:clamp(20px,4vw,48px)}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-heading);line-height:var(--leading-snug);margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--gold-800)}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--gold-500);border-radius:2px}
.on-dark .eyebrow{color:var(--gold-300)}
.h2{font-size:clamp(1.9rem,3.6vw,2.75rem);letter-spacing:var(--tracking-snug);margin:14px 0 12px}
.lede{font-size:clamp(1rem,1.4vw,1.155rem);color:var(--text-muted);max-width:56ch}
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4{color:#fff}
.on-dark .lede,.on-dark p{color:rgba(255,255,255,.78)}
/* A light card inside a dark band is its own surface: white headings and body text
   would be invisible on it, so the dark-band colours stop at the card boundary. */
.on-dark .card h1,.on-dark .card h2,.on-dark .card h3,.on-dark .card h4,
.on-dark .cert h1,.on-dark .cert h2,.on-dark .cert h3,.on-dark .cert h4{color:var(--text-heading)}
.on-dark .card p,.on-dark .card .lede,.on-dark .cert p{color:var(--grey-700)}
.center{text-align:center}
.center .lede{margin-inline:auto}
.center .eyebrow::before{display:none}
/* ---- Buttons (48px targets) ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 26px;border-radius:var(--radius-pill);font-family:var(--font-sans);font-size:16px;font-weight:600;letter-spacing:.01em;border:1.5px solid transparent;cursor:pointer;transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out),background var(--duration-base) var(--ease-out)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.on-dark .btn:focus-visible,.band--gold .btn:focus-visible{outline-color:var(--navy-700)}
.btn-gold{background:var(--gold-500);color:var(--navy-700)}
.btn-gold:hover{background:var(--gold-400);box-shadow:var(--shadow-accent);color:var(--navy-700)}
.btn-navy{background:var(--navy-700);color:#fff}
.btn-navy:hover{background:var(--navy-600);box-shadow:var(--shadow-brand);color:#fff}
.btn-ghost{border-color:rgba(255,255,255,.4);color:#fff;background:transparent}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff}
.btn-ghost-navy{border-color:var(--navy-200);color:var(--navy-700)}
.btn-ghost-navy:hover{border-color:var(--navy-700);color:var(--navy-700)}
.btn-wa{background:#0f7437;color:#fff}
.btn-wa:hover{background:#0b5c2b;color:#fff}
.btn-sm{min-height:40px;padding:8px 18px;font-size:14px}
/* ---- Bands & diagonal cuts ---- */
.band{position:relative;overflow:hidden;padding-block:clamp(64px,9vw,116px)}
.band--navy{background:var(--navy-700)}
.band--deep{background:var(--navy-800)}
.band--cream{background:var(--cream)}
.band--paper{background:var(--white)}
.band--gold{background:var(--gold-500)}
.cut{clip-path:polygon(0 var(--cut),100% 0,100% 100%,0 100%);margin-top:calc(-1*var(--cut));padding-top:calc(clamp(64px,9vw,116px) + var(--cut))}
.cut-r{clip-path:polygon(0 0,100% var(--cut),100% 100%,0 100%)}
/* ---- Reveal choreography ---- */
html.js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity var(--duration-reveal) var(--ease-out),transform var(--duration-reveal) var(--ease-out);transition-delay:var(--d,0ms)}
html.js [data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html.js [data-reveal]{opacity:1;transform:none;transition:none}*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* ---- Announcement + header ---- */
.annc{background:var(--navy-900);color:#fff;font-size:13.5px;padding:9px 0;position:relative;z-index:calc(var(--z-sticky) + 1)}
.annc .wrap{display:flex;align-items:center;justify-content:center;gap:10px}
.annc b{color:var(--gold-300);font-weight:600}
.annc a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.annc-x{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:0;color:rgba(255,255,255,.6);cursor:pointer;padding:6px;line-height:0}
.annc-x:hover{color:#fff}
.hdr{position:sticky;top:0;z-index:var(--z-sticky);transition:background 150ms ease,box-shadow 150ms ease,backdrop-filter 150ms ease}
.hdr .wrap{display:flex;align-items:center;gap:28px;height:var(--hdr-h);position:relative}
.hdr.scrolled{background:rgba(24,24,56,.82);backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(16,16,40,.35)}
.hdr-logo{display:flex;align-items:center;gap:11px;color:#fff;font-weight:800;font-size:23px;letter-spacing:-.01em}
.hdr-logo img{width:48px;height:48px}
.hdr-nav{display:flex;align-items:center;gap:4px;margin-inline:auto}
.hdr-nav>li{list-style:none;position:static}
.hdr-nav a.top{display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.85);font-size:15px;font-weight:500;padding:10px 14px;border-radius:10px}
.hdr-nav a.top:hover{color:#fff;background:rgba(255,255,255,.08)}
.hdr-cta{display:flex;align-items:center;gap:14px;flex:none}
.hdr-cta .btn,.hdr-cta .hdr-login{white-space:nowrap;flex:none}
.hdr-login{color:rgba(255,255,255,.85);font-weight:500;font-size:15px}
.hdr-login:hover{color:#fff}
.mega{position:absolute;left:50%;right:auto;transform:translate(-50%,8px);top:calc(100% + 6px);width:min(880px,calc(100vw - 48px));max-width:calc(100vw - 48px);background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);padding:26px;opacity:0;visibility:hidden;transition:opacity 180ms var(--ease-out) 200ms,transform 180ms var(--ease-out) 200ms,visibility 0s linear 380ms}
.mega::before{content:"";position:absolute;top:-26px;left:0;right:0;height:26px}
.has-mega:hover .mega,.has-mega:focus-within .mega{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
.mega-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.mega-col{padding:14px;border-radius:var(--radius-md);border-top:3px solid var(--sc)}

.mega-col h5{margin:0 0 8px;font-size:15px;color:var(--navy-700);display:flex;align-items:center;gap:8px}
.mega-col h5 i,.mega-col h5 svg{color:var(--sc)}
.mega-col a{display:block;font-size:13.5px;color:var(--grey-600);padding:5px 8px;margin-inline:-8px;border-radius:8px;transition:background 130ms var(--ease-out),color 130ms var(--ease-out)}
.mega-col a:hover{color:var(--navy-800);background:var(--grey-50)}
.mega-tiers{display:flex;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid var(--grey-200);flex-wrap:wrap;align-items:center}
.mega-tiers span{font-size:12px;font-weight:600;color:var(--grey-600);letter-spacing:.06em;text-transform:uppercase;margin-right:4px}
.mega-sm{width:min(680px,92vw)}
.mega-col .visit{display:block;width:fit-content;margin-top:9px;font-size:12.5px;font-weight:700;color:var(--sct,var(--sc))}
.mega-col .visit:hover{opacity:.78}
.mega-tiers a.all{margin-left:auto;font-weight:700;font-size:13px;color:var(--navy-700)}
/* ==== Patterns, hero slides, Pal demo, faces ==== */
.swoop{display:block;width:100%;height:clamp(34px,5vw,72px);margin-bottom:-1px}
.band>.wrap{position:relative;z-index:1}
.pattern-chevron::before{content:"";position:absolute;inset:0;background:url("../assets/pattern/chevron-tile-gold.svg");background-size:54px;opacity:.07;pointer-events:none}
.pattern-chevron::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(250,165,50,.2) 1.4px,transparent 1.5px);background-size:16px 16px;-webkit-mask-image:radial-gradient(120% 120% at 50% 50%,#000 55%,rgba(0,0,0,.35) 100%);mask-image:radial-gradient(120% 120% at 50% 50%,#000 55%,rgba(0,0,0,.35) 100%);pointer-events:none}
.band--gold.pattern-halftone::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(30,30,70,.13) 1.2px,transparent 1.3px);background-size:15px 15px;pointer-events:none}
.wm-africa{position:absolute;right:2%;top:50%;transform:translateY(-50%);width:min(38vw,440px);height:auto;opacity:.1;pointer-events:none;z-index:0;display:block}


.faces{display:flex;align-items:center;margin-bottom:24px}
.fc{width:46px;height:46px;border-radius:50%;overflow:hidden;border:2.5px solid #fff;margin-left:-10px;background:var(--gold-300);flex:none;box-shadow:var(--shadow-sm)}
.fc image-slot{font-size:0}
.fc:first-child{margin-left:0}
.faces .more{margin-left:12px;font-size:13px;font-weight:700;color:var(--navy-800)}
.band--gold .comm{background:rgba(255,255,255,.32);border:1px solid rgba(255,255,255,.45);box-shadow:none}
.band--gold .comm:hover{box-shadow:var(--shadow-md)}
.band--gold .comm p{color:rgba(30,30,70,.72)}
.band--gold .comm h3{color:var(--navy-800)}
.pillar .ic{transition:transform 260ms var(--ease-pop)}
.pillar:hover .ic{transform:scale(1.12) rotate(-6deg)}
.tag-live::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--success-500);margin-right:5px;animation:pulse 2.4s infinite}
.pd-body{flex:1;min-height:288px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:2px}
.pd-chips button{cursor:pointer}
.burger{display:none;background:none;border:0;color:#fff;cursor:pointer;padding:10px;line-height:0;margin-left:auto}
.drawer{position:fixed;inset:0;background:var(--navy-800);z-index:var(--z-overlay);display:flex;flex-direction:column;padding:24px;transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out);overflow:auto}
.drawer.open{opacity:1;visibility:visible;transform:none}
.drawer-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.drawer nav a{display:block;color:#fff;font-size:26px;font-weight:600;padding:12px 4px;border-bottom:1px solid rgba(255,255,255,.08)}
.drawer nav a small{display:block;font-size:13px;font-weight:400;color:rgba(255,255,255,.55)}
.drawer .btn{margin-top:22px}
/* ---- Hero ---- */
.hero{position:relative;background:var(--navy-800);margin-top:calc(-1*var(--hdr-h) - 41px);padding-top:calc(var(--hdr-h) + 41px);overflow:hidden;min-height:100vh;min-height:100svh;display:grid}
.hero-bg{position:absolute;inset:0;pointer-events:auto}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(100deg,rgba(24,24,56,.94) 26%,rgba(24,24,56,.72) 56%,rgba(30,30,70,.42));pointer-events:none}
.hero .wrap{position:relative;z-index:2;padding-block:clamp(72px,11vh,130px) clamp(84px,12vh,150px);pointer-events:none}
.hero>.wrap,.hero-slide>.wrap{width:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;padding-bottom:30px}
.hero .badge-ai{margin-top:auto}
.hero .hero-pills{margin-top:auto;padding-top:28px}
.hero .wrap :is(a,button,.badge-ai){pointer-events:auto}
.badge-ai{display:inline-flex;align-items:center;gap:8px;background:rgba(250,165,50,.14);border:1px solid rgba(250,165,50,.45);color:var(--gold-300);font-size:13px;font-weight:600;letter-spacing:.05em;padding:7px 14px;border-radius:var(--radius-pill)}
.badge-ai .dot{width:7px;height:7px;border-radius:50%;background:var(--gold-400);animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(250,165,50,.5)}55%{box-shadow:0 0 0 8px rgba(250,165,50,0)}}
.hero h1,.hero h2.as-h1{font-size:clamp(2.4rem,5vw,4.15rem);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);color:#fff;margin:22px 0 18px;max-width:14ch}
.kin .w{display:inline-block;overflow:hidden;vertical-align:bottom}
.kin .w span{display:inline-block;transform:translateY(110%);transition:transform 640ms var(--ease-out);transition-delay:var(--kd,0ms)}
.kin.in .w span{transform:none}
html:not(.js) .kin .w span{transform:none}
.gold-word span{background:linear-gradient(110deg,var(--gold-300),var(--gold-500) 40%,#ffe3ae 50%,var(--gold-500) 60%,var(--gold-400));background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 3.2s var(--ease-standard) 1.4s 2}
@keyframes shimmer{0%{background-position:120% 0}100%{background-position:-60% 0}}
.hero-sub{font-size:clamp(1.02rem,1.5vw,1.2rem);color:rgba(255,255,255,.82);max-width:52ch;margin-bottom:30px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-micro{margin-top:16px;font-size:13.5px;color:rgba(255,255,255,.62)}
.hero-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.pill{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.9);font-size:13.5px;font-weight:500;padding:9px 16px;border-radius:var(--radius-pill);transition:border-color 200ms,background 200ms}
.pill:hover{border-color:var(--gold-400);background:rgba(250,165,50,.1);color:#fff}
.pill i,.pill svg{width:15px;height:15px;color:var(--gold-400)}
/* ---- Trust strip / marquees ---- */
.trust{background:var(--navy-900);padding:22px 0;border-top:1px solid rgba(255,255,255,.06)}
.trust.logos{padding:18px 0;border-top:1px solid rgba(255,255,255,.05)}
.trust.logos .marq{padding-inline:24px}
.trust .wrap{display:flex;align-items:center;gap:26px}
.trust-meta{display:flex;gap:18px;align-items:center;white-space:nowrap;font-size:13px;color:rgba(255,255,255,.7);flex-wrap:wrap;justify-content:center}
.trust-meta b{color:var(--gold-300);font-weight:600}
.trust-meta .sep{width:1px;height:18px;background:rgba(255,255,255,.15)}
.marq{overflow:hidden;flex:1;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq-track{display:flex;gap:52px;width:max-content;animation:marq 32s linear infinite;align-items:center}
.marq:hover .marq-track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}
.logo-word{font-weight:700;font-size:17px;color:rgba(255,255,255,.55);letter-spacing:-.01em;white-space:nowrap}
.band--paper .logo-word,.band--cream .logo-word{color:var(--grey-600)}
/* ---- Stats ---- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,3vw,40px)}
.stat b{display:block;font-size:clamp(2.2rem,4vw,3.4rem);font-weight:700;color:var(--gold-400);letter-spacing:-.02em;line-height:1}
.stat .u{display:block;width:44px;height:3px;border-radius:2px;background:var(--gold-500);margin:12px 0 10px;transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--ease-out) 300ms}
.stat.in .u,html:not(.js) .stat .u{transform:none}
.stat p{font-size:14.5px;color:rgba(255,255,255,.72)}
.measure{margin-top:26px;font-size:13.5px}
.measure-top{margin:0 0 clamp(18px,2.4vw,28px);font-size:15px}
.measure-top a{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:700;font-size:clamp(19px,2.1vw,24px);letter-spacing:-.01em;color:var(--gold-400)}
.measure-top a:hover{color:var(--gold-300)}
.measure-top a svg{width:18px;height:18px;transition:transform 200ms var(--ease-out)}
.measure-top a:hover svg{transform:translateX(4px)}
.measure a{color:var(--gold-300);font-weight:600}
/* ---- Cards, grids ---- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,26px)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,22px)}
.card{background:var(--surface-default);border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--pad-card)}
.hoverable{transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out)}
.hoverable:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.persona{display:flex;flex-direction:column;gap:12px}
.persona .ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--surface-brand-soft);color:var(--navy-700)}
.persona h3{font-size:19px}
.persona p{font-size:14.5px;color:var(--text-muted);flex:1}
.persona a{font-weight:600;font-size:14.5px;color:var(--navy-700);display:inline-flex;gap:6px;align-items:center}
.persona a:hover{color:var(--gold-700)}
.quiz-bar{margin-top:26px;background:var(--navy-700);border-radius:var(--radius-lg);padding:20px 26px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.quiz-bar p{color:#fff;font-weight:500;flex:1;min-width:240px}
.quiz-bar p small{display:block;font-weight:400;color:rgba(255,255,255,.6);font-size:13px}
/* ---- Schools bento ---- */
.bento{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(190px,auto);gap:clamp(14px,2vw,22px)}
.school{--sc:var(--school-engineering);--scs:var(--school-engineering-soft);position:relative;overflow:hidden;background:#fff;border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:26px;display:flex;flex-direction:column;gap:10px;transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out)}
.school::before{content:"";position:absolute;inset:0;background:linear-gradient(125deg,var(--scs) 0%,transparent 55%);opacity:0;transition:opacity 300ms var(--ease-out)}
.school:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.school:hover::before{opacity:1}
.school>*{position:relative}
.school.lg{grid-row:span 2;justify-content:flex-end;gap:12px}
.school .ic{width:46px;height:46px;border-radius:13px;background:var(--scs);color:var(--sc);display:grid;place-items:center}
.school h3{font-size:20px}
.school p{font-size:14px;color:var(--text-muted)}
.school .meta{font-size:12.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--sct,var(--sc))}
.school .go{position:absolute;right:22px;bottom:22px;color:var(--sc);transition:transform var(--duration-base) var(--ease-out)}
.school:hover .go{transform:translateX(5px)}
/* ---- Course cards ---- */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:26px 0}
.fbtn{border:1.5px solid var(--grey-300);background:#fff;color:var(--grey-600);font-family:var(--font-sans);font-size:13.5px;font-weight:600;padding:9px 18px;border-radius:var(--radius-pill);cursor:pointer;transition:all 200ms var(--ease-out)}
.fbtn:hover{border-color:var(--navy-400);color:var(--navy-700)}
.fbtn.on{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
.course{--sc:var(--school-engineering);--scs:var(--school-engineering-soft);position:relative;background:#fff;border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out)}
.course:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.course-thumb{position:relative;height:132px;background:linear-gradient(130deg,var(--scs),#fff 130%);display:flex;align-items:center;justify-content:center;overflow:hidden}
.course-thumb i,.course-thumb svg{width:44px;height:44px;color:var(--sc);opacity:.9;transition:transform 300ms var(--ease-out)}
.course:hover .course-thumb i,.course:hover .course-thumb svg{transform:scale(1.06)}
.chip{position:absolute;top:12px;left:12px;font-size:11px;font-weight:700;letter-spacing:.08em;padding:5px 10px;border-radius:6px;background:var(--navy-700);color:#fff}
.chip.new{background:var(--gold-500);color:var(--navy-700)}
.course-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.badges{display:flex;gap:6px;flex-wrap:wrap}
.badge{font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:var(--radius-pill);background:var(--grey-100);color:var(--grey-800)}
.badge.sc{background:var(--scs);color:var(--sct,var(--sc))}
.badge.free{background:var(--gold-500);color:var(--navy-800)}
.course h3{font-size:18px}
.course .fmt{font-size:13px;color:var(--grey-600)}
.course-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid var(--grey-100)}
.price{font-weight:700;color:var(--navy-700);font-size:15.5px}
.price small{display:block;font-weight:400;color:var(--text-subtle);font-size:12px}
.peek{position:absolute;left:0;right:0;top:0;height:132px;box-sizing:border-box;overflow:hidden;background:var(--navy-800);color:#fff;padding:13px 22px;transform:translateY(-101%);transition:transform 300ms var(--ease-out);pointer-events:none;z-index:2}
.course:hover .peek,.course:focus-within .peek{transform:none}
.peek b{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-300)}
.peek ul{margin:8px 0 0;padding:0;list-style:none;font-size:13px;color:rgba(255,255,255,.85);display:grid;gap:4px}
.peek li{display:flex;gap:8px;align-items:baseline}
.peek li::before{content:"→";color:var(--gold-400)}
/* ---- Steps / ladder ---- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,24px);position:relative}
.steps::before{content:"";position:absolute;top:23px;left:6%;right:6%;height:2px;background:linear-gradient(90deg,var(--gold-500),var(--gold-300));transform:scaleX(0);transform-origin:left;transition:transform 1200ms var(--ease-out) 200ms}
.steps.in::before,html:not(.js) .steps::before{transform:none}
.step{position:relative;text-align:left}
.step .n{width:46px;height:46px;border-radius:50%;background:var(--gold-500);color:var(--navy-800);font-weight:700;display:grid;place-items:center;font-size:17px;margin-bottom:14px;position:relative;box-shadow:0 0 0 6px var(--cream)}
.on-dark .step .n{box-shadow:0 0 0 6px var(--navy-700)}
.step h3{font-size:17.5px;margin-bottom:6px}
.step p{font-size:14px;color:var(--text-muted)}
.ladder{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,22px);position:relative}
.tier{position:relative;background:var(--navy-600);border:1px solid rgba(255,255,255,.09);border-radius:var(--radius-lg);padding:24px;opacity:.55;transform:translateY(10px);transition:opacity 500ms var(--ease-out) var(--d,0ms),transform 500ms var(--ease-out) var(--d,0ms),box-shadow 500ms}
.ladder.in .tier,html:not(.js) .tier{opacity:1;transform:none}
.tier .no{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--gold-400)}
.tier h3{color:#fff;font-size:19px;margin:8px 0 4px}
.tier .dur{font-size:13px;color:rgba(255,255,255,.6)}
.tier .pr{margin-top:14px;font-weight:700;color:#fff;font-size:16.5px}
.tier .pr small{display:block;font-weight:400;font-size:12px;color:rgba(255,255,255,.55);margin-top:2px}
.tier.free{background:var(--navy-800);border-color:var(--gold-500);animation:glow 3s var(--ease-standard) infinite}
.tier.free .pr{color:var(--gold-400);font-size:20px}
@keyframes glow{0%,100%{box-shadow:0 0 0 0 rgba(250,165,50,.0),0 0 24px rgba(250,165,50,.18)}50%{box-shadow:0 0 0 1px rgba(250,165,50,.35),0 0 42px rgba(250,165,50,.4)}}
/* ---- Gold band: countdown / spots / map ---- */
.gold-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(26px,4vw,54px);align-items:center}
.band--gold h2{color:var(--navy-800)}
.band--gold .lede{color:rgba(30,30,70,.78)}
.cd{display:flex;gap:10px;margin:24px 0 6px}
.cd .cell{background:var(--navy-800);color:#fff;border-radius:14px;min-width:74px;padding:12px 8px;text-align:center}
.cd b{display:block;font-size:30px;font-weight:700;font-variant-numeric:tabular-nums}
.cd b.tick{animation:tickpop 300ms var(--ease-pop)}
@keyframes tickpop{0%{transform:scale(1)}40%{transform:scale(1.09)}100%{transform:scale(1)}}
.cd span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.spots{margin:18px 0 26px;max-width:420px}
.spots .bar{height:10px;border-radius:6px;background:rgba(30,30,70,.18);overflow:hidden}
.spots .fill{height:100%;width:0;border-radius:6px;background:var(--navy-800);transition:width 1100ms var(--ease-out) 300ms}
.spots p{font-size:13.5px;font-weight:600;color:var(--navy-800);margin-top:8px}
.map-panel{padding:0}
.map-panel h3{color:var(--navy-800);font-size:20px;margin-bottom:5px}
.map-panel .sub{font-size:15.5px;line-height:1.55;color:var(--navy-700);margin-bottom:12px}
.africa{width:100%;height:auto}
.africa .land{fill:rgba(255,255,255,.07);stroke:rgba(255,255,255,.22);stroke-width:1.5}
.ring{fill:none;stroke:var(--gold-400);stroke-width:1.4;opacity:0;transform-origin:center;transform-box:fill-box;animation:ripple 3.4s var(--ease-standard) infinite}
@keyframes ripple{0%{opacity:.7;transform:scale(.3)}80%{opacity:0;transform:scale(1.6)}100%{opacity:0;transform:scale(1.6)}}
.pin{transform-origin:center;transform-box:fill-box;opacity:0;transform:translateY(-14px);transition:opacity 400ms var(--ease-pop) var(--d,0ms),transform 400ms var(--ease-pop) var(--d,0ms)}
.in .pin,html:not(.js) .pin{opacity:1;transform:none}
.route{stroke:var(--gold-400);stroke-width:1.4;stroke-dasharray:4 7;fill:none;opacity:.7;animation:dash 2.6s linear infinite}
@keyframes dash{to{stroke-dashoffset:-22}}
.map-legend{display:flex;gap:14px;margin-top:12px;flex-wrap:wrap}
.map-legend span{font-size:14.5px;font-weight:600;color:var(--navy-700);display:inline-flex;gap:8px;align-items:center}
.map-legend .d{width:9px;height:9px;border-radius:50%;background:var(--navy-800)}
/* ---- Accordion ---- */
.acc{border:1px solid var(--grey-200);border-radius:var(--radius-md);background:#fff;overflow:hidden}
.acc+.acc{margin-top:10px}
.acc-head{width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:14px;background:none;border:0;font-family:var(--font-sans);font-size:15.5px;font-weight:600;color:var(--navy-700);padding:18px 20px;cursor:pointer;text-align:left}
.acc-head:focus-visible{outline:3px solid var(--focus-ring);outline-offset:-3px}
.acc-head .chev{margin-left:auto;transition:transform 260ms var(--ease-out);color:var(--grey-600);flex:none}
.acc.open .acc-head .chev{transform:rotate(180deg)}
.acc-body{height:0;overflow:hidden;transition:height 300ms var(--ease-out)}
.acc-inner{padding:0 20px 20px;font-size:14.5px;color:var(--text-muted)}
.acc-inner ul{margin:0;padding-left:18px;display:grid;gap:6px}
.acc .tagline{margin-left:auto;font-size:12px;font-weight:600;color:var(--grey-600)}
.acc.locked .acc-head{color:var(--grey-600);cursor:default}
.acc.locked .lock{color:var(--grey-600);position:relative}
.acc.locked:hover .lock{animation:jiggle 500ms var(--ease-pop)}
@keyframes jiggle{0%,100%{transform:rotate(0)}30%{transform:rotate(-9deg)}60%{transform:rotate(8deg)}}
.unlock{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--gold-800);background:var(--gold-50);border:1px solid var(--gold-200);padding:5px 12px;border-radius:var(--radius-pill);white-space:nowrap}
.unlock:hover{background:var(--gold-100);color:var(--gold-800)}
/* ---- Pal / AI section ---- */
.ai-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(26px,4vw,60px);align-items:stretch}
.pal-mock{background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:22px;max-width:430px;display:flex;flex-direction:column;height:100%}
.pal-mock .ph{display:flex;gap:10px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--grey-100);margin-bottom:14px}
.pal-ava{width:38px;height:38px;border-radius:50%;background:var(--gold-500);display:grid;place-items:center;color:var(--navy-800);flex:none}
.pal-mock .ph b{font-size:15px;color:var(--navy-700)}
.pal-mock .ph small{display:block;font-size:12px;color:var(--success-600);font-weight:600}
.msg{max-width:85%;padding:11px 14px;border-radius:14px;font-size:13.5px;margin-bottom:9px}
.msg.bot{background:var(--grey-50);color:var(--grey-800);border-top-left-radius:4px}
.msg.user{background:var(--navy-700);color:#fff;margin-left:auto;border-top-right-radius:4px}
.typing{display:inline-flex;gap:4px;padding:12px 14px;background:var(--grey-50);border-radius:14px;border-top-left-radius:4px}
.typing i,.typing svg{width:6px;height:6px;border-radius:50%;background:var(--grey-400);animation:tp 1.2s infinite}
.typing i:nth-child(2){animation-delay:.15s}
.typing i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.chips button{border:1px solid var(--grey-200);background:#fff;font-family:var(--font-sans);font-size:12.5px;font-weight:500;color:var(--navy-700);padding:8px 13px;border-radius:var(--radius-pill);cursor:pointer;transition:all 200ms}
.chips button:hover{border-color:var(--gold-500);background:var(--gold-50)}
.pillar{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--grey-100)}
.pillar:last-child{border:0}
.pillar .ic{width:42px;height:42px;border-radius:12px;background:var(--surface-brand-soft);color:var(--navy-700);display:grid;place-items:center;flex:none}
.pillar h4{font-size:16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pillar p{font-size:13.5px;color:var(--text-muted);margin-top:3px}
.tag-live{font-size:11px;font-weight:700;letter-spacing:.06em;background:var(--success-soft);color:var(--success-text);padding:3px 9px;border-radius:var(--radius-pill)}
.tag-soon{font-size:11px;font-weight:700;letter-spacing:.06em;background:var(--grey-100);color:var(--grey-600);padding:3px 9px;border-radius:var(--radius-pill)}
/* ---- People ---- */
.person{padding:0;overflow:hidden}
.person .photo{height:230px;position:relative}
.person .pb{padding:18px 22px 22px}
.person h3{font-size:17px}
.person .role{font-size:13.5px;color:var(--text-muted);margin:3px 0 10px}
.person .ex{display:flex;gap:8px;align-items:center;font-size:12px;font-weight:600;color:var(--grey-600)}
.person .ex b{color:var(--navy-600)}
.tst{display:flex;flex-direction:column;gap:14px}
.tst .qq{color:var(--gold-500)}
.tst p{font-size:14.5px;color:var(--grey-800);flex:1}
.tst .who{display:flex;gap:12px;align-items:center}
.tst .who .av{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none}
.tst .who b{display:block;font-size:14px;color:var(--navy-700)}
.tst .who small{font-size:12.5px;color:var(--grey-600)}
.t-rail{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
.video-card{position:relative;border-radius:var(--radius-lg);overflow:hidden;height:100%;min-height:260px}
.video-card .play{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;background:var(--gold-500);color:var(--navy-800);display:grid;place-items:center;box-shadow:var(--shadow-accent);transition:transform 250ms var(--ease-pop);z-index:2;pointer-events:none}
.video-card:hover .play{transform:scale(1.08)}
/* ---- Alumni ---- */
.alum{display:flex;flex-direction:column;gap:12px;padding:22px}
.alum .who{display:flex;gap:12px;align-items:center}
.alum .av{width:46px;height:46px;border-radius:50%;overflow:hidden;flex:none}
.alum b{font-size:14.5px;color:var(--navy-700)}
.alum small{font-size:12px;color:var(--text-subtle)}
.arrow-path{display:flex;flex-direction:column;gap:6px;font-size:13px}
.arrow-path .from{color:var(--grey-600)}
.arrow-path .to{font-weight:600;color:var(--navy-700)}
.arrow-path .to em{font-style:normal;color:var(--gold-700)}
.arrow-path i,.arrow-path svg{color:var(--gold-500)}
.disclaimer{font-size:12px;color:var(--grey-600);margin-top:16px}
/* ---- Campus / legitimacy ---- */
.campus{padding:0;overflow:hidden}
.campus .photo{height:240px}
.campus .cb{padding:20px 24px 24px;display:flex;flex-direction:column;gap:0}
.campus .cb>div{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.campus .cb .btn{flex:0 0 auto}
.campus .cb .gmap{margin-top:14px}
.campus h3{font-size:19px}
.campus .addr{font-size:14px;color:var(--text-muted);margin:6px 0 14px;display:flex;gap:8px}
.campus .addr i,.campus .addr svg{color:var(--gold-600);flex:none;margin-top:2px}
.legit{display:grid;grid-template-columns:1fr auto;gap:clamp(24px,4vw,60px);align-items:center}
.legit-items{display:grid;gap:14px}
.legit-item{display:flex;gap:14px;align-items:flex-start;font-size:14.5px;color:rgba(255,255,255,.8)}
.legit-item i,.legit-item svg{color:var(--gold-400);flex:none;margin-top:2px}
.legit-item b{color:#fff}
.cert{width:min(360px,88vw);background:#fff;border-radius:16px;padding:22px;box-shadow:var(--shadow-xl);position:relative;transform-style:preserve-3d;transition:transform 200ms var(--ease-out);overflow:hidden}
.cert::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(250,165,50,.28) 48%,rgba(255,255,255,.5) 52%,transparent 68%);transform:translateX(-120%);transition:transform 900ms var(--ease-out)}
.cert:hover::after{transform:translateX(120%)}
.cert .ct{font-size:11px;letter-spacing:.22em;color:var(--grey-600);text-transform:uppercase}
.cert h4{font-size:18px;color:var(--navy-700);margin:6px 0 2px}
.cert .cn{font-size:12px;color:var(--grey-600)}
.cert .row{display:flex;justify-content:space-between;align-items:flex-end;margin-top:20px}
.seal{width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--gold-300),var(--gold-600));display:grid;place-items:center;color:var(--navy-800)}
.qr{width:52px;height:52px;background:conic-gradient(var(--navy-800) 25%,#fff 0 50%,var(--navy-800) 0 75%,#fff 0);background-size:14px 14px;border:4px solid #fff;outline:1px solid var(--grey-300)}
/* ---- Pricing / compare / stepper ---- */
.ptable{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
.ptable th,.ptable td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--grey-200)}
.ptable thead th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--grey-600)}
.ptable .tname{font-weight:700;color:var(--navy-700)}
.ptable .free-row{background:var(--gold-50)}
.pay-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;align-items:center;font-size:13.5px;color:var(--text-muted)}
.pay-chip{border:1px solid var(--grey-200);border-radius:var(--radius-pill);padding:7px 14px;font-weight:600;font-size:13px;color:var(--navy-700);background:#fff;display:inline-flex;gap:7px;align-items:center}
.compare{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;background:#fff;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.compare th,.compare td{padding:15px 18px;border-bottom:1px solid var(--grey-100);text-align:left;vertical-align:top}
.compare thead th{background:var(--navy-700);color:#fff;font-size:13px}
.compare thead th.hl{background:var(--gold-500);color:var(--navy-800)}
.compare td.hl{background:var(--gold-50);font-weight:600;color:var(--navy-700)}
.compare td{color:var(--grey-600)}
.compare td:first-child{font-weight:600;color:var(--navy-700)}
.stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,24px);counter-reset:st}
.st{position:relative;background:#fff;border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:20px 22px;counter-increment:st;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:start;align-content:center}
.st::before{content:"0" counter(st);grid-row:1 / span 2;align-self:center;font-family:var(--font-display);font-size:22px;font-weight:800;line-height:1;color:var(--gold-800);background:var(--gold-50);border:1px solid var(--gold-200);border-radius:12px;width:46px;height:46px;display:grid;place-items:center}
.st h3{font-size:16px;margin:0 0 4px}
.st p{font-size:13.5px;color:var(--grey-700);line-height:1.5}
.st p{font-size:13.5px;color:var(--text-muted)}
/* ---- Community / final ---- */
.comm{display:flex;gap:14px;align-items:center}
.comm .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:none}
.comm h3{font-size:16.5px}
.comm p{font-size:13.5px;color:var(--text-muted)}
.final{text-align:center}
.final h2{font-size:clamp(2.1rem,4.5vw,3.4rem);color:var(--navy-800);max-width:20ch;margin-inline:auto}
.final p{color:rgba(30,30,70,.75);margin:14px 0 28px}
/* ---- Footer ---- */
.footer{background:var(--navy-900);color:rgba(255,255,255,.75);padding:clamp(56px,7vw,90px) 0 120px}
.f-grid{display:grid;grid-template-columns:1.55fr repeat(4,1fr);gap:38px 30px}
.f-brand p{font-size:13.5px;margin:14px 0 20px;max-width:30ch}
.footer h5{color:#fff;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.footer ul a{color:rgba(255,255,255,.65);font-size:13.5px}
.footer ul a:hover{color:var(--gold-300)}
.news{display:flex;gap:8px;margin-top:10px;max-width:320px}
.news input{flex:1;min-width:0;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-pill);padding:12px 16px;color:#fff;font-family:var(--font-sans);font-size:14px}
.news input::placeholder{color:rgba(255,255,255,.4)}
.news input:focus{outline:2px solid var(--gold-500);outline-offset:1px}
.f-bottom{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:rgba(255,255,255,.5)}
.f-bottom .legal{margin-left:auto;display:flex;gap:18px}
.f-bottom a{color:rgba(255,255,255,.6)}
.f-bottom a:hover{color:#fff}
/* ---- Floating: Pal, sticky bar, cookie ---- */
.pal-fab{position:fixed;right:20px;bottom:84px;z-index:var(--z-overlay);width:60px;height:60px;border-radius:50%;background:var(--gold-500);color:var(--navy-800);border:0;cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-accent);animation:bob 6s var(--ease-standard) infinite;transition:transform 200ms var(--ease-pop)}
.pal-fab:hover{transform:scale(1.06)}
@keyframes bob{0%,92%,100%{transform:translateY(0)}95%{transform:translateY(-6px)}98%{transform:translateY(2px)}}
.pal-panel{position:fixed;right:20px;bottom:92px;z-index:var(--z-overlay);width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 112px);display:flex;flex-direction:column;overflow:hidden;background:#fff;border-radius:20px;box-shadow:var(--shadow-xl);padding:18px;opacity:0;visibility:hidden;transform:translateY(12px) scale(.98);transform-origin:bottom right;transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out),visibility 240ms}
.pal-panel.open{opacity:1;visibility:visible;transform:none}
.pal-panel>div:first-of-type{flex:none}
.pal-panel .chips{flex:0 1 auto;min-height:0;overflow:auto;scrollbar-width:thin}
.pal-body{flex:1 1 auto;min-height:96px;max-height:280px;overflow:auto;padding:4px 2px}
.pal-input{flex:none;display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--grey-100)}
.pal-input input{flex:1;min-width:0;border:1.5px solid var(--grey-200);border-radius:var(--radius-pill);padding:11px 16px;font:500 14px var(--font-sans);color:var(--grey-900);background:#fff}
.pal-input input:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(250,165,50,.2)}
.pal-input input:disabled{opacity:.55}
.pal-send{width:44px;height:44px;border-radius:50%;background:var(--gold-500);border:0;display:grid;place-items:center;color:var(--navy-800);cursor:pointer;flex:none;transition:transform 180ms var(--ease-pop),background 180ms}
.pal-send:hover{transform:scale(1.07);background:var(--gold-400)}
.sticky-bar{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-sticky);background:rgba(24,24,56,.94);backdrop-filter:blur(12px);padding:10px 14px calc(10px + env(safe-area-inset-bottom));display:none;gap:10px;box-shadow:0 -8px 30px rgba(16,16,40,.4)}
.sticky-bar .btn{flex:1;min-height:48px;font-size:15px}
.cookie{position:fixed;left:20px;bottom:20px;z-index:var(--z-toast);width:min(340px,calc(100vw - 40px));background:#fff;border-radius:16px;box-shadow:var(--shadow-xl);padding:18px;font-size:13px;color:var(--grey-600);display:none}
.cookie.show{display:block}
.cookie .row{display:flex;gap:8px;margin-top:12px}
/* ==== Auth + dashboards ==== */
.auth-wrap{max-width:440px;width:100%}
.role-tabs{display:flex;background:var(--grey-100);border-radius:var(--radius-pill);padding:4px;margin-bottom:20px}
.role-tabs button{flex:1;border:0;background:none;font:600 14px var(--font-sans);padding:10px;border-radius:var(--radius-pill);cursor:pointer;color:var(--grey-600);transition:all 200ms var(--ease-out)}
.role-tabs button.on{background:var(--navy-700);color:#fff}
.demo-note{background:var(--gold-50);border:1px dashed var(--gold-300);border-radius:12px;padding:10px 14px;font-size:12.5px;color:var(--gold-800);margin-bottom:16px}
.dash{min-height:100vh;background:var(--surface-page);display:flex}
.side{width:232px;background:var(--navy-800);color:#fff;padding:20px 14px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh;flex:none;transition:width 200ms var(--ease-out);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}
/* Collapsed: icons only. font-size:0 hides the bare text nodes the markup uses for
   labels, while the icons keep their own inline width and height. */
.side-tog{position:absolute;right:10px;top:18px;width:30px;height:30px;border-radius:9px;border:0;background:rgba(255,255,255,.1);color:rgba(255,255,255,.72);cursor:pointer;display:grid;place-items:center;padding:0;z-index:2;transition:background 140ms var(--ease-out)}
.side-tog:hover{background:rgba(255,255,255,.2);color:#fff}
.side-tog svg{transition:transform 220ms var(--ease-out)}
.dash{position:relative}
.dash.side-collapsed .side{width:66px;padding-inline:9px}
.dash.side-collapsed .side a{gap:0;justify-content:center;font-size:0;padding-inline:0}
.dash.side-collapsed .side .hdr-logo{justify-content:center;padding-inline:0;font-size:0;gap:0}
.dash.side-collapsed .side .hdr-logo img{width:34px;height:34px;flex:none}
.dash.side-collapsed .side-tog{position:sticky;top:auto;bottom:14px;right:auto;left:auto;align-self:center;flex:none;margin-top:8px}
.dash.side-collapsed .side .foot{opacity:0;pointer-events:none}
.dash.side-collapsed .side-tog{opacity:0}
.dash.side-collapsed .side:hover .side-tog,.dash.side-collapsed .side:focus-within .side-tog,.dash.side-collapsed .side-tog:focus-visible{opacity:1}
/* touchscreen laptops have no reliable hover, and the collapsed rail only exists above 1060px */
@media (hover:none){.dash.side-collapsed .side-tog{opacity:1}}
.dash.side-collapsed .side-tog svg{transform:rotate(180deg)}
.side-burger{display:none;width:40px;height:40px;border-radius:11px;border:1px solid var(--grey-200);background:#fff;color:var(--navy-700);cursor:pointer;place-items:center;flex:none}
.side-scrim{position:fixed;inset:0;background:rgba(12,12,32,.5);z-index:calc(var(--z-overlay) - 1);opacity:0;visibility:hidden;transition:opacity 200ms var(--ease-out);border:0;padding:0}
.dash.side-open .side-scrim{opacity:1;visibility:visible}
.side .hdr-logo{margin-bottom:22px;padding-inline:10px;font-size:18px}
.side .hdr-logo img{width:38px;height:38px}
.side a{display:flex;gap:11px;align-items:center;color:rgba(255,255,255,.72);font-size:14px;font-weight:500;padding:10px 12px;border-radius:10px}
.side a:hover{background:rgba(255,255,255,.07);color:#fff}
.side a.on{background:var(--gold-500);color:var(--navy-800);font-weight:600}
.side .foot{margin-top:auto;font-size:11px;color:rgba(255,255,255,.4);padding:10px 12px}
.dmain{flex:1;min-width:0;display:flex;flex-direction:column}
.dtop{display:flex;align-items:center;gap:16px;background:#fff;border-bottom:1px solid var(--grey-200);padding:14px clamp(16px,3vw,32px);position:sticky;top:0;z-index:var(--z-sticky)}
.dtop h1{font-size:17px}
.dtop .sp{margin-left:auto;display:flex;gap:12px;align-items:center}
.avatar-chip{display:flex;gap:10px;align-items:center;background:var(--grey-50);border:1px solid var(--grey-200);border-radius:var(--radius-pill);padding:6px 14px 6px 6px;font-size:13px;font-weight:600;color:var(--navy-700)}
.avatar-chip .av{width:30px;height:30px;border-radius:50%;background:var(--gold-500);color:var(--navy-800);display:grid;place-items:center;font-size:12px;font-weight:700}
.dbody{padding:clamp(16px,3vw,32px);display:grid;gap:18px}
@media(min-width:561px){body:has(.pal-fab) .dbody{padding-right:calc(clamp(16px,3vw,32px) + 76px)}}
.dbody>*{min-width:0}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kpi{background:#fff;border:var(--border-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:18px}
.kpi b{display:block;font-size:26px;color:var(--navy-700);letter-spacing:-.01em}
.kpi span{font-size:12.5px;color:var(--grey-600)}
.kpi .up{color:var(--success-text);font-weight:600;font-size:12px}
.panel{background:#fff;border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:20px}
.panel h2{font-size:15px;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.panel h2 .rt{margin-left:auto;font-size:12px;font-weight:600;color:var(--grey-600)}
.dtable{width:100%;border-collapse:collapse;font-size:13.5px}
.dtable th{text-align:left;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--grey-600);padding:8px 10px;border-bottom:1px solid var(--grey-200)}
.dtable td{padding:11px 10px;border-bottom:1px solid var(--grey-100);color:var(--grey-700)}
.dtable td b{color:var(--navy-700)}
.st-chip{font-size:11px;font-weight:700;padding:4px 10px;border-radius:var(--radius-pill)}
.st-ok{background:var(--success-soft);color:var(--success-text)}
.st-wait{background:var(--warning-soft);color:var(--warning-text)}
.st-bad{background:var(--danger-soft);color:var(--danger-text)}
.st-info{background:var(--info-soft);color:var(--info-text)}
.fillbar{height:7px;border-radius:4px;background:var(--grey-100);min-width:90px;overflow:hidden}
.fillbar i,.fillbar svg{display:block;height:100%;border-radius:4px;background:var(--gold-500)}
.hbars{display:grid;gap:12px}
.hbar{display:grid;grid-template-columns:110px 1fr 46px;gap:12px;align-items:center;font-size:13px;color:var(--grey-700)}
.hbar .tr{height:12px;border-radius:6px;background:var(--grey-100);overflow:hidden}
.hbar .tr i,.hbar .tr svg{display:block;height:100%;border-radius:6px;background:var(--sc,var(--gold-500));transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--ease-out) 200ms}
.in .hbar .tr i,html:not(.js) .hbar .tr i,.in .hbar .tr svg,html:not(.js) .hbar .tr svg{transform:none}
.hbar b{text-align:right;color:var(--navy-700)}
.two-col{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;align-items:start}
.ladder-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.lm{border:1.5px solid var(--grey-200);border-radius:12px;padding:12px;font-size:12px;color:var(--grey-600);position:relative}
.lm b{display:block;font-size:13px;color:var(--navy-700);margin-top:4px}
.lm.done{border-color:var(--success-500);background:var(--success-soft)}
.lm.active{border-color:var(--gold-500);background:var(--gold-50);box-shadow:0 0 0 3px rgba(250,165,50,.18)}
.lm .tag{position:absolute;top:-9px;left:10px;font-size:11px;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:6px;background:var(--gold-500);color:var(--navy-800)}
.sched{display:grid;gap:10px}
.sched li{list-style:none;display:flex;gap:12px;align-items:center;border:1px solid var(--grey-100);border-radius:12px;padding:11px 14px;font-size:13.5px;color:var(--grey-700)}
.sched .dt{font-weight:700;color:var(--navy-700);font-size:12.5px;min-width:86px}
.sched .live{margin-left:auto}
@media (max-width:1060px){.kpis{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}.ladder-mini{grid-template-columns:repeat(2,1fr)}
.side{position:fixed;left:0;top:0;z-index:var(--z-overlay);transform:translateX(-100%);transition:transform 220ms var(--ease-out);box-shadow:var(--shadow-xl)}
.dash.side-open .side{transform:none}
/* Sized here rather than in the shared touch block: the drawer is created at this
   breakpoint, so its targets must be sized at the same one. The touch block fires at
   720px, which would have left 720 to 1060px, where this is the only navigation
   these pages have, at 40px. */
.side-burger{display:grid;width:48px;height:48px}
.side a{min-height:48px}
.side-tog{display:none}
/* collapsing is meaningless in a drawer, so it always opens at full width */
.dash.side-collapsed .side{width:232px;padding-inline:14px}
.dash.side-collapsed .side a{gap:11px;justify-content:flex-start;font-size:14px;padding-inline:12px}
.dash.side-collapsed .side .hdr-logo{justify-content:flex-start;padding-inline:10px;font-size:18px}
.dash.side-collapsed .side .foot{opacity:1}}
@media (max-width:720px){.kpis{grid-template-columns:1fr 1fr}.dtable-scroll{overflow-x:auto}.dtable{min-width:560px}}
.notif{position:relative}
.notif-pop{position:absolute;right:0;top:calc(100% + 10px);width:320px;background:#fff;border-radius:14px;box-shadow:var(--shadow-xl);border:var(--border-card);padding:10px;display:none;z-index:300}
.notif-pop.open{display:block;animation:stepin 220ms var(--ease-out)}
.notif-pop p{font-size:13px;color:var(--grey-700);padding:10px 10px;border-radius:10px}
.notif-pop p:hover{background:var(--grey-50)}
.notif-pop p b{color:var(--navy-700)}
.notif-pop p small{display:block;color:var(--grey-600);font-size:11px;margin-top:2px}
.notif-dot{position:absolute;top:6px;right:6px;width:8px;height:8px;border-radius:50%;background:var(--danger-500);border:2px solid #fff}
.icon-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--grey-200);background:#fff;display:grid;place-items:center;color:var(--navy-700);cursor:pointer}
.icon-btn:hover{background:var(--grey-50)}
.pmx td i,.pmx td svg{vertical-align:middle}
.audit li{list-style:none;display:flex;gap:12px;font-size:13px;color:var(--grey-700);padding:9px 0;border-bottom:1px solid var(--grey-100)}
.audit li:last-child{border:0}
.audit .when{color:var(--grey-600);font-size:12px;white-space:nowrap;min-width:76px}
.nc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;background:#fff;border:1px solid var(--grey-200);border-left:4px solid var(--gold-500);border-radius:var(--radius-lg);padding:18px 20px}
.nc h3{font-size:17px;margin:0 0 4px;color:var(--navy-800)}
.nc .meta{font-size:13.5px;color:var(--grey-700);display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.nc .meta b{color:var(--navy-700);font-weight:600}
.cd{display:flex;gap:8px}
.cd div{background:var(--navy-800);color:#fff;border-radius:10px;padding:8px 0;min-width:58px;text-align:center}
.cd b{display:block;font-family:var(--font-display);font-size:21px;line-height:1;font-variant-numeric:tabular-nums}
.cd small{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.66);margin-top:3px}
.nc .acts{display:flex;flex-direction:column;gap:8px;min-width:186px}
.nc-soon{font-size:12.5px;color:var(--grey-700);text-align:center}
.nc.live{border-left-color:var(--success-text);background:var(--success-soft)}
.nc-rem{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--grey-100);font-size:12.5px;color:var(--grey-700)}
.nc-rem span{display:inline-flex;gap:6px;align-items:center}
.nc-rem span.done{color:var(--success-text);font-weight:600}
@media(max-width:760px){.nc{grid-template-columns:1fr}.nc .acts{min-width:0}}
.tact{appearance:none;display:inline-flex;align-items:center;justify-content:center;min-height:34px;border:1.5px solid var(--grey-300);background:#fff;color:var(--navy-700);font:600 12px var(--font-sans);padding:6px 12px;border-radius:var(--radius-pill);cursor:pointer;transition:border-color 140ms var(--ease-out),color 140ms var(--ease-out)}
.tact:hover{border-color:var(--navy-700)}
.tact:disabled{opacity:.55;cursor:default}
.tact.warn{color:var(--danger-text);border-color:var(--danger-soft)}
.role-sel{font:600 12.5px var(--font-sans);color:var(--navy-700);border:1px solid var(--grey-200);border-radius:8px;padding:6px 8px;background:#fff}
/* ==== Studio, feed, automations ==== */
.tgl{width:42px;height:24px;border-radius:14px;background:var(--grey-300);border:0;cursor:pointer;position:relative;transition:background 200ms;flex:none}
.tgl::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform 200ms var(--ease-out);box-shadow:var(--shadow-xs)}
.tgl.on{background:var(--success-500)}
.tgl.on::after{transform:translateX(18px)}
.auto-row{display:flex;gap:14px;align-items:flex-start;padding:13px 0;border-bottom:1px solid var(--grey-100)}
.auto-row:last-child{border:0}
.auto-row b{display:block;font-size:14px;color:var(--navy-700)}
.auto-row small{font-size:12.5px;color:var(--grey-600)}
.auto-row .tgl{margin-left:auto;margin-top:4px}
.feed{display:grid;gap:12px}
.post{border:1px solid var(--grey-100);border-radius:14px;padding:14px}
.post.pinned{background:var(--gold-50);border-color:var(--gold-200)}
.post .who{display:flex;gap:10px;align-items:center;margin-bottom:8px;font-size:13px;color:var(--grey-600)}
.post .who .av{width:34px;height:34px;border-radius:50%;background:var(--surface-brand-soft);color:var(--navy-700);display:grid;place-items:center;font-weight:700;font-size:12px;flex:none}
.post .who b{color:var(--navy-700)}
.post p{font-size:14px;color:var(--grey-700)}
.post .acts{display:flex;gap:16px;margin-top:10px}
.post .acts button{background:none;border:0;font:600 12.5px var(--font-sans);color:var(--grey-600);cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.post .acts button:hover{color:var(--navy-700)}
.streak-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.streak-row .st-chip{display:inline-flex;gap:6px;align-items:center}
.studio{display:grid;grid-template-columns:210px 270px minmax(0,1fr);flex:1;min-height:0}
.stu-col{border-right:1px solid var(--grey-200);background:#fff;overflow:auto}
.stu-col h3{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--grey-600);padding:16px 16px 8px}
.coll{display:flex;gap:10px;align-items:center;padding:10px 16px;font-size:13.5px;font-weight:500;color:var(--grey-600);cursor:pointer;border:0;background:none;width:100%;text-align:left;font-family:var(--font-sans)}
.coll:hover{background:var(--grey-50)}
.coll.on{background:var(--gold-50);color:var(--navy-700);font-weight:600;box-shadow:inset 3px 0 0 var(--gold-500)}
.coll .n{margin-left:auto;font-size:11px;color:var(--grey-600)}
.doc{padding:13px 16px;border-bottom:1px solid var(--grey-100);cursor:pointer}
.doc:hover{background:var(--grey-50)}
.doc.on{background:var(--gold-50);box-shadow:inset 3px 0 0 var(--gold-500)}
.doc b{display:block;font-size:13.5px;color:var(--navy-700)}
.doc small{font-size:11.5px;color:var(--grey-600)}
.stu-main{padding:clamp(16px,2.5vw,28px);overflow:auto;background:var(--surface-page)}
.stu-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.stu-bar h2{font-size:18px;margin-right:auto}
.savechip{font-size:11.5px;color:var(--grey-600)}
.mod-row{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid var(--grey-200);border-radius:12px;padding:11px 14px;font-size:13.5px}
.mod-row+.mod-row{margin-top:8px}
.mod-row b{color:var(--navy-700)}
.mod-row .drip{margin-left:auto;font-size:11.5px;color:var(--grey-600);white-space:nowrap}
.mod-row .mv{display:flex;flex-direction:column;gap:2px}
.mod-row .mv button{border:1px solid var(--grey-200);background:#fff;border-radius:6px;width:22px;height:18px;line-height:1;font-size:11px;cursor:pointer;color:var(--grey-600)}
.mod-row .mv button:hover{color:var(--navy-700);border-color:var(--navy-300)}
.stu-main .field input{min-width:0;font-size:14px}
.vh li{list-style:none;display:flex;gap:10px;font-size:12.5px;color:var(--grey-600);padding:8px 0;border-bottom:1px solid var(--grey-100)}
.vh .when{color:var(--grey-600);min-width:70px}
@media (max-width:1060px){.studio{grid-template-columns:200px minmax(0,1fr)}.stu-col.docs{display:none}}
@media (max-width:720px){.studio{grid-template-columns:1fr}.stu-col{border-right:0;border-bottom:1px solid var(--grey-200)}}
/* ==== Pipeline ==== */
.pipe{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pcol{background:var(--grey-50);border:1px solid var(--grey-200);border-radius:14px;padding:12px;display:grid;gap:10px;align-content:start}
.pcol>h3{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--grey-600);display:flex;justify-content:space-between;margin:0 2px}
.pcol>h3 .cnt{color:var(--navy-700)}
.lead{background:#fff;border:1px solid var(--grey-200);border-radius:12px;padding:12px;font-size:12.5px;color:var(--grey-600)}
.lead b{display:block;font-size:13.5px;color:var(--navy-700)}
.lead .src{font-size:11.5px;color:var(--grey-600)}
.lead .meta{display:flex;gap:8px;align-items:center;margin-top:9px}
.lead .meta .val{font-weight:700;color:var(--navy-700);font-size:12px}
.lead .meta .adv{margin-left:auto;border:1px solid var(--grey-200);background:#fff;border-radius:8px;padding:4px 9px;font:600 11px var(--font-sans);color:var(--grey-600);cursor:pointer}
.lead .meta .adv:hover{border-color:var(--gold-500);color:var(--navy-700);background:var(--gold-50)}
.chan-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;font-size:11.5px;color:var(--grey-600);align-items:center}
@media (max-width:1060px){.pipe{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.pipe{grid-template-columns:1fr}}
.soc{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#fff;transition:transform 180ms var(--ease-out),box-shadow 180ms var(--ease-out)}
.soc:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.35)}
/* ==== Ascending ladder ==== */
.ladder{align-items:end;position:relative;gap:0}
.ladder::before{display:none}
.tier{z-index:1}
.tier+.tier{margin-left:-1px}
.tier{display:flex;flex-direction:column;min-height:var(--mh,auto);overflow:visible;border-radius:0}
.ladder .tier:first-child{border-top-left-radius:6px}
.ladder .tier:first-child .no{border-top-left-radius:6px}
.ladder .tier:last-child{border-bottom-right-radius:6px}
.tier .no{display:block;margin:-24px -24px 16px;padding:32px 12px 10px;border-radius:0;text-align:center;font-size:11px;font-weight:700;letter-spacing:.1em;white-space:nowrap}
.tier .tic{position:absolute;top:-25px;left:50%;transform:translateX(-50%);width:48px;height:48px;border-radius:50%;border:3px solid var(--navy-700);display:grid;place-items:center;box-shadow:var(--shadow-md);z-index:1}
.tier .pr{margin-top:auto;padding-top:14px}
.tier h3{margin-top:2px}
@media (max-width:720px){.tier{min-height:auto}.ladder{gap:14px}.tier+.tier{margin-left:0}}
.logo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 22px;align-items:center;justify-items:center;margin-top:8px}
.plogo{display:inline-flex;align-items:center;gap:12px;transition:transform 220ms var(--ease-out)}
.plogo:hover{transform:translateY(-3px)}
.plogo img{width:38px;height:38px;object-fit:contain;flex:none}
.plogo b{font-family:var(--font-display);font-weight:700;font-size:18px;color:var(--navy-700);letter-spacing:-.01em;white-space:nowrap}
.logo-grid .logo-word{font-size:19px;color:var(--grey-600)}
.logo-grid .logo-word.alt{font-weight:500;letter-spacing:.04em;color:var(--grey-700)}
.logo-grid .logo-word.caps{font-size:16px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--grey-700)}
@media (max-width:1060px){.logo-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:720px){.logo-grid{grid-template-columns:repeat(2,1fr);gap:20px 14px}}
/* Hero learner map */
.hero-map{position:absolute;right:clamp(-60px,-1vw,0px);top:50%;transform:translateY(-50%);width:min(54vw,800px);pointer-events:none;z-index:1}
.hm-svg{width:100%;height:auto;display:block}
.hpin{position:absolute;width:54px;height:54px;margin:-27px;border-radius:50%;border:3px solid var(--gold-500);overflow:hidden;background:var(--navy-600);pointer-events:auto;animation:hbob 6s var(--ease-standard) infinite;box-shadow:0 0 0 7px rgba(250,165,50,.13),var(--shadow-lg)}
.hpin image-slot{font-size:0}
@keyframes hbob{0%,100%{transform:translateY(0);box-shadow:0 0 0 7px rgba(250,165,50,.13),var(--shadow-lg)}50%{transform:translateY(-7px);box-shadow:0 0 0 13px rgba(250,165,50,.05),var(--shadow-lg)}}
@media (max-width:1060px){.hero-map{display:none}}
/* Learner-stories slider */
.t-marq .marq-track{gap:18px;align-items:stretch;animation-duration:75s}
.t-slide{width:min(360px,78vw);flex:none;box-sizing:border-box;white-space:normal}
/* Pal teaser bubble */
.pal-teaser{position:fixed;right:92px;bottom:90px;z-index:var(--z-overlay);background:#fff;color:var(--grey-800);border-radius:16px 16px 4px 16px;box-shadow:var(--shadow-xl);padding:13px 16px;font-size:13.5px;line-height:1.45;max-width:250px;opacity:0;transform:translateY(10px);transition:opacity 300ms var(--ease-out),transform 300ms var(--ease-out);cursor:pointer}
.pal-teaser.show{opacity:1;transform:none}
.pal-teaser{width:min(290px,calc(100vw - 120px));max-width:none;padding:14px 15px 12px}
.pt-head{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.pt-av{position:relative;width:38px;height:38px;flex:0 0 38px}
.pt-av img{width:38px;height:38px;border-radius:50%;object-fit:cover;display:block}
.pt-av .dot{position:absolute;right:0;bottom:0;width:11px;height:11px;border-radius:50%;background:#1f9d55;border:2px solid #fff}
.pt-id{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.pt-id b{font-family:var(--font-display);font-size:15px;color:var(--navy-800)}
.pt-id small{font-size:12px;color:var(--gold-800);font-weight:600}
.pal-teaser p.q{margin:0;box-sizing:border-box;min-height:81px;font-size:13.5px;line-height:1.5;color:var(--grey-700);background:var(--gold-50);border-radius:12px;padding:10px 12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pal-teaser .x{position:absolute;top:-9px;right:-9px;width:22px;height:22px;border-radius:50%;background:var(--navy-700);color:#fff;border:2px solid #fff;cursor:pointer;font:700 10px/1 var(--font-sans);padding:0}
@media (max-width:1060px){.pal-teaser{bottom:160px}}
@media (max-width:720px){.pal-teaser{right:14px;bottom:216px}}
.panel-map{width:100%}
.panel-map .hm-svg{width:100%;height:auto;display:block}
.course-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 300ms var(--ease-out)}
.course:hover .course-thumb img{transform:scale(1.04)}
.course-thumb .chip{z-index:2}
.pal-fab{border:2.5px solid var(--gold-500);padding:0}
/* Partnership track cards (folded-page look) */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 38px}
.pcard{position:relative;background:#fff;border:1px solid var(--grey-300);border-radius:18px;display:flex;flex-direction:column;z-index:1}
.pcard::after{content:"";position:absolute;top:14px;left:14px;right:-12px;bottom:-12px;background:#fff;border:1px solid var(--grey-300);border-radius:18px;z-index:-1}
.pcard .ph{padding:24px 26px;border-radius:17px 17px 0 0;font-family:var(--font-display);font-weight:700;font-size:clamp(1.15rem,1.7vw,1.45rem);line-height:1.25;text-wrap:balance}
.pcard .ph.gold{background:var(--gold-500);color:var(--navy-800)}
.pcard .ph.dark{background:#101028;color:#fff}
.pcard .ph.navy{background:var(--navy-600);color:#fff}
.pcard .pb{padding:20px 26px 26px;font-size:14px;color:var(--grey-700);display:grid;gap:12px;align-content:start;flex:1}
.pcard .pb a{font-weight:600;color:var(--gold-700);margin-top:auto}
@media (max-width:1060px){.pgrid{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.pgrid{grid-template-columns:1fr;gap:26px}}
.btn,.pill,.soc,.soc-big,.unlock,.fbtn,.hdr-logo,.hdr-nav a,.hdr-login,.mega a,.mega-col a,.mega-col .visit,.mega-tiers a,.school,.course a,.persona a,.comm,.plogo,.drawer a,.footer a,.crumb a,.legal a,.acc-head,.wa-chip,.linkbtn,a.card,.tst a,.person a,.st a,.tier a,.f-bottom a,.map-legend a{text-decoration:none}
.btn:hover,.pill:hover,.soc:hover,.soc-big:hover,.unlock:hover,.fbtn:hover,.hdr-logo:hover,.hdr-nav a:hover,.hdr-login:hover,.mega a:hover,.mega-col a:hover,.mega-col .visit:hover,.school:hover,.persona a:hover,.comm:hover,.plogo:hover,.drawer a:hover,.footer a:hover,.crumb a:hover,.wa-chip:hover,a.card:hover,.person a:hover{text-decoration:none}
.pal-badge{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;border-radius:11px;background:var(--danger-text);color:#fff;font:700 12px/22px var(--font-sans);text-align:center;padding:0 5px;border:2px solid #fff;box-shadow:0 2px 8px rgba(16,16,40,.3)}
.pal-badge.pop{animation:tickpop 300ms var(--ease-pop)}
.pal-teaser .q{transition:opacity 200ms}
.pal-teaser .tcount{display:block;margin-top:8px;text-align:right;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-800)}
.peek{pointer-events:none}
.persona a{position:relative;z-index:3}
.chips a.wa-chip,.wa-chip{display:inline-flex;align-items:center;gap:6px;background:var(--color-whatsapp-deep);color:#fff;font:600 12.5px var(--font-sans);padding:8px 14px;border-radius:var(--radius-pill);text-decoration:none}
.wa-chip:hover{background:#0f7437;color:#fff}
.school .simg{display:block;margin:-26px -26px 14px;height:110px;overflow:hidden}
.school .simg img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 300ms var(--ease-out)}
.school:hover .simg img{transform:scale(1.05)}
.peek ul{margin-top:6px;gap:3px}
.logo-mark{display:grid;place-items:center;height:38px;padding:0 6px}
.logo-mark img{max-height:34px;max-width:130px;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.72;transition:filter 200ms,opacity 200ms,transform 200ms}
.logo-mark:hover img{filter:none;opacity:1;transform:translateY(-2px)}
.logo-mark.fallback{font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--grey-600);letter-spacing:-.01em}
.cert-strip{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,48px);align-items:center;margin-top:clamp(34px,5vw,56px)}
.cert-copy h3{font-size:clamp(1.25rem,2.2vw,1.6rem);margin:12px 0 10px}
.cert-copy p{font-size:14.5px;color:var(--text-muted);margin-bottom:16px}
@media (max-width:1060px){.logo-grid{grid-template-columns:repeat(3,1fr)}.cert-strip{grid-template-columns:1fr}}
@media (max-width:720px){.logo-grid{grid-template-columns:repeat(2,1fr)}}
.post-input{display:flex;gap:8px;align-items:center}
.post-input input{flex:1;min-width:0;border:1.5px solid var(--grey-300);border-radius:var(--radius-pill);padding:11px 16px;font:500 14px var(--font-sans);color:var(--grey-900)}
.post-input input:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(250,165,50,.2)}
.post-input .pal-send{flex:none}
.pal-panel small,.pal-mock .ph small{color:var(--success-text)!important}
.tier .no{color:#fff}
.soc-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.soc-big{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:#fff;box-shadow:var(--shadow-md);transition:transform 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}
.soc-big:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.gmap{width:100%;height:200px;border:0;display:block;border-radius:12px;filter:saturate(.9)}
.gmap-lg{height:280px}
.comm-split{display:grid;grid-template-columns:1fr;justify-items:center;text-align:center;gap:8px;margin-top:clamp(34px,5vw,50px)}
.comm-split h3{font-size:clamp(1.3rem,2.3vw,1.7rem);margin-bottom:8px;text-align:center}
.comm-split p{font-size:14.5px;color:rgba(30,30,70,.75)}

.story-video{max-width:100%!important;margin:clamp(26px,4vw,38px) 0 0!important;aspect-ratio:16/9;border-radius:var(--radius-xl)}
.stepper-anim .st{will-change:transform}
html.js .stepper-anim .st.in{opacity:1;transition:transform 240ms var(--ease-out),box-shadow 240ms var(--ease-out);transition-delay:0ms}
.stepper-anim .st.in:hover,html:not(.js) .stepper-anim .st:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.stepper-anim .st::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--gold-500);transform:scaleX(0);transform-origin:left;transition:transform 320ms var(--ease-out)}
.stepper-anim .st:hover::after{transform:scaleX(1)}
.ins-marq .marq-track{gap:20px;align-items:stretch;animation-duration:80s}
.ins-slide{width:280px;flex:none;box-sizing:border-box;white-space:normal;padding:0;overflow:hidden}
.ins-slide .photo{height:240px}
.gpartners{padding-block:clamp(48px,6vw,74px)}
.gp-title{text-align:center;font-size:clamp(1.7rem,3.4vw,2.5rem);letter-spacing:var(--tracking-snug)}
.gp-title em{font-style:normal;color:inherit}
.gp-sub{text-align:center;font-size:14.5px;color:var(--grey-600);max-width:60ch;margin:10px auto clamp(26px,4vw,38px)}
.gp-marq .marq-track{gap:clamp(40px,6vw,80px);align-items:center;animation-duration:46s}
/* Every partner shares one fixed 52px mark row, so the name labels sit on a single
   baseline no matter how tall or wide the individual mark is. Marks size optically
   inside that row via max-height, never by setting height per logo. */
.gp{display:grid;grid-template-rows:52px auto;justify-items:center;align-items:center;gap:8px;flex:none;transition:transform 200ms var(--ease-out)}
.gp:hover{transform:translateY(-3px)}
.gp img{height:52px;width:auto;max-width:140px;object-fit:contain}
.gp b{font-family:var(--font-display);font-size:13px;font-weight:700;color:var(--grey-700);white-space:nowrap}
.gp-mark{width:52px;height:52px;border-radius:14px;background:var(--surface-brand-soft);color:var(--navy-700);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:16px;letter-spacing:.02em}
.ladder-anim .tier{opacity:0;transform:translateY(26px)}
.ladder-anim.in .tier{opacity:1;transform:none;transition:opacity 560ms var(--ease-out) var(--d,0ms),transform 560ms var(--ease-out) var(--d,0ms)}
html:not(.js) .ladder-anim .tier{opacity:1;transform:none}
.ladder-anim .tic{transition:transform 420ms var(--ease-pop) var(--d,0ms)}
.ladder-anim.in .tic{animation:tickpop 520ms var(--ease-pop) var(--d,0ms) both}
.ladder-anim .tier:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);transition:transform 260ms var(--ease-out),box-shadow 260ms var(--ease-out)}
@media (prefers-reduced-motion:reduce){.ladder-anim .tier{opacity:1;transform:none}}
.sect-head{margin-bottom:clamp(28px,4vw,44px)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* ---- Responsive ---- */
@media (max-width:1060px){.hdr-nav,.hdr-login,.hdr .hdr-logout{display:none}.hdr-cta{margin-left:auto}.burger{display:block;margin-left:0}.stats{grid-template-columns:repeat(2,1fr);row-gap:34px}.bento{grid-template-columns:repeat(2,1fr)}.school.lg{grid-row:auto;grid-column:span 2}.gold-grid,.ai-grid,.legit{grid-template-columns:1fr}.grid4{grid-template-columns:repeat(2,1fr)}.f-grid{grid-template-columns:1fr 1fr;row-gap:36px}.f-brand{grid-column:span 2}.t-rail{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.grid3,.bento,.steps,.ladder,.stepper,.grid4,.t-rail{grid-template-columns:1fr}.school.lg{grid-column:auto}.steps::before,.ladder::before{display:none}.hero h1,.hero h2.as-h1{font-size:clamp(2.55rem,11.5vw,3.2rem)}.hero .wrap{padding-top:56px}.trust .wrap{flex-direction:column;align-items:flex-start;gap:14px}.sticky-bar{display:flex}.pal-fab{bottom:84px;right:14px}.pal-panel{bottom:152px}.footer{padding-bottom:150px}.cd .cell{min-width:0;flex:1}.compare-scroll,.ptable-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.compare,.ptable{min-width:640px}.annc{font-size:12px;padding-right:36px}.f-grid{grid-template-columns:1fr}.f-brand{grid-column:auto}.hero-ctas .btn{width:100%}.quiz-bar{padding:18px}.legit{gap:28px}.cert{margin-inline:auto}}
/* ==== Course detail ==== */
.c-hero{background:var(--navy-800);margin-top:calc(-1*var(--hdr-h));padding:calc(var(--hdr-h) + 44px) 0 60px;position:relative;overflow:hidden}
.c-hero::after{content:"";position:absolute;inset:auto -10% -60% -10%;height:70%;background:radial-gradient(ellipse at center,rgba(250,165,50,.12),transparent 65%);pointer-events:none}
.crumb{display:flex;gap:8px;flex-wrap:wrap;font-size:13px;color:rgba(255,255,255,.5)}
.crumb a{color:rgba(255,255,255,.65)}
.crumb a:hover{color:#fff}
.c-hero h1{font-size:clamp(2rem,4.4vw,3.3rem);color:#fff;letter-spacing:var(--tracking-tight);margin:16px 0 10px;max-width:min(100%,42ch)}
.c-tag{color:rgba(255,255,255,.75);font-size:clamp(1rem,1.3vw,1.15rem);max-width:54ch}
.proof{display:flex;gap:20px;flex-wrap:wrap;margin-top:20px;font-size:13.5px;color:rgba(255,255,255,.75)}
.proof b{color:var(--gold-300)}
.proof span{display:inline-flex;gap:7px;align-items:center}
.byline{display:flex;gap:12px;align-items:center;margin-top:24px;font-size:14px;color:rgba(255,255,255,.8)}
.byline .av{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none}
.byline b{color:#fff}
.video-frame{position:relative;aspect-ratio:16/9;border-radius:var(--radius-xl);overflow:hidden;background:var(--navy-900);border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow-xl)}
.course-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(24px,3.5vw,48px);align-items:start}
.rail{position:sticky;top:90px;background:#fff;border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:24px}
.rprice b{font-size:30px;font-weight:700;color:var(--navy-700);letter-spacing:-.01em}
.rprice small{display:block;font-size:13px;color:var(--grey-600);margin-top:2px}
.fmt-toggle{display:flex;background:var(--grey-100);border-radius:var(--radius-pill);padding:4px;margin:18px 0 10px}
.fmt-toggle button{flex:1;border:0;background:none;font:600 13.5px var(--font-sans);padding:9px;border-radius:var(--radius-pill);cursor:pointer;color:var(--grey-600);transition:all 200ms var(--ease-out)}
.fmt-toggle button.on{background:#fff;color:var(--navy-700);box-shadow:var(--shadow-sm)}
.meta-row{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;color:var(--grey-600);padding:9px 0;border-bottom:1px solid var(--grey-100)}
.meta-row b{color:var(--navy-700)}
.mini-bar{height:6px;border-radius:4px;background:var(--grey-100);margin:8px 0 4px;overflow:hidden}
.mini-fill{height:100%;border-radius:4px;background:var(--gold-500)}
.rail .btn{width:100%;box-sizing:border-box;margin-top:12px}
.rail-micro{font-size:12px;color:var(--grey-600);text-align:center;margin-top:12px}
.learn{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;list-style:none;margin:0;padding:0}
.learn li{display:flex;gap:10px;font-size:14.5px;color:var(--grey-700);align-items:flex-start}
.learn i,.learn svg{color:var(--gold-600);flex:none;margin-top:3px}
.sect{padding:36px 0;border-top:1px solid var(--grey-200)}
.sect>h2{font-size:clamp(1.3rem,2.2vw,1.65rem);margin-bottom:18px}
.mod-meta{margin-left:auto;font-size:12px;color:var(--grey-600);font-weight:500;white-space:nowrap;padding-left:10px}
.forwho{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.forwho ul{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:9px;font-size:14px;color:var(--grey-700)}
.forwho li{display:flex;gap:10px;align-items:flex-start}
.forwho li i,.forwho li svg{flex:none;margin-top:2px}
.sticky-bar .sp{display:flex;flex-direction:column;justify-content:center;font-size:11.5px;color:rgba(255,255,255,.7);line-height:1.25;padding-right:4px}
.sticky-bar .sp b{font-size:15px;color:var(--gold-300)}
/* ==== Flows (register / checkout) ==== */
.flow-body{min-height:100vh;background:var(--surface-page);display:flex;flex-direction:column}
.flow-hd{display:flex;align-items:center;gap:16px;padding:14px clamp(16px,4vw,40px);background:var(--navy-800)}
.flow-hd .hdr-logo{font-size:18px}
.flow-legal{display:flex;justify-content:center;font-size:12px;margin:0 0 14px}
.flow-legal a{display:inline-flex;align-items:center;min-height:44px;padding-inline:10px;color:rgba(255,255,255,.72);font-weight:500}
.flow-legal a:hover{color:var(--gold-400)}
.flow-hd .back{color:rgba(255,255,255,.65);font-size:13.5px;display:inline-flex;gap:6px;align-items:center}
.flow-hd .back:hover{color:#fff}
.steps-ind{margin-left:auto;display:flex;gap:6px;align-items:center}
.sdot{width:26px;height:4px;border-radius:2px;background:rgba(255,255,255,.2);transition:background 300ms}
.sdot.on{background:var(--gold-500)}
.flow-main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:clamp(20px,4vw,48px) 16px 64px}
.fstep{display:none;width:100%;max-width:560px}
.fstep.on{display:block;animation:stepin 300ms var(--ease-out)}
@keyframes stepin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.fcard{background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:clamp(22px,4.5vw,36px)}
.fcard h1,.fcard h2.as-h1{font-size:clamp(1.35rem,3vw,1.75rem);margin-bottom:6px}
.fsub{font-size:14px;color:var(--text-muted);margin-bottom:22px}
.bc-pick{display:grid;gap:10px;margin-bottom:20px}
.bc-opt{display:flex;gap:14px;align-items:center;border:1.5px solid var(--grey-200);border-radius:var(--radius-md);padding:13px 16px;cursor:pointer;background:#fff;text-align:left;font-family:var(--font-sans);transition:border-color 200ms,background 200ms}
.bc-opt:hover{border-color:var(--navy-300)}
.bc-opt.on{border-color:var(--gold-500);background:var(--gold-50)}
.bc-opt .ic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;flex:none}
.bc-opt b{font-size:14.5px;color:var(--navy-700);display:block}
.bc-opt small{font-size:12px;color:var(--grey-600)}
.bc-opt .tick{margin-left:auto;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--grey-300);display:grid;place-items:center;color:transparent;flex:none;transition:all 200ms var(--ease-pop)}
.bc-opt.on .tick{background:var(--gold-500);border-color:var(--gold-500);color:var(--navy-800)}
.field{position:relative;margin-bottom:14px}
.field input{width:100%;box-sizing:border-box;font:500 16px var(--font-sans);padding:24px 16px 9px;border:1.5px solid var(--grey-300);border-radius:12px;background:#fff;color:var(--grey-900);transition:border-color 200ms,box-shadow 200ms}
.field input:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(250,165,50,.2)}
.field label{position:absolute;left:16px;top:17px;font-size:15px;color:var(--grey-600);pointer-events:none;transition:all 180ms var(--ease-out)}
.field select{width:100%;box-sizing:border-box;appearance:none;-webkit-appearance:none;font:500 16px var(--font-sans);padding:24px 44px 9px 16px;min-height:60px;border:1.5px solid var(--grey-300);border-radius:12px;background-color:#fff;color:var(--grey-900);cursor:pointer;transition:border-color 160ms var(--ease-out),box-shadow 160ms var(--ease-out);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%233a3a3e' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center}
.field select{text-overflow:ellipsis}
.field select:hover{border-color:var(--gold-500)}
.field select:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(250,165,50,.2)}
.field select~label{top:7px;font-size:11px;font-weight:600;color:var(--gold-800);letter-spacing:.04em;text-transform:uppercase}
.field select.bad{border-color:var(--danger-500)}
.field input:focus~label,.field input:not(:placeholder-shown)~label,.field textarea:focus~label,.field textarea:not(:placeholder-shown)~label{top:7px;font-size:11px;font-weight:600;color:var(--gold-800);letter-spacing:.04em;text-transform:uppercase}
.phone{display:flex;gap:8px}
.phone .cc{display:flex;align-items:center;gap:7px;border:1.5px solid var(--grey-300);border-radius:12px;padding:0 12px;font:600 15px var(--font-sans);color:var(--navy-700);background:var(--grey-50);white-space:nowrap}
.phone .field{flex:1;margin-bottom:0}
.otp{display:flex;gap:8px;justify-content:center;margin:20px 0 4px}
.otp input{width:46px;height:58px;text-align:center;font:700 24px var(--font-sans);background:#fff;border:1.5px solid var(--grey-300);border-radius:12px;color:var(--navy-700);padding:0;transition:border-color 200ms,box-shadow 200ms}
.otp input:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(250,165,50,.25)}
.otp input.pop{animation:cellpop 220ms var(--ease-pop)}
@keyframes cellpop{0%{transform:scale(1)}45%{transform:scale(1.07)}100%{transform:scale(1)}}
.otp.ok input{border-color:var(--gold-500);background:var(--gold-50);animation:okflash 500ms var(--ease-out)}
@keyframes okflash{0%{background:#fff}40%{background:var(--gold-200)}100%{background:var(--gold-50)}}
.otp.err{animation:shake 360ms var(--ease-standard)}
.otp.err input{border-color:var(--danger-500)}
@keyframes shake{0%,100%{transform:none}20%{transform:translateX(-6px)}45%{transform:translateX(6px)}70%{transform:translateX(-4px)}85%{transform:translateX(3px)}}
.otp-msg{text-align:center;font-size:13px;min-height:20px;margin-top:8px;color:var(--grey-600)}
.otp-msg.bad{color:var(--danger-600);font-weight:600}
.otp-msg.good{color:var(--success-600);font-weight:600}
.resend{display:flex;justify-content:center;gap:18px;font-size:13px;color:var(--grey-600);margin-top:12px;flex-wrap:wrap}
.linkbtn{background:none;border:0;font:600 13px var(--font-sans);color:var(--navy-700);cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}
.linkbtn:disabled{color:var(--grey-600);text-decoration:none;cursor:default}
.demo-states{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:20px;padding-top:14px;border-top:1px dashed var(--grey-200)}
.demo-states span{font-size:11px;color:var(--grey-600);width:100%;text-align:center;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.demo-states button{font:600 12px var(--font-sans);border:1px solid var(--grey-200);background:var(--grey-50);border-radius:var(--radius-pill);padding:6px 12px;cursor:pointer;color:var(--grey-600);transition:all 150ms}
.demo-states button:hover{border-color:var(--navy-300);color:var(--navy-700)}
.success-ic{width:74px;height:74px;border-radius:50%;background:var(--gold-500);display:grid;place-items:center;color:var(--navy-800);margin:0 auto 18px;box-shadow:var(--shadow-accent);position:relative}
.burst i,.burst svg{position:absolute;left:50%;top:50%;width:8px;height:8px;border-radius:2px;background:var(--gold-500);opacity:0;animation:burst 900ms var(--ease-out) forwards}
@keyframes burst{0%{transform:translate(0,0) rotate(0);opacity:1}100%{transform:translate(var(--tx),var(--ty)) rotate(220deg);opacity:0}}
.unlock-list{list-style:none;padding:0;margin:18px 0 22px;display:grid;gap:10px;text-align:left}
.unlock-list li{display:flex;gap:10px;font-size:14px;color:var(--grey-700);align-items:flex-start}
.unlock-list i,.unlock-list svg{color:var(--gold-600);flex:none;margin-top:2px}
.ptabs{display:flex;gap:8px;margin-bottom:16px}
.ptabs button{flex:1;border:1.5px solid var(--grey-200);background:#fff;border-radius:12px;padding:12px 8px;font:600 12.5px var(--font-sans);color:var(--grey-600);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;transition:all 200ms}
.ptabs button.on{border-color:var(--navy-700);background:var(--surface-brand-soft);color:var(--navy-700)}
.ppane{display:none}
.ppane.on{display:block;animation:stepin 250ms var(--ease-out)}
.usdt{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.usdt .qr{width:118px;height:118px;background-size:11px 11px;flex:none}
.addr{display:flex;gap:10px;align-items:center;background:var(--grey-50);border:1px solid var(--grey-200);border-radius:10px;padding:10px 12px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:12px;color:var(--grey-700);word-break:break-all}
.ratelock .bar{height:5px;border-radius:3px;background:var(--grey-200);overflow:hidden;margin-top:6px}
.ratelock .fill{height:100%;background:var(--gold-500);width:100%;transition:width 1s linear}
.ratelock p{font-size:12px;color:var(--grey-600);margin-top:6px}
.order{border:1px solid var(--grey-200);border-radius:var(--radius-md);padding:16px;margin-bottom:18px}
.order .row{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;padding:5px 0;color:var(--grey-600)}
.order .row b{color:var(--navy-700);text-align:right}
.order .tot{border-top:1px solid var(--grey-200);margin-top:8px;padding-top:10px;font-size:15px}
.order .tot b{font-size:17px}
.trust-row{display:flex;gap:16px;align-items:center;font-size:12px;color:var(--grey-600);margin-top:16px;flex-wrap:wrap}
.trust-row span{display:inline-flex;gap:6px;align-items:center}
.alertbar{display:none;background:var(--danger-soft);color:var(--danger-text);border:1px solid #f3c1bd;border-radius:12px;padding:12px 14px;font-size:13.5px;margin-bottom:16px}
.alertbar.show{display:flex;gap:10px;align-items:flex-start}
.rcpt-ref{font-family:ui-monospace,monospace;font-size:12px;color:var(--grey-600)}
/* ==== School template + catalog ==== */
.s-hero{background:var(--navy-800);margin-top:calc(-1*var(--hdr-h));padding:calc(var(--hdr-h) + 56px) 0 70px;position:relative;overflow:hidden}
.s-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 55%,var(--sc) 160%);opacity:.35;pointer-events:none}
.s-kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:8px 16px;border-radius:var(--radius-pill)}
.s-kicker .d{width:9px;height:9px;border-radius:3px;background:var(--sc)}
.s-hero h1{font-size:clamp(2.3rem,5vw,3.9rem);color:#fff;letter-spacing:var(--tracking-tight);margin:20px 0 14px;max-width:min(100%,46ch)}
.s-hero h1 em{font-style:normal;color:var(--sc-bright,var(--gold-400))}
.outcome-band{background:var(--navy-900);padding:26px 0}
.outcome-band .wrap{display:flex;gap:14px 28px;flex-wrap:wrap;align-items:center}
.outcome-band b{color:#fff;font-size:14px;letter-spacing:.04em;text-transform:uppercase}
.outcome-band span{display:inline-flex;gap:8px;align-items:center;font-size:13.5px;color:rgba(255,255,255,.75)}
.outcome-band i,.outcome-band svg{color:var(--sc-bright,var(--gold-400))}
.acc-switch{display:flex;gap:6px;align-items:center;background:rgba(16,16,40,.85);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-pill);padding:6px 10px;position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:var(--z-overlay)}
.acc-switch span{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5);padding-right:4px}
.acc-switch button{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.acc-switch button.on{border-color:#fff}
.cat-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:26px 0 8px}
.cat-bar .count{margin-left:auto;font-size:13px;color:var(--text-subtle)}
.empty{display:none;text-align:center;padding:60px 20px;color:var(--text-muted)}
.empty.show{display:block}
.empty .pal-ava{margin:0 auto 14px;width:52px;height:52px}
/* ==== Pricing / outcomes / campuses / 404 ==== */
.tiers-big{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,22px)}
.tier-card{background:#fff;border:var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:26px;display:flex;flex-direction:column;gap:8px;position:relative}
.tier-card.free{border:2px solid var(--gold-500);box-shadow:var(--shadow-accent)}
.tier-card .no{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--gold-700)}
.tier-card h3{font-size:19px}
.tier-card .pr{font-size:20px;font-weight:700;color:var(--navy-700)}
.tier-card ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px;font-size:13.5px;color:var(--grey-700)}
.tier-card li{display:flex;gap:9px;align-items:flex-start}
.tier-card li i,.tier-card li svg{color:var(--gold-600);flex:none;margin-top:2px}
.tier-card .btn{margin-top:auto}
.calc{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(20px,3vw,40px);align-items:center;background:var(--navy-700);border-radius:var(--radius-xl);padding:clamp(24px,4vw,44px)}
.calc h3{color:#fff;font-size:clamp(1.3rem,2.4vw,1.7rem)}
.calc label,.calc .lbl-static{display:block;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55);margin:18px 0 8px}
.calc select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:var(--navy-800);color:#fff;font:500 15px var(--font-sans)}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.seg button{border:1.5px solid rgba(255,255,255,.25);background:transparent;color:rgba(255,255,255,.8);font:600 14px var(--font-sans);padding:10px 18px;border-radius:var(--radius-pill);cursor:pointer;transition:all 200ms}
.seg button.on{background:var(--gold-500);border-color:var(--gold-500);color:var(--navy-800)}
.calc-out{background:var(--navy-800);border-radius:var(--radius-lg);padding:26px;text-align:center}
.calc-out .m{font-size:clamp(2rem,4vw,2.9rem);font-weight:700;color:var(--gold-400);font-variant-numeric:tabular-nums}
.calc-out .m small{font-size:15px;color:rgba(255,255,255,.6);font-weight:500}
.calc-out p{font-size:13px;color:rgba(255,255,255,.6);margin-top:8px}
.db{display:grid;gap:18px}
.db-row{display:grid;grid-template-columns:170px 1fr;gap:16px;align-items:center}
.db-row .lbl b{display:block;font-size:14.5px;color:var(--navy-700)}
.db-row .lbl small{font-size:12px;color:var(--grey-600)}
.db-track{position:relative;height:34px}
.db-track .line{position:absolute;top:50%;left:0;right:0;height:6px;transform:translateY(-50%);background:var(--grey-100);border-radius:4px}
.db-track .rng{position:absolute;top:50%;height:6px;transform:translateY(-50%) scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--navy-300),var(--gold-500));border-radius:4px;transition:transform 1000ms var(--ease-out) 200ms}
.in .db-track .rng,html:not(.js) .db-track .rng{transform:translateY(-50%)}
.db-track .pt{position:absolute;top:50%;transform:translate(-50%,-50%);width:13px;height:13px;border-radius:50%;background:var(--navy-400);border:2.5px solid #fff;box-shadow:var(--shadow-sm)}
.db-track .pt.hi{background:var(--gold-500)}
.db-track .val{position:absolute;top:-6px;transform:translateX(-50%);font-size:11.5px;font-weight:700;color:var(--navy-700);white-space:nowrap}
.db-track .val.lo{color:var(--grey-600);font-weight:500;top:auto;bottom:-8px}
.method{border-left:3px solid var(--gold-500);background:var(--gold-50);border-radius:0 14px 14px 0;padding:18px 22px;font-size:14px;color:var(--grey-700)}
.camp-big{display:grid;grid-template-columns:1.05fr .95fr;gap:0;overflow:hidden;padding:0}
.camp-big .photo{height:340px}
.camp-big .photo>image-slot,.campus .photo>image-slot{display:block;width:100%;height:100%}
.camp-big .cb{padding:clamp(24px,3.5vw,40px)}
.camp-big .meta{display:grid;gap:12px;margin:18px 0 22px}
.camp-big .meta span{display:flex;gap:10px;font-size:14px;color:var(--grey-700);align-items:flex-start}
.camp-big .meta i,.camp-big .meta svg{color:var(--gold-600);flex:none;margin-top:2px}
.visit-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;align-items:end}
.visit-form .field{margin:0}
.g404{min-height:100vh;background:var(--navy-800);display:grid;place-items:center;text-align:center;padding:24px}
.g404 .code{font-size:clamp(6rem,22vw,13rem);font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:2px rgba(250,165,50,.5);letter-spacing:-.03em}
.g404 h1{color:#fff;font-size:clamp(1.5rem,3.5vw,2.2rem);margin:10px 0 8px}
.g404 p{color:rgba(255,255,255,.7);max-width:44ch;margin:0 auto 26px}
@media (max-width:1060px){.calc,.camp-big{grid-template-columns:1fr}.tiers-big{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.tiers-big{grid-template-columns:1fr}.db-row{grid-template-columns:1fr;gap:6px}}
@media (max-width:1060px){.course-layout{grid-template-columns:minmax(0,1fr)}.rail{position:static}}
@media (max-width:720px){.learn,.forwho{grid-template-columns:1fr}.rail{display:none}.otp input{width:40px;height:52px;font-size:20px}.c-hero{padding-top:calc(var(--hdr-h) + 24px)}}
@media (max-width:400px){.wrap{padding-inline:16px}.cd b{font-size:24px}}

.gp img.wl,.plogo img.wl{width:auto;object-fit:contain}
.gp img.wl{height:52px;width:auto;max-width:140px}
.plogo img.wl{height:38px}

.f-brand{grid-row:span 2}
.f-brand>p{font-size:13.5px;line-height:1.65;color:rgba(255,255,255,.62);margin:14px 0 18px;max-width:38ch}
.f-soc{display:flex;gap:8px;flex-wrap:wrap}
.f-brand h5{margin-top:26px}
.f-accr{display:flex;flex-direction:column;gap:12px;margin-top:14px}
.f-brand .f-addr{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px;padding-top:0;border-top:0}
@media(min-width:900px){.f-brand .f-addr{grid-template-columns:1fr 1fr;gap:18px 24px}}
.accr{display:flex;gap:11px;align-items:flex-start}
.accr-seal{flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:rgba(250,165,50,.12);border:1px solid rgba(250,165,50,.34);display:grid;place-items:center}
.accr p{font-size:12.5px;line-height:1.55;color:rgba(255,255,255,.6);margin:0}
.accr p b{color:rgba(255,255,255,.9);font-weight:600}
.accr p a{color:var(--gold-400)}
.f-contact ul a{display:flex;gap:8px;align-items:center}
.f-addr p{font-size:13px;line-height:1.6;color:rgba(255,255,255,.62);margin:0}
.f-addr p b{display:flex;gap:7px;align-items:center;color:#fff;font-size:13px;font-weight:600;margin-bottom:6px}
.f-addr p a{color:var(--gold-400)}
@media(max-width:1180px){.f-grid{grid-template-columns:1.4fr repeat(2,1fr)}.f-brand{grid-row:span 2}.f-addr{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.f-grid{grid-template-columns:1fr 1fr}.f-brand{grid-column:1/-1;grid-row:auto}.f-addr{grid-template-columns:1fr}}

/* ---- Crypto payment pane ---- */
.cryp-sel{display:grid;grid-template-columns:1fr 1.35fr;gap:12px;margin-bottom:15px}
.cryp-sel label{font-size:12px;font-weight:600;color:var(--grey-600)}
.cryp-sel select{display:block;width:100%;margin-top:6px;min-height:52px;font-size:16px;padding:14px 36px 14px 13px;border:1.5px solid var(--grey-300);border-radius:10px;font:600 16px var(--font-sans);color:var(--navy-700);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233a3a3e' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 11px center;appearance:none;cursor:pointer;transition:border-color 160ms var(--ease-out)}
.cryp-sel select:hover{border-color:var(--gold-400)}
.cryp-body #copy-addr{min-height:44px;min-width:56px;padding:0 12px;display:grid;place-items:center;border-radius:8px}
.cryp-body #copy-addr:hover{background:var(--gold-50)}
.cryp-sel select:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px var(--gold-100)}
.cryp-body{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.cqr{width:136px;height:136px;flex:none;background:#fff;border:1px solid var(--grey-200);border-radius:12px;padding:8px;display:grid;place-items:center}
.cqr svg{width:100%;height:100%;display:block}
.cqr p{font-size:11px;color:var(--grey-600);text-align:center;padding:8px}
.cryp-side{flex:1;min-width:236px}
.cryp-send{font-size:13.5px;color:var(--grey-700);margin-bottom:8px}
.cryp-send b{font-size:17px;color:var(--navy-800);font-family:ui-monospace,SFMono-Regular,monospace}
.cryp-fee{font-size:12px;color:var(--grey-600);margin-top:8px}
.cryp-warn{display:flex;gap:8px;align-items:flex-start;margin-top:15px;font-size:12px;line-height:1.55;color:var(--gold-900);background:var(--gold-50);border:1px solid var(--gold-200);border-radius:10px;padding:10px 12px}
.cryp-warn i,.cryp-warn svg{color:var(--gold-800)}
@media(max-width:560px){.cryp-sel{grid-template-columns:1fr}.cqr{width:118px;height:118px}}

/* ==== Flow pages: TecPal brand treatment ==== */
.flow-body{color-scheme:light;position:relative;background-color:#0e0e24;background-image:radial-gradient(rgba(250,165,50,.12) 1.3px,transparent 1.4px),repeating-linear-gradient(135deg,rgba(250,165,50,.045) 0 2px,transparent 2px 28px),repeating-linear-gradient(45deg,rgba(250,165,50,.045) 0 2px,transparent 2px 28px),radial-gradient(1100px 620px at 50% -8%,rgba(64,64,140,.5) 0%,transparent 64%),linear-gradient(180deg,#16162f 0%,#0d0d22 100%);background-size:17px 17px,auto,auto,100% 100%,100% 100%}
.flow-hd{background:rgba(12,12,32,.72);backdrop-filter:blur(10px);border-bottom:1px solid rgba(250,165,50,.26)}
.flow-body .fcard{position:relative;border:1px solid rgba(255,255,255,.55);border-top:4px solid var(--gold-500);box-shadow:0 28px 70px rgba(6,6,22,.5)}

.flow-body .order{background:linear-gradient(158deg,#1d1d44 0%,#101028 100%);border:1px solid rgba(250,165,50,.24);border-radius:16px;padding:18px 18px 16px;position:relative;overflow:hidden}
.flow-body .order::after{content:"";position:absolute;inset:0;background:url("../assets/pattern/chevron-tile-gold.svg");background-size:46px;opacity:.05;pointer-events:none}
.flow-body .order>*{position:relative;z-index:1}
.flow-body .order .row{color:rgba(255,255,255,.68)}
.flow-body .order .row b{color:#fff}
.flow-body .order .tot{border-top:1px solid rgba(255,255,255,.16);margin-top:10px;padding-top:12px}
.flow-body .order .tot span{color:rgba(255,255,255,.82);font-weight:600}
.flow-body .order .tot b{color:var(--gold-400);font-size:21px;letter-spacing:-.01em}
.flow-body .order #promo-row b,.flow-body .order .promo-line b{color:var(--gold-300)}
.flow-body .ptabs button.on{background:var(--navy-800);border-color:var(--navy-800);color:#fff}
.flow-body .ptabs button.on i,.flow-body .ptabs button.on svg{color:var(--gold-400)}
.flow-body .bc-opt.on{border-color:var(--gold-500);background:var(--gold-50);box-shadow:0 0 0 3px rgba(250,165,50,.18)}
.flow-ft{padding:0 16px 40px;text-align:center;display:grid;gap:5px}
.flow-ft p{font-size:12px;color:rgba(255,255,255,.55);margin:0}
.flow-ft p b{color:rgba(255,255,255,.78);font-weight:600}
.flow-ft .fseal{display:inline-flex;gap:8px;align-items:center;justify-content:center;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-400);font-weight:700;margin-bottom:4px}
@media(max-width:640px){.flow-body .order .tot b{font-size:19px}}

.flow-body .fcard>h3{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--gold-800);font-weight:700;display:flex;align-items:center;gap:10px}
.flow-body .fcard>h3::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--gold-200),transparent)}

.af-wrap{position:relative;width:100%;aspect-ratio:760/780;max-width:680px;margin:0 auto}
.af-img{width:100%;height:100%;display:block}
.afp{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:var(--navy-800);box-shadow:0 0 0 3px rgba(30,30,70,.13)}
.afp.camp{width:17px;height:17px;margin:-8.5px 0 0 -8.5px;background:#fff;border:3px solid var(--navy-800);animation:afpulse 2.8s var(--ease-out) infinite}
@keyframes afpulse{0%{box-shadow:0 0 0 0 rgba(30,30,70,.45)}70%{box-shadow:0 0 0 15px rgba(30,30,70,0)}100%{box-shadow:0 0 0 0 rgba(30,30,70,0)}}
.map-legend .d.gold{background:#fff;border:2.5px solid var(--navy-800);box-sizing:border-box}
@media(prefers-reduced-motion:reduce){.afp.camp{animation:none}}

.af-wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;stroke:var(--navy-800);stroke-width:2;stroke-linecap:round;stroke-dasharray:5 7;opacity:.5;animation:dash 3.4s linear infinite}
.afa{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:2.5px solid var(--navy-800);overflow:hidden;background:var(--navy-700);box-shadow:0 4px 12px rgba(24,24,56,.28);animation:afbob 6.5s var(--ease-out) infinite;animation-delay:var(--bd,0s)}
.afa img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes afbob{0%,88%,100%{transform:translateY(0)}94%{transform:translateY(-4px)}}
@media(max-width:720px){.afa{width:32px;height:32px;margin:-16px 0 0 -16px;border-width:2px}}
@media(prefers-reduced-motion:reduce){.afa{animation:none}.af-wires{animation:none}}

/* Newsletter */
.nl{margin-top:clamp(30px,4vw,44px);margin-inline:auto;width:min(720px,100%);background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:clamp(24px,3.4vw,38px);text-align:center}
.nl h4{font-family:var(--font-display);font-size:clamp(1.25rem,2.2vw,1.6rem);color:var(--navy-800);margin:0 0 8px}
.nl .nl-sub{font-size:14.5px;color:var(--grey-700);max-width:56ch;margin:0 auto 20px;line-height:1.62}
.nl-form{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.nl-form input{flex:1 1 260px;min-height:52px;font-size:16px;font-family:var(--font-sans);color:var(--text-body);padding:0 16px;border:1.5px solid var(--grey-300);border-radius:var(--radius-md);background:#fff}
.nl-form input:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px var(--gold-100)}
.nl-form input.bad{border-color:var(--danger-500);box-shadow:0 0 0 3px var(--danger-soft)}
.nl-form .btn{min-height:52px;flex:0 0 auto}
.nl-tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.nl-tag{font:600 12.5px var(--font-sans);color:var(--grey-700);background:var(--grey-50);border:1px solid var(--grey-200);border-radius:var(--radius-pill);padding:7px 13px;cursor:pointer;transition:all 160ms var(--ease-out)}
.nl-tag:hover{border-color:var(--gold-400);color:var(--navy-800)}
.nl-tag.on{background:var(--navy-800);border-color:var(--navy-800);color:#fff}
.nl-fine{font-size:12.5px;color:var(--grey-600);margin-top:16px}
.nl-fine a{color:var(--gold-800);font-weight:600}
.nl-done{margin-top:16px;font-size:14.5px;font-weight:600;color:var(--success-text);background:var(--success-soft);border-radius:var(--radius-md);padding:14px 16px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Exit-intent capture */
.xi-scrim{position:fixed;inset:0;background:rgba(12,12,30,.62);backdrop-filter:blur(3px);z-index:1200;opacity:0;pointer-events:none;transition:opacity 240ms var(--ease-out)}
.xi-scrim.on{opacity:1;pointer-events:auto}
.xi{position:fixed;left:50%;top:50%;transform:translate(-50%,-46%) scale(.96);width:min(640px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:var(--radius-xl);box-shadow:0 30px 80px rgba(10,10,30,.4);z-index:1201;opacity:0;pointer-events:none;transition:opacity 240ms var(--ease-out),transform 280ms var(--ease-out)}
.xi.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.xi-top{background:var(--navy-800);color:#fff;padding:26px clamp(22px,3.2vw,34px) 24px;position:relative;overflow:hidden}
.xi-top .wm{position:absolute;right:-30px;bottom:-40px;width:190px;opacity:.09;pointer-events:none}
.xi-eyebrow{display:inline-flex;align-items:center;gap:7px;font:700 11.5px var(--font-sans);letter-spacing:.09em;text-transform:uppercase;color:var(--gold-400);margin-bottom:10px}
.xi-top h3{font-family:var(--font-display);font-size:clamp(1.35rem,2.6vw,1.85rem);color:#fff;margin:0 0 8px;line-height:1.2}
.xi-top p{font-size:14.5px;color:rgba(255,255,255,.78);margin:0;max-width:46ch;line-height:1.6}
.xi-body{padding:clamp(20px,3vw,28px) clamp(22px,3.2vw,34px) clamp(24px,3.2vw,30px)}
.xi-list{display:grid;gap:10px;margin:0 0 20px;padding:0;list-style:none}
.xi-list li{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--grey-700);line-height:1.55}
.xi-list svg,.xi-list i{flex:0 0 auto;color:var(--gold-700);margin-top:2px}
.xi-form{display:flex;gap:10px;flex-wrap:wrap}
.xi-form input{flex:1 1 240px;min-height:52px;font-size:16px;font-family:var(--font-sans);padding:0 15px;border:1.5px solid var(--grey-300);border-radius:var(--radius-md)}
.xi-form input:focus{outline:none;border-color:var(--gold-500);box-shadow:0 0 0 3px var(--gold-100)}
.xi-form input.bad{border-color:var(--danger-500);box-shadow:0 0 0 3px var(--danger-soft)}
.xi-form .btn{min-height:52px;flex:0 0 auto}
.xi-alt{display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-top:18px;padding-top:16px;border-top:1px solid var(--grey-200)}
.xi-alt a{text-decoration:underline;text-underline-offset:3px;font-size:13.5px;font-weight:600;color:var(--gold-800)}
.xi-dismiss{font:600 13.5px var(--font-sans);color:var(--grey-600);background:none;border:0;cursor:pointer;padding:6px 2px}
.xi-dismiss:hover{color:var(--navy-800);text-decoration:underline}
.xi-x{position:absolute;top:12px;right:12px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.14);border:0;color:#fff;cursor:pointer;z-index:2}
.xi-x:hover{background:rgba(255,255,255,.26)}
.xi-ok{text-align:center;padding:8px 0 4px}
.xi-ok .tick{width:56px;height:56px;border-radius:50%;background:var(--success-soft);color:var(--success-text);display:grid;place-items:center;margin:0 auto 14px}
.xi-ok h4{font-family:var(--font-display);font-size:1.3rem;color:var(--navy-800);margin:0 0 8px}
.xi-ok p{font-size:14.5px;color:var(--grey-700);margin:0 0 18px}
@media(prefers-reduced-motion:reduce){.xi,.xi-scrim{transition:none}}
@media(max-width:600px){.xi{width:calc(100vw - 20px)}.xi-alt{flex-direction:column;align-items:stretch}}

.ans-toc{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}
.ans-toc a{font:600 13px var(--font-sans);color:rgba(255,255,255,.86);background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:0 14px;min-height:40px;display:inline-flex;align-items:center}
.ans-toc a:hover{background:var(--gold-500);color:var(--navy-800);border-color:var(--gold-500)}

.cont-card{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--success-soft);border:1px solid var(--success-text);border-radius:var(--radius-lg);padding:14px 16px;margin-bottom:16px}
.cont-card b{display:block;font-size:14.5px;color:var(--navy-800)}
.cont-card small{font-size:12.5px;color:var(--grey-700)}
.cont-acts{display:flex;gap:8px;flex-wrap:wrap}

/* touch targets: control-shaped affordances reach 48px on touch/narrow screens.
   Plain selectors (not :where) so they outrank the component rules that set 40px. */
@media (hover:none),(max-width:720px){
.tact,.verify,.demo-note button,
.btn,.btn-sm,.btn.btn-sm,.pill,.ans-toc a,.nl-tag,.fbtn,.chip-f,.filters button,.acc-head,.linkbtn,.unlock,.soc,.soc-big,.wa-chip,.hdr-logo,.comm,.plogo,.mega-col a,.mega-tiers a,.drawer a,.flow-hd a,.back,.vf-try button,.vf-form button,.pal-mock button,.pal-demo button,.chips button,#pd-live,.pal-send,.role-tabs button,.ob-tracks button,.annc-x,.crumb a,.tabbtn,.acc .tagline{min-height:48px}
.btn-sm,.btn.btn-sm,.pill,.ans-toc a,.nl-tag,.chip-f,.unlock,.wa-chip{padding-block:12px}
.soc,.soc-big,.pal-send,.annc-x,.fbtn{min-width:48px}
/* A switch is 42x24 by design, so stretching the track to 48px turns it into a pill.
   The hit area is expanded invisibly instead, covering toggles authored either way. */
.tgl::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:48px}
.footer ul a,.f-bottom a{display:inline-flex;align-items:center;min-height:44px}
/* keyed on shape, not on a hand-listed set: any link acting as a card-level control */
.card>a,.persona>a,.persona a,.measure a,.stat>a,.kpi>a,.cd>a,.tier>a{min-height:48px;align-items:center}
/* teaser must not touch the bubble it points at */
.pal-teaser{bottom:226px}
.pal-teaser .x{width:26px;height:26px;top:-11px;right:-11px}
.pal-teaser .x::after{content:"";position:absolute;inset:-11px}
}

.vat-note{font-size:12.5px;color:var(--grey-600);margin:12px 0 0}
.on-dark .vat-note,.band--navy .vat-note{color:rgba(255,255,255,.62)}

.hdr-logout{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.hdr-cta .hdr-logout{align-self:center}
.hdr-logout svg{width:15px;height:15px;flex:none}
.hdr-logout:hover{color:var(--gold-300);border-color:var(--gold-400)}
.drawer .hdr-logout{align-self:flex-start;margin-top:6px}

/* ---- Hero slider ---- */
.hero{grid-template-rows:1fr;position:relative}
.hero-slider{position:relative;overflow:hidden;display:grid;min-width:0;grid-row:1;grid-column:1}
.hero-track{display:grid;height:100%}
.hero-slide{grid-area:1/1;min-width:0;position:relative;display:grid;opacity:0;transition:opacity 700ms var(--ease-out);pointer-events:none}
.hero-slide.on{opacity:1;pointer-events:auto}
.hero-slide>.wrap{opacity:0;transform:translateX(34px);transition:opacity 420ms var(--ease-out),transform 420ms var(--ease-out)}
.hero-slide.on>.wrap{opacity:1;transform:none;transition:opacity 480ms var(--ease-out) 220ms,transform 480ms var(--ease-out) 220ms}
@media (prefers-reduced-motion:reduce){.hero-slide,.hero-slide>.wrap{transition:none}}
.hero-slide>.wrap{padding-bottom:calc(var(--hero-foot-h,140px) + 18px)}
.hero-slide .badge-ai{margin-top:auto}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6}
.hero-foot{position:absolute;left:0;right:0;bottom:0;z-index:2}
.hero-foot::before{content:"";position:absolute;left:0;right:0;bottom:0;top:-40px;background:linear-gradient(to top,rgba(24,24,58,.92),rgba(24,24,58,.78) 42%,rgba(24,24,58,0));pointer-events:none;z-index:-1}
.hero-foot .wrap{padding-block:0 30px}
.hero-foot .hero-pills{margin-top:0;padding-top:0}
.hero-dots{display:flex;gap:6px;margin-top:18px;margin-left:-5px}
.hero-dot{background:transparent;border:0;padding:16px 5px;cursor:pointer;min-height:44px}
.hero-dot span{display:block;width:26px;height:4px;border-radius:2px;background:rgba(255,255,255,.28);transition:background 200ms,width 200ms var(--ease-out)}
.hero-dot.on span{background:var(--gold-500);width:40px}
.hero-dot:focus-visible{outline:2px solid var(--gold-400);outline-offset:2px;border-radius:6px}


/* ---- Mobile optimization pass ---- */
.burger{width:48px;height:48px;padding:0;display:none;place-items:center}
@media (max-width:1060px){.burger{display:grid}}
.stepper-3{grid-template-columns:repeat(3,1fr)}
.afmap svg,.map-panel svg{width:100%;height:auto}
@media (max-width:900px){.gold-grid{grid-template-columns:1fr;gap:30px}.map-panel{max-width:560px;justify-self:start}}
@media (max-width:860px){.stepper-3{grid-template-columns:1fr}}
@media (max-width:600px){
.hdr .wrap{padding-inline:14px;gap:12px}
.hdr-logo{font-size:19px}
.hdr-logo img{width:34px;height:34px}
.hdr-cta{gap:8px}
.hdr-cta .btn{font-size:13px;padding:0 13px;min-height:44px;white-space:nowrap}
.annc{font-size:12px}
.hero-slide>.wrap{padding-bottom:calc(var(--hero-foot-h,140px) + 14px)}
.hero-foot .wrap{padding-bottom:20px}
.hero-sub{font-size:15.5px}
.cd div{min-width:0;flex:1}
.cd{width:100%;max-width:300px}
}
.m-enrol{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;align-items:center;justify-content:space-between;gap:12px;background:rgba(24,24,56,.97);backdrop-filter:blur(8px);padding:10px 16px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -8px 24px rgba(0,0,0,.25)}
.m-enrol b{color:#fff;font-family:var(--font-display);font-size:17px;display:block}
.m-enrol small{color:rgba(255,255,255,.7);font-size:11.5px;display:block;max-width:200px}
.m-enrol .btn{flex:none}
@media (max-width:900px){.m-enrol{display:flex}.has-menrol main{padding-bottom:78px}.has-menrol .pal-fab{bottom:calc(156px + env(safe-area-inset-bottom))}.has-menrol .wa-fab{bottom:calc(92px + env(safe-area-inset-bottom))}.has-menrol .pal-teaser{bottom:calc(232px + env(safe-area-inset-bottom))}.has-menrol .cookie{bottom:calc(86px + env(safe-area-inset-bottom))}}

@media (max-width:600px){
.hdr .wrap{gap:8px}
.hdr-cta .btn{padding:0 12px}
.burger{width:44px;height:44px}
.hero h1,.hero h2.as-h1{font-size:clamp(1.9rem,8.4vw,2.4rem)}
}

/* panel pages on mobile: let grid children shrink, scroll tables, wrap the topbar */
@media (max-width:1060px){
.two-col>*,.main>section,.panel{min-width:0}
.dtable-scroll{overflow-x:auto}
.dtable{min-width:560px}
}
@media (max-width:720px){
.dtop{flex-wrap:wrap;height:auto;min-height:var(--hdr-h);padding-block:8px;row-gap:6px}
.avatar-chip span{display:none}
.nc{grid-template-columns:1fr}
.nc .acts{flex-wrap:wrap}
.cd{flex-wrap:wrap}
}

#outcomes.band{padding-block:clamp(36px,5vw,58px)}
#outcomes .measure-top{margin-bottom:18px}

.pal-mock .pd-chips{margin-top:auto;padding-top:10px}
@media (max-width:900px){.pal-mock{height:auto}.pd-body{min-height:0;height:288px;flex:none}}

.tsrc{text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;margin-top:10px;font-size:12.5px;font-weight:600;color:var(--gold-800);min-height:44px}
.tsrc:hover{color:var(--navy-700);text-decoration:none}
/* display-style links inside <p> wrappers never underline, sitewide */
.measure a:hover,.measure-top a:hover,.eyebrow a:hover,.gp a:hover,.tsrc:hover{text-decoration:none}

#outcomes .stat b{color:var(--navy-800)}#outcomes .stat p{color:rgba(24,24,56,.78)}#outcomes .stat .u{background:var(--navy-800)}#outcomes .measure-top a{color:var(--navy-800)}#outcomes .measure-top a:hover{color:var(--navy-700)}

/* ---- Tablet band ---- */
@media (min-width:721px) and (max-width:1060px){
.grid4,.stats,.steps,.stepper-3{grid-template-columns:repeat(2,1fr)}
.bento{grid-template-columns:repeat(2,1fr)}
.school.lg{grid-column:span 2}
.ladder{grid-template-columns:repeat(2,1fr);row-gap:22px}
.ladder::before{display:none}
.ai-grid{grid-template-columns:1fr;gap:30px}
.pal-mock{max-width:560px;height:auto}
.pd-body{min-height:0;height:300px;flex:none}
.t-slide{width:min(320px,44vw)}
.footer .cols,.f-grid{grid-template-columns:repeat(3,1fr)}
.two-col{grid-template-columns:1fr}
.hero-slide>.wrap{padding-block:clamp(56px,8vh,90px) calc(var(--hero-foot-h,140px) + 16px)}
}
/* comfortable tap spacing for touch devices at any width */
@media (hover:none){
.hdr-cta{gap:10px}
.hero-pills{gap:10px}
.filters{row-gap:10px}
}

@media (max-width:600px){
.hdr-cta .btn{font-size:12.5px;padding:0 10px}
.hdr-cta{min-width:0;overflow:hidden}
}
@media (max-width:720px){
.composer,.crow{min-width:0;max-width:100%}
.crow{flex-wrap:wrap}
.crow textarea{min-width:0;width:100%}
.sp-form{width:auto;max-width:100%}
}



.wa-fab{position:fixed;right:24px;bottom:20px;z-index:var(--z-overlay);width:52px;height:52px;border-radius:50%;background:var(--color-whatsapp-deep);color:#fff;border:2.5px solid rgba(255,255,255,.9);box-shadow:var(--shadow-lg);display:grid;place-items:center;cursor:pointer;transition:transform 200ms var(--ease-out),box-shadow 200ms}
.wa-fab:hover{transform:scale(1.06);box-shadow:var(--shadow-xl);color:#fff}
.wa-fab:focus-visible{outline:3px solid var(--gold-400);outline-offset:3px}
.wa-fab svg{width:26px;height:26px;fill:currentColor}
.wa-tip{position:fixed;right:86px;bottom:32px;z-index:var(--z-overlay);background:var(--navy-800);color:#fff;font:600 12.5px var(--font-sans);padding:7px 11px;border-radius:9px;white-space:nowrap;opacity:0;transform:translateX(6px);transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out);pointer-events:none}
.wa-fab:hover+.wa-tip,.wa-fab:focus-visible+.wa-tip{opacity:1;transform:none}
@media (max-width:720px){.wa-fab{right:18px}.wa-tip{display:none}}

/* City label on the Africa map: instant on hover and focus. The native title
   attribute waits about a second, which reads as broken on a hover affordance. */
.afa,.afp{cursor:default}
.afa[data-city]::after,.afp[data-city]::after{content:attr(data-city);position:absolute;left:50%;bottom:calc(100% + 9px);transform:translate(-50%,3px);background:var(--navy-800);color:#fff;font:700 11.5px/1 var(--font-sans);letter-spacing:.01em;white-space:nowrap;padding:6px 9px;border-radius:8px;box-shadow:0 6px 16px rgba(16,16,40,.28);opacity:0;pointer-events:none;transition:opacity 110ms var(--ease-out),transform 110ms var(--ease-out);z-index:6}
.afa[data-city]::before,.afp[data-city]::before{content:"";position:absolute;left:50%;bottom:calc(100% + 4px);transform:translate(-50%,3px);border:5px solid transparent;border-top-color:var(--navy-800);opacity:0;pointer-events:none;transition:opacity 110ms var(--ease-out),transform 110ms var(--ease-out);z-index:6}
.afa:hover::after,.afa:focus-visible::after,.afp:hover::after,.afp:focus-visible::after,
.afa:hover::before,.afa:focus-visible::before,.afp:hover::before,.afp:focus-visible::before{opacity:1;transform:translate(-50%,0)}
.afa:hover,.afa:focus-visible{z-index:7}
.afa:focus-visible{outline:3px solid var(--gold-400);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.afa[data-city]::after,.afa[data-city]::before,.afp[data-city]::after,.afp[data-city]::before{transition:none}}

.map-legend .d.face{width:16px;height:16px;padding:0;overflow:hidden;border:1.5px solid var(--navy-800);box-shadow:0 0 0 1.5px rgba(255,255,255,.9)}
.map-legend .d.face img{width:100%;height:100%;object-fit:cover;border-radius:50%}

/* Global partners: real transparent marks, so no tile or box behind any of them */
.gp-wm{font-family:var(--font-display);font-weight:800;font-size:19px;letter-spacing:-.01em;color:var(--navy-700);height:52px;display:grid;place-items:center;white-space:nowrap}
.gp-mono{opacity:.82}
.gp:hover .gp-mono{opacity:1}

/* Panels on a phone: wide tables and the timetable grid cannot reflow, so the
   panel scrolls horizontally instead of the whole page. */
@media (max-width:720px){
.panel{overflow-x:auto}
.panel table,.tt{min-width:0}
.panel h2{flex-wrap:wrap;row-gap:4px}
.panel h2 .rt{margin-left:0;white-space:normal;flex:1 1 100%}
}
@media (max-width:720px){
table.sp,table.dtable{display:block;overflow-x:auto;white-space:nowrap}
}

.band--navy .tsrc,.on-dark .tsrc{color:var(--gold-400)}
.band--navy .tsrc:hover,.on-dark .tsrc:hover{color:var(--gold-300)}
/* but a white card inside that dark band is a light surface again */
.on-dark .card .tsrc,.band--navy .card .tsrc,.on-dark .tst .tsrc,.band--navy .tst .tsrc{color:var(--gold-800)}
.on-dark .card .tsrc:hover,.band--navy .card .tsrc:hover,.on-dark .tst .tsrc:hover,.band--navy .tst .tsrc:hover{color:var(--navy-700)}

/* ---- Touch: panel controls ---- */
/* Panels were built for a mouse, so their dense controls fall under 44px on a phone.
   The toggle keeps its 24px visual track and gains an invisible 44px hit area
   instead of being inflated, which would break every panel row it sits in. */
/* Covers real tablets two ways: hover:none / pointer:coarse for iPads that report it,
   and the width band so a 768-1024 viewport is treated as touch regardless. */
@media (hover:none),(pointer:coarse),(max-width:1024px){
.tgl{position:relative}
/* the switch keeps its 24px track and gains an invisible 44px hit area, so panel rows
   are not pushed apart; it is excluded from the min-height sweep below on purpose */
.tgl::before{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
.dbody button:not(.tgl),.dbody a.btn,.panel button:not(.tgl),.panel a.btn,.adv,.acts button,.state-pick button,.icon-btn{min-height:44px!important}
.dbody input:not([type=checkbox]):not([type=radio]),.dbody select,.dbody textarea,.panel input:not([type=checkbox]):not([type=radio]),.panel select,.dtop input,.dtop select{min-height:44px!important;font-size:16px!important}
/* topbars and the Pal composer sit outside .dbody, so they need naming too */
.btn-sm,.dtop button,.dtop a.btn,.pal-send,.side-tog,.tact{min-height:44px!important}
.pal-panel .chips button,.pd-sugg button{min-height:44px!important}
/* named control groups that were still under 44: blog filters, ambassador cards,
   the verify demo states, the School curriculum switch, and the CMS collection rail */
.fbtn,.view,.acc-switch button,.coll,button[data-try],.demo-note button{min-height:44px!important}
input[type=search],input[type=text],input[type=email],input[type=tel],input[type=date],input[type=datetime-local],input[type=number],input[type=password],select,textarea{min-height:44px!important;font-size:16px!important}
.linkbtn{min-height:44px!important}
.pal-send{height:44px!important;flex:none!important}
.acts button{padding-block:8px}
.state-pick{gap:8px}
}