:root{--paper:#F7FBFE;--ink:#0A3A57;--txt:#1F4560;--mut:#5F7D90;--brand:#0278AE;--sun:#FFB938;--mint:#2BB673;--line:#D9EBF5;--mist:#EAF5FC}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(76px + env(safe-area-inset-top,0px))}
body{margin:0;background:var(--paper);color:var(--txt);font:17px/1.6 "Nunito Sans","Segoe UI",system-ui,sans-serif;padding-bottom:env(safe-area-inset-bottom,0px)}
h1,h2,h3{font-family:Outfit,"Segoe UI",sans-serif;color:var(--ink);margin:0;line-height:1.12;letter-spacing:-.01em}
a{color:var(--brand)}
.wrap{width:min(1160px,92vw);margin:0 auto}
:focus-visible{outline:3px solid #7CCBF0;outline-offset:2px;border-radius:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.4rem;border-radius:14px;font-weight:800;text-decoration:none;border:1.5px solid transparent;transition:transform .15s,background .2s}
.btn:active{transform:scale(.98)}
.btn.sun{background:var(--sun);color:#3A2700}
.btn.sun:hover{background:#FFC75E}
.btn.line{border-color:#BFDDEE;color:var(--ink);background:#fff}
.btn.line:hover{border-color:var(--brand)}
/* header */
.top{position:sticky;top:0;z-index:30;background:rgba(247,251,254,.9);backdrop-filter:blur(12px);border-bottom:1px solid transparent;padding-top:env(safe-area-inset-top,0px)}
.top.scrolled{border-bottom-color:var(--line)}
.bar{display:flex;align-items:center;gap:1.5rem;height:72px}
.bar img{height:32px;width:auto;display:block}
.links{display:flex;gap:1.6rem;margin-left:auto;font-weight:700}
.links a{color:var(--mut);text-decoration:none}
.links a:hover{color:var(--brand)}
.login{padding:.5rem 1rem;border-radius:12px;background:var(--ink);color:#fff;text-decoration:none;font-weight:800;font-size:.9rem}
.reg{padding:.55rem 1.05rem;font-size:.92rem;border-radius:12px}
/* hero */
.hero{padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(3rem,6vw,5rem)}
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.hero h1{font-size:clamp(2.4rem,5.6vw,4.1rem);font-weight:600}
.hero p.lead{font-size:1.18rem;color:var(--mut);max-width:34ch;margin:1.2rem 0 1.8rem}
.cta{display:flex;flex-wrap:wrap;gap:.8rem}
.facts{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin:2rem 0 0;padding:0;list-style:none;color:var(--ink);font-weight:700;font-size:.95rem}
.facts li{display:flex;align-items:center;gap:.45rem}
.facts svg{flex:none}
/* live class window: the memorable element */
.window{position:relative;border-radius:22px;background:#0D2F45;padding:12px;box-shadow:0 40px 80px -40px rgba(2,60,100,.55)}
.win-top{display:flex;align-items:center;gap:.5rem;padding:.25rem .4rem .6rem;color:#9FC6DC;font-size:.82rem;font-weight:700}
.live{display:inline-flex;align-items:center;gap:.35rem;background:#E5484D;color:#fff;border-radius:7px;padding:.12rem .5rem;font-size:.75rem}
.live i{width:7px;height:7px;border-radius:50%;background:#fff;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.3}}
.screen{position:relative;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#F4FAFE;display:grid;grid-template-columns:1fr 1.1fr}
.code{background:#0F3B57;color:#CFE8F7;font:600 clamp(.66rem,1.25vw,.86rem)/1.75 ui-monospace,Consolas,monospace;padding:1rem 1.1rem;white-space:pre}
.code .k{color:#FFB938}.code .c{color:#6FA8C7}
.code .ln{opacity:0;animation:type .01s forwards}
@keyframes type{to{opacity:1}}
.sky{position:relative;background:linear-gradient(180deg,#E3F4FD,#F7FCFF)}
.sky svg{position:absolute;inset:0;width:100%;height:100%}
.drone{offset-path:path("M30 210 L30 60 L230 60 L230 150");offset-rotate:0deg;animation:fly 6s 1.6s ease-in-out infinite}
@keyframes fly{0%{offset-distance:0%}55%{offset-distance:100%}100%{offset-distance:100%}}
.cam{position:absolute;right:22px;top:58px;width:clamp(86px,20%,124px);aspect-ratio:4/3;border-radius:12px;background:linear-gradient(160deg,#2B6B8F,#174A66);border:2px solid #fff;display:grid;place-items:center;color:#fff;font-size:.72rem;font-weight:800;box-shadow:0 10px 24px -10px rgba(0,0,0,.5)}
.cam .face{width:30%;aspect-ratio:1;border-radius:50%;background:#F2C6A0;margin-bottom:.9rem}
.cam span{position:absolute;bottom:.3rem;left:.4rem}
.chat{position:absolute;left:-26px;bottom:52px;background:#fff;border-radius:14px 14px 14px 4px;padding:.55rem .8rem;font-size:.82rem;font-weight:700;color:var(--ink);box-shadow:0 14px 30px -14px rgba(2,60,100,.45);animation:pop .4s 4.2s both}
.chat small{display:block;color:var(--mut);font-weight:600}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.96)}}
/* sections */
section{padding:clamp(3rem,7vw,5.5rem) 0}
.sec-head{max-width:40rem;margin-bottom:2.2rem}
.sec-head h2{font-size:clamp(1.9rem,4vw,2.7rem);font-weight:600}
.sec-head p{color:var(--mut);margin:.7rem 0 0;font-size:1.08rem}
/* course path */
.path{position:relative;display:grid;grid-template-columns:1fr 1.15fr;gap:1.4rem;align-items:center}
.stage{position:relative;background:#fff;border:1.5px solid var(--line);border-radius:22px;padding:1.6rem}
.stage h3{font-size:1.45rem;font-weight:600}
.stage .hrs{margin:.3rem 0 .8rem;color:var(--brand);font-weight:800}
.stage p{margin:0;color:var(--mut)}
.stage .parts{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 1.2rem;padding:0;list-style:none}
.stage .parts li{background:var(--mist);color:var(--ink);border-radius:9px;padding:.25rem .65rem;font-weight:700;font-size:.88rem}
.stage a{font-weight:800;text-decoration:none}
.start{border-color:#9FD3EE;background:linear-gradient(180deg,#fff,#F1F9FE)}
.start .step{display:inline-block;background:var(--brand);color:#fff;border-radius:9px;padding:.2rem .6rem;font-weight:800;font-size:.82rem;margin-bottom:.8rem}
.branches{display:grid;gap:1rem;position:relative}
.branches::before{content:"";position:absolute;left:-1.4rem;top:22%;bottom:22%;width:1.4rem;border:2px solid #9FD3EE;border-right:0;border-radius:18px 0 0 18px}
.branch .step{display:inline-block;background:var(--mist);color:var(--brand);border-radius:9px;padding:.2rem .6rem;font-weight:800;font-size:.82rem;margin-bottom:.6rem}
.next-up{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:.6rem;padding:1.1rem 1.3rem;border-radius:18px;border:1.5px dashed #F2CF7F;background:#FFFBF1}
.next-up b{color:var(--ink);font-family:Outfit,sans-serif;font-size:1.05rem;font-weight:600}
.next-up span{color:var(--mut)}
.soon-tag{background:var(--sun);color:#3A2700;border-radius:8px;padding:.15rem .55rem;font-weight:800;font-size:.8rem}
.next-up a{margin-left:auto;font-weight:800;text-decoration:none}
/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem;counter-reset:s;list-style:none;margin:0;padding:0}
.steps li{position:relative;padding-top:3.2rem}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:0;width:2.4rem;height:2.4rem;border-radius:12px;display:grid;place-items:center;background:var(--ink);color:#fff;font:600 1.1rem Outfit,sans-serif}
.steps li:not(:last-child)::after{content:"";position:absolute;top:1.2rem;left:3.1rem;right:-1rem;height:2px;background:repeating-linear-gradient(90deg,#9FD3EE 0 8px,transparent 8px 14px)}
.steps h3{font-size:1.15rem;font-weight:600}
.steps p{margin:.35rem 0 0;color:var(--mut);font-size:.98rem}
.band{background:#fff;border-block:1px solid var(--line)}
/* fees */
.fees{background:#fff;border:1.5px solid var(--line);border-radius:22px;overflow:hidden}
.fee{display:grid;grid-template-columns:1.6fr .7fr 1fr auto;gap:1rem;align-items:center;padding:1.1rem 1.4rem;border-top:1px solid var(--line)}
.fee:first-child{border-top:0}
.fee b{font-family:Outfit,sans-serif;font-weight:600;color:var(--ink);font-size:1.08rem}
.fee small{display:block;color:var(--mut);font-size:.9rem}
.fee .price{font:600 1.5rem Outfit,sans-serif;color:var(--ink)}
.fee .was{color:var(--mut);font-size:.9rem}
.fee .was s{opacity:.8}
.save{color:#157A47;font-weight:800}
.fee.best{background:linear-gradient(90deg,#EFF8FE,#fff)}
.fee.best b::after{content:"Complete program";margin-left:.5rem;background:var(--ink);color:#fff;border-radius:7px;padding:.1rem .45rem;font:800 .72rem "Nunito Sans",sans-serif;vertical-align:middle}
.fee .btn{padding:.55rem 1rem;font-size:.9rem}
.fee-note{margin:1rem 0 0;color:var(--mut);font-size:.95rem}
.offer{display:inline-flex;gap:.6rem;align-items:center;margin-bottom:1.2rem;padding:.55rem .9rem;border-radius:12px;background:#FFF4D6;color:#5C3E00;font-weight:700}
/* benefits */
.ben{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem 2.6rem;margin:0;padding:0;list-style:none}
.ben h3{font-size:1.1rem;font-weight:600;margin-bottom:.35rem}
.ben p{margin:0;color:var(--mut)}
.ben li{border-left:3px solid #9FD3EE;padding-left:1rem}
/* faq */
.faq{max-width:46rem}
.faq details{border-bottom:1px solid var(--line);padding:1rem 0}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;font:600 1.12rem Outfit,sans-serif;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--brand);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:.6rem 0 0;color:var(--mut)}
/* closing */
.closing{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;align-items:center;background:var(--ink);color:#CFE6F4;border-radius:26px;padding:clamp(1.8rem,4vw,3rem)}
.closing h2{color:#fff;font-size:clamp(1.7rem,3.6vw,2.4rem);font-weight:600}
.closing p{margin:.7rem 0 0}
.closing .cta{justify-content:flex-end}
.closing .btn.line{background:transparent;color:#fff;border-color:#4C7C99}
footer{padding:2.5rem 0 3rem;color:var(--mut);font-size:.9rem}
.foot{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
.foot img{height:28px;width:auto}
.foot nav{display:flex;gap:1.2rem}
.foot nav a{color:var(--mut)}
.copy{flex-basis:100%;font-size:.8rem;margin:0}
.preview-tag-unused{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:40;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;font-size:.8rem;font-weight:800;color:var(--ink);box-shadow:0 10px 24px -14px rgba(2,60,100,.5)}
@media (max-width:980px){
  .links{display:none}
  .login{margin-left:auto}
  .hero-grid,.path,.closing{grid-template-columns:1fr}
  .branches::before{display:none}
  .steps{grid-template-columns:1fr 1fr}
  .steps li::after{display:none}
  .ben{grid-template-columns:1fr 1fr}
  .closing .cta{justify-content:flex-start}
}
@media (max-width:640px){
  body{font-size:16px}
  .reg{display:none}
  .chat{position:static;display:inline-block;margin:.7rem 0 0 .2rem}
  .steps,.ben{grid-template-columns:1fr}
  .fee{grid-template-columns:1fr auto;gap:.3rem 1rem}
  .fee .was{grid-column:1}
  .fee .btn{grid-column:2;grid-row:1/3}
  .next-up a{margin-left:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important} .code .ln{opacity:1} .drone{offset-distance:100%}}

/* ---------- additions for the live site ---------- */
.top .logo{flex:none}
.links{margin-left:auto}
.docs{position:relative}
.icon-btn{display:inline-flex;align-items:center;gap:.4rem;height:40px;padding:0 .8rem;border-radius:12px;border:1.5px solid var(--line);background:#fff;color:var(--brand);font:800 .88rem "Nunito Sans",sans-serif;cursor:pointer}
.icon-btn:hover,.icon-btn[aria-expanded="true"]{border-color:var(--brand);background:var(--mist)}
.panel{position:absolute;right:0;top:calc(100% + .5rem);width:min(320px,90vw);padding:.6rem;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 20px 44px -20px rgba(2,60,100,.45);z-index:40;display:grid;gap:.2rem}
.panel-title{margin:.1rem .4rem .3rem;color:var(--mut);font-size:.82rem;font-weight:800}
.doc{display:flex;align-items:center;gap:.7rem;padding:.55rem .5rem;border-radius:11px;text-decoration:none;color:var(--ink);font-weight:700;font-size:.95rem}
.doc:hover{background:var(--mist)}
.pdf{flex:none;display:grid;place-items:center;width:2.1rem;height:2.5rem;border-radius:7px;border:1px solid #F5C9A8;color:#B4410C;font:800 .62rem "Nunito Sans",sans-serif}
.menu-wrap{position:relative;display:none}
.burger{display:inline-grid;gap:4px;width:18px}
.burger i{display:block;height:2px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s}
.burger.open i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.open i:nth-child(2){opacity:0}
.burger.open i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.menu a{padding:.7rem .8rem;border-radius:11px;text-decoration:none;color:var(--ink);font-weight:700}
.menu a:hover{background:var(--mist)}
.menu .menu-reg{color:var(--brand);font-weight:800;border-top:1px solid var(--line);border-radius:0 0 11px 11px;margin-top:.2rem}
.expand{margin-top:1rem}
.expand-btn{border:0;background:none;padding:0;color:var(--brand);font:800 1rem "Nunito Sans",sans-serif;cursor:pointer}
.expand-btn::after{content:" ▾"}
.expand-btn[aria-expanded="true"]::after{content:" ▴"}
.expand-body{margin-top:.8rem}
.part{margin-top:.9rem}
.part-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 1rem;margin-bottom:.4rem}
.part-top b{color:var(--ink)}
.part-top a{font-weight:800;font-size:.9rem;text-decoration:none}
.mods{list-style:none;margin:0;padding:0;display:grid;gap:.35rem;counter-reset:m}
.mods > li{counter-increment:m;border:1px solid var(--line);border-radius:12px;background:#fff}
.mods summary{cursor:pointer;list-style:none;display:flex;gap:.6rem;align-items:baseline;padding:.6rem .8rem}
.mods summary::-webkit-details-marker{display:none}
.mods summary::before{content:counter(m);flex:none;display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:7px;background:var(--mist);color:var(--brand);font:700 .8rem Outfit,sans-serif}
.mods summary b{flex:1;color:var(--ink);font-weight:700}
.mods summary span{color:var(--mut);font-size:.82rem;white-space:nowrap}
.mods ul{margin:0 0 .6rem;padding:0 .9rem 0 2.9rem;color:var(--mut);font-size:.93rem}
.mod-reg{display:inline-block;margin:0 0 .7rem 2.2rem;font-weight:800;font-size:.88rem;text-decoration:none}
.step.soft{background:var(--mist);color:var(--brand)}
.best-tag{margin-left:.5rem;background:var(--ink);color:#fff;border-radius:7px;padding:.1rem .45rem;font:800 .72rem "Nunito Sans",sans-serif;font-style:normal;vertical-align:middle}
.fee.best b::after{content:none}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;align-items:stretch}
.contact-grid .closing{grid-template-columns:1fr;display:flex;flex-direction:column;justify-content:center;gap:.4rem}
.closing .cta{justify-content:flex-start;margin-top:1rem}
.closing .mentor{margin-top:1.4rem;font-size:.95rem}
.closing .mentor a{color:#FFD27A}
.form-card{background:#fff;border:1.5px solid var(--line);border-radius:22px;padding:1.5rem;display:grid;gap:.8rem}
.form-card h3{font-size:1.35rem;font-weight:600}
.form-card label{display:flex;flex-direction:column;gap:.3rem;font-weight:700;font-size:.92rem;color:var(--ink)}
.form-card input,.form-card select,.form-card textarea{font:inherit;font-weight:400;padding:.7rem .8rem;border:1.5px solid var(--line);border-radius:12px;background:var(--paper);color:var(--txt)}
.form-card input:focus,.form-card select:focus,.form-card textarea:focus{outline:none;border-color:var(--brand);background:#fff}
.two{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-err{margin:0;color:#B4410C;font-weight:700}
.form-card.done{align-content:center;text-align:center}
.foot .logo-f{height:28px;width:auto}
@media (max-width:1180px){.links{gap:1.1rem;font-size:.95rem}}
@media (max-width:1080px){.icon-label{display:none}.icon-btn{padding:0 .65rem}}
@media (max-width:980px){
  .menu-wrap{display:block}
  .docs{margin-left:auto}
  .login{margin-left:0}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:640px){.two{grid-template-columns:1fr}.mods ul{padding-left:1.2rem}.mod-reg{margin-left:.9rem}}
.code .ln{display:block}
.contact-grid .closing{align-items:flex-start;text-align:left}
/* On phones and tablets, the Documents and Menu panels open as a full-width card under the top bar, so nothing goes off screen */
@media (max-width:980px){
  .panel{position:fixed;left:12px;right:12px;top:calc(76px + env(safe-area-inset-top,0px));width:auto;max-height:calc(100vh - 100px);overflow:auto}
  .doc{padding:.75rem .6rem}
}
.next-up + .next-up{margin-top:.8rem}
.next-links{margin-left:auto;display:inline-flex;gap:1.2rem;flex-wrap:wrap}
.next-links a{margin-left:0;font-weight:800;text-decoration:none}
@media (max-width:640px){.next-links{margin-left:0}}
/* ---------- Skills and tools on every course card ---------- */
.skillset{display:grid;gap:.85rem;margin:1.1rem 0 .2rem;padding-top:1rem;border-top:1px dashed #CFE6F3}
.sk-label{margin:0 0 .45rem;font:600 .82rem Outfit,sans-serif;letter-spacing:.02em;color:var(--mut)}
.chips-s,.keys{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.chips-s li{background:var(--mist);color:var(--ink);border-radius:999px;padding:.28rem .7rem;font-weight:700;font-size:.84rem}
.chips-s li:has(.chip-more){background:none;padding:0}
.chip-more{border:1.5px dashed #9FD3EE;background:#fff;color:var(--brand);border-radius:999px;padding:.24rem .7rem;font:800 .84rem "Nunito Sans",sans-serif;cursor:pointer}
.chip-more:hover{border-color:var(--brand)}
/* tools look like keyboard keys */
.keys kbd{display:inline-block;font:700 .8rem ui-monospace,"SFMono-Regular",Consolas,monospace;color:var(--ink);background:linear-gradient(180deg,#fff,#F2F8FC);border:1px solid #C9E1EF;border-bottom-width:3px;border-radius:8px;padding:.22rem .55rem;box-shadow:0 1px 0 rgba(10,58,87,.06)}
.stage.start .keys kbd{border-color:#A9D3EA}
.next-skills{flex-basis:100%}
.next-skills .skillset{margin:.2rem 0 0;padding-top:.7rem;border-top-color:#F2DFA8}
.next-skills .keys kbd{background:#fff;border-color:#EBD38F}
/* ---------- Skills / Tools / Careers tabs ---------- */
.sk-tabs{display:inline-flex;gap:.2rem;padding:.2rem;border-radius:12px;background:var(--mist);margin-bottom:.7rem}
.sk-tab{border:0;background:none;padding:.35rem .8rem;border-radius:9px;font:800 .82rem "Nunito Sans",sans-serif;color:var(--mut);cursor:pointer;transition:background .15s,color .15s}
.sk-tab:hover{color:var(--brand)}
.sk-tab.on{background:#fff;color:var(--ink);box-shadow:0 2px 6px -3px rgba(10,58,87,.35)}
.sk-panel{min-height:2.2rem;animation:skIn .25s ease}
@keyframes skIn{from{opacity:0;transform:translateY(4px)}}
.careers{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.careers li{display:inline-flex;align-items:center;gap:.35rem;background:#fff;border:1.5px solid #CDEBD9;color:#145A36;border-radius:10px;padding:.26rem .65rem;font-weight:700;font-size:.84rem}
.careers li::before{content:"";width:.55rem;height:.55rem;border-radius:2px;background:#2BB673}
.next-skills .sk-tabs{background:#FBEFC9}
/* hero headline */
.kicker{display:inline-block;margin:0 0 1rem;padding:.35rem .8rem;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--brand);font-weight:800;font-size:.92rem}
.hero h1 .hl{position:relative;white-space:nowrap;color:var(--brand)}
.hero h1 .hl::after{content:"";position:absolute;left:-.05em;right:-.05em;bottom:.06em;height:.28em;background:var(--sun);opacity:.45;border-radius:6px;z-index:-1}
.hero h1{position:relative;z-index:0}
.sk-head{margin:0 0 .55rem;font:600 .98rem Outfit,sans-serif;color:var(--ink);display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.sk-head span{font:800 .72rem "Nunito Sans",sans-serif;color:#157A47;background:#E3F6EC;border-radius:999px;padding:.15rem .55rem}
.sk-tabs{flex-wrap:wrap}
@media (max-width:420px){.sk-tab{padding:.35rem .6rem;font-size:.78rem}}
.next-skills .sk-head span,.branch .sk-head span{background:var(--mist);color:var(--brand)}
/* hero: tagline as headline, slogan underneath */
.hero h1{font-size:clamp(2.1rem,4.6vw,3.4rem)}
.hero h1 .hl{white-space:normal}
.hero p.lead.strap{font-family:Outfit,sans-serif;font-weight:500;font-size:clamp(1.15rem,2vw,1.35rem);color:var(--ink);margin:1rem 0 1.8rem}
/* ---------- Mentor trust band ---------- */
.mentor-band{padding:1.6rem 0;background:var(--ink);color:#CFE6F4}
.mb-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:1.5rem 2.5rem;align-items:center}
.mb-head h2{color:#fff;font-size:clamp(1.35rem,2.6vw,1.75rem);font-weight:600}
.mb-head h2 span{color:var(--sun)}
.mb-head p{margin:.35rem 0 0;color:#9CC9E2;font-weight:700}
.mb-points{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.mb-points li{position:relative;padding-left:1.6rem}
.mb-points li::before{content:"";position:absolute;left:0;top:.3rem;width:1rem;height:1rem;border-radius:50%;background:#2BB673 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' stroke='white' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat}
.mb-points b{display:block;color:#fff;font-family:Outfit,sans-serif;font-weight:600}
.mb-points span{font-size:.9rem;color:#9CC9E2}
@media (max-width:980px){.mb-grid{grid-template-columns:1fr}}
@media (max-width:640px){.mb-points{grid-template-columns:1fr;gap:.7rem}}
/* ---------- logged-in profile menu and welcome bar ---------- */
.prof{position:relative}
.prof-btn{display:flex;align-items:center;gap:.45rem;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:.25rem .7rem .25rem .25rem;font:inherit;font-weight:800;color:var(--ink);cursor:pointer}
.avatar{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:linear-gradient(135deg,#0B8FD0,#0A4A6E);color:#fff;font-family:Outfit,sans-serif;font-weight:700}
.avatar.big{width:2.6rem;height:2.6rem;font-size:1.15rem}
.caret{font-size:.75rem;color:var(--muted,#5A7A8E)}
.prof-panel{position:absolute;right:0;top:calc(100% + .5rem);min-width:16rem;display:flex;flex-direction:column;padding:.4rem;z-index:60}
.prof-head{display:flex;gap:.7rem;align-items:center;padding:.6rem .7rem .8rem;border-bottom:1px solid var(--line);margin-bottom:.3rem}
.prof-head div{display:flex;flex-direction:column}.prof-head small{color:var(--muted,#5A7A8E)}
.prof-panel a{padding:.65rem .8rem;border-radius:10px;text-decoration:none;color:var(--ink);font-weight:700}
.prof-panel a:hover{background:var(--mist)}
.prof-panel a.out{color:#B03A1A;border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:.2rem}
@media (max-width:640px){.prof-name,.caret{display:none}.prof-btn{padding:.2rem;border:0;background:none}}
.menu .menu-login{font-weight:800;color:var(--ink)}
.welcome{background:linear-gradient(90deg,#FFF3D6,#EAF6FD);border-bottom:1px solid var(--line)}
.wl{display:flex;align-items:center;justify-content:space-between;gap:.8rem 1.5rem;flex-wrap:wrap;padding:.9rem 0}
.wl b{display:block;font-family:Outfit,sans-serif;font-size:1.15rem;color:var(--ink)}
.wl span{color:var(--muted,#5A7A8E);font-size:.95rem}
.wl-btns{display:flex;gap:.6rem;flex-wrap:wrap}
.links a,.login,.reg,.prof-btn{white-space:nowrap}
@media (max-width:980px){.prof-panel{position:fixed;left:12px;right:12px;top:calc(76px + env(safe-area-inset-top,0px));min-width:0;width:auto;max-height:calc(100vh - 100px);overflow:auto}}
/* ---------- brand name as the main heading ---------- */
.hero h1.brand-h1{font-size:clamp(3rem,7.5vw,5.2rem);font-weight:700;letter-spacing:-.02em;line-height:1;margin:.2rem 0 .6rem;
  background:linear-gradient(90deg,#0A4A6E,#0278AE 60%,#0B8FD0);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{font-family:Outfit,sans-serif;font-size:clamp(1.5rem,3.2vw,2.3rem);font-weight:600;line-height:1.2;color:var(--ink);margin:0 0 .8rem;position:relative;z-index:0}
.hero-sub .hl{position:relative;color:var(--brand)}
.hero-sub .hl::after{content:"";position:absolute;left:-.05em;right:-.05em;bottom:.06em;height:.28em;background:var(--sun);opacity:.45;border-radius:6px;z-index:-1}

/* partner-school students never see prices or buying */
.school-student #fees,.school-student a[href="#fees"],.school-student a[href^="register.html"],.school-student .mod-reg,.school-student .docs,.school-student .fee-note{display:none!important}
@media (max-width:980px){.school-student .prof{margin-left:auto}}
.welcome{padding:0!important}.welcome .wl{padding:1.1rem 0}

/* ---------- moving hero background ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero-fx{position:absolute;inset:0;width:100%;height:100%}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}
.hero.has-video .hero-video{opacity:1}
.hero.has-video .hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,28,46,.86) 0%,rgba(6,28,46,.62) 55%,rgba(6,28,46,.35) 100%)}
.hero.has-video .hero-fx{z-index:1}
.hero.has-video,.hero.has-video h1,.hero.has-video .hero-sub,.hero.has-video .facts li{color:#fff}
.hero.has-video .brand-h1{background:none;-webkit-text-fill-color:#fff;color:#fff}
.hero.has-video .lead,.hero.has-video .strap{color:rgba(255,255,255,.88)}
.hero.has-video .kicker{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);color:#fff}
.hero.has-video .hl{color:#FFD27A}
.hero.has-video .btn.line{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
@media(max-width:980px){.hero.has-video .hero-bg::after{background:rgba(6,28,46,.72)}}
/* never let the page slide sideways on phones */
html,body{max-width:100%;overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
.top .logo img{max-width:100%}
.closing,.form-card,.contact-grid>*{min-width:0}
.foot nav{flex-wrap:wrap}
@media (max-width:440px){
  .bar{gap:.55rem}
  .top .logo{flex:0 1 auto;min-width:0}
  .top .logo img{height:30px;width:auto}
  .login{padding:.5rem .8rem}
  .icon-btn{padding:0 .55rem}
}
.hero{touch-action:pan-y}