: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 */
.start{border-color:#9FD3EE;background:linear-gradient(180deg,#fff,#F1F9FE)}
/* 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,.closing{grid-template-columns:1fr}
  .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}
}
@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}
.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}
}
/* ---------- 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)}
/* ---------- 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}
/* 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}}
/* 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}

/* ---------- Courses catalogue, coming next, career paths and fee tags ---------- */
.eyebrow{display:inline-block;font:800 .78rem "Nunito Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);margin-bottom:.6rem}
.sig{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1.5px solid var(--line);border-radius:18px;background:#fff;margin:0 0 2rem;overflow:hidden}
.sig div{padding:1rem 1.15rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}
.sig div:nth-child(3n){border-right:0}
.sig div:nth-last-child(-n+3){border-bottom:0}
.sig b{display:block;font:600 1rem Outfit,sans-serif;color:var(--ink)}
.sig span{display:block;color:var(--mut);font-size:.9rem;line-height:1.45;margin-top:.15rem}
.cat-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:1.2rem}
.cat-tabs{display:flex;flex-wrap:wrap;gap:.35rem}
.cat-tab{border:1.5px solid var(--line);background:#fff;color:var(--txt);border-radius:999px;padding:.4rem .9rem;font:800 .88rem "Nunito Sans",sans-serif;cursor:pointer}
.cat-tab span{color:var(--mut);font-weight:700;margin-left:.25rem}
.cat-tab.on{background:var(--ink);border-color:var(--ink);color:#fff}
.cat-tab.on span{color:#BFE0F2}
.cat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;align-items:start}
.course{display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:1.3rem 1.3rem 1.15rem;min-width:0}
.course.soon{background:#FFFDF6;border:1.5px dashed #F2CF7F}
.c-top{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.75rem}
.c-track{font:800 .74rem "Nunito Sans",sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--mut)}
.c-open{background:#E3F6EC;color:#157A47;border-radius:8px;padding:.15rem .55rem;font-weight:800;font-size:.78rem}
.course h3{font-size:1.32rem;font-weight:600}
.course .c-sub{display:block;font:500 .98rem Outfit,sans-serif;color:var(--brand);margin-top:.15rem}
.course .c-tag{margin:.6rem 0 0;color:var(--mut);font-style:italic}
.c-meta{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:.2rem 1.1rem;margin:.9rem 0 0;padding:.7rem 0;border-block:1px solid var(--line);font-variant-numeric:tabular-nums}
.c-meta dt{font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--mut)}
.c-meta dd{margin:0;font-weight:800;color:var(--ink);font-size:.92rem}
.c-build{margin:.8rem 0 0;font-size:.95rem;color:var(--txt)}
.c-build b{color:var(--ink)}
.course .keys{margin-top:.8rem}
.c-careers{margin:.7rem 0 0;font-size:.88rem;color:#145A36;font-weight:700}
.c-careers::before{content:"";display:inline-block;width:.55rem;height:.55rem;border-radius:2px;background:#2BB673;margin-right:.4rem}
.course .expand{margin-top:.9rem}
.c-sig{margin:.2rem 0 .7rem;padding:.6rem .75rem;border-radius:12px;background:var(--mist);color:var(--ink);font-size:.9rem}
.c-sig b{display:block;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--brand)}
.c-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:auto;padding-top:1rem}
.c-price{font:600 1.35rem Outfit,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.c-price small{display:block;font:700 .75rem "Nunito Sans",sans-serif;color:var(--mut)}
.c-after{font-weight:800;font-size:.82rem;color:#7A5A00}
.course .btn{padding:.6rem 1rem;font-size:.92rem;border-radius:12px}
.cat-hint{margin:1.4rem 0 0;padding:1rem 1.2rem;border-radius:16px;background:var(--mist);color:var(--ink);display:flex;flex-wrap:wrap;gap:.3rem .8rem;align-items:center}
.cat-hint b{font-family:Outfit,sans-serif;font-weight:600}
.cat-empty{grid-column:1/-1;color:var(--mut);padding:1rem 0}
@media (max-width:980px){.cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sig{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sig div:nth-child(3n){border-right:1px solid var(--line)}.sig div:nth-child(2n){border-right:0}.sig div:nth-last-child(-n+3){border-bottom:1px solid var(--line)}.sig div:nth-last-child(-n+2){border-bottom:0}}
@media (max-width:640px){.cat-grid{grid-template-columns:1fr}.sig{grid-template-columns:1fr}.sig div{border-right:0!important;border-bottom:1px solid var(--line)!important}.sig div:last-child{border-bottom:0!important}.c-meta{grid-template-columns:repeat(2,auto)}}
.feat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;align-items:start;margin-bottom:2rem}
.feat{position:relative;background:#fff;border:2px solid #9FD3EE;border-radius:24px;padding:1.6rem;box-shadow:0 30px 60px -45px rgba(2,60,100,.45);min-width:0}
.feat.ai{border-color:#F2CF7F;background:linear-gradient(180deg,#FFFBF1,#fff 40%)}
.feat-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}
.tag-start{background:var(--ink);color:#fff;border-radius:8px;padding:.18rem .6rem;font-weight:800;font-size:.8rem}
.tag-hot{background:#E5484D;color:#fff;border-radius:8px;padding:.18rem .6rem;font-weight:800;font-size:.8rem}
.tag-soft{background:var(--mist);color:var(--brand);border-radius:8px;padding:.18rem .6rem;font-weight:800;font-size:.8rem}
.feat h3{font-size:1.7rem;font-weight:600}
.feat .hrs{margin:.35rem 0 .8rem;color:var(--brand);font-weight:800}
.feat > p{margin:0;color:var(--mut)}
.feat .parts{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 0;padding:0;list-style:none}
.feat .parts li{background:var(--mist);color:var(--ink);border-radius:9px;padding:.25rem .65rem;font-weight:700;font-size:.88rem}
.feat-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem;margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--line)}
.feat-price{font:600 1.7rem Outfit,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.1}
.feat-price s{font:600 .95rem "Nunito Sans",sans-serif;color:var(--mut);margin-left:.4rem}
.feat-price small{display:block;font:700 .82rem "Nunito Sans",sans-serif;color:var(--mut);margin-top:.25rem}
.part-h{margin:.6rem 0 .4rem;font-weight:800;color:var(--ink)}
.mods ul{display:block}
.grid-head{margin:0 0 .9rem;font-size:1.25rem;font-weight:600}
@media (max-width:980px){.feat-grid{grid-template-columns:1fr}}
.soon-head{margin:2.6rem 0 1rem;font:600 1.35rem/1.3 Outfit,sans-serif;color:var(--ink);display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem .7rem}
.soon-head span{font:400 .95rem/1.4 "Nunito Sans",sans-serif;color:#5b6b7a}
.soon-grid{display:grid;gap:1rem}
.soon-card{display:flex;flex-direction:column;gap:.45rem;padding:1.1rem 1.2rem;border-radius:18px;background:#FFFDF6;border:1.5px dashed #F2CF7F;min-width:0}
.soon-card .c-top{display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.soon-card .c-track{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#5b6b7a}
.soon-tag{font-size:.72rem;font-weight:700;padding:.2rem .55rem;border-radius:999px;background:#FDE7B0;color:#7a5200;white-space:nowrap}
.soon-card h4{margin:.1rem 0 0;font:600 1.08rem/1.3 Outfit,sans-serif;color:var(--ink)}
.soon-card .c-sub{display:block;font:500 .85rem/1.35 "Nunito Sans",sans-serif;color:#0B6FA4;margin-top:.15rem}
.soon-card p{margin:0;font-size:.9rem;line-height:1.45;color:#3c4a57}
.soon-card .s-meta{font-size:.8rem;color:#5b6b7a}
.soon-card .c-foot{margin-top:auto;padding-top:.6rem;display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
.soon-card .c-after{font-size:.8rem;font-weight:600;color:#7a5200}
@media (max-width:640px){.soon-grid{grid-template-columns:1fr}}
.soon-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:980px){.soon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.soon-grid{grid-template-columns:1fr}}
.seller-tag{margin-left:.5rem;background:#E5484D;color:#fff;border-radius:7px;padding:.1rem .45rem;font:800 .72rem "Nunito Sans",sans-serif;font-style:normal;vertical-align:middle}
.fee.hot{background:linear-gradient(90deg,#FFF6F6,#fff)}
.cat-hint.bar{grid-column:1/-1;margin:0;text-decoration:none;border:1.5px solid var(--line)}
.cat-hint.bar:hover{border-color:var(--brand)}
.cat-hint.bar .go{margin-left:auto;font-weight:700;color:var(--brand)}
#paths{background:linear-gradient(180deg,#fff,var(--paper))}
.path-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-bottom:1.4rem}
.pp{display:flex;gap:.75rem;align-items:center;text-align:left;padding:.8rem .9rem;border-radius:16px;border:1.5px solid var(--line);background:#fff;cursor:pointer;font:inherit;color:var(--txt);min-width:0}
.pp:hover{border-color:#9fd0ea}
.pp[aria-selected=true]{border-color:var(--brand);background:var(--mist);box-shadow:0 0 0 3px rgba(2,120,174,.12)}
.pp i{flex:none;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:12px;background:var(--ink);color:#fff;font:700 .85rem Outfit,sans-serif;font-style:normal}
.pp b{display:block;font:600 1rem/1.25 Outfit,sans-serif;color:var(--ink)}
.pp small{display:block;color:var(--mut);font-size:.8rem;line-height:1.3;margin-top:.1rem}
.path-view{background:#fff;border:1.5px solid var(--line);border-radius:24px;padding:1.4rem 1.4rem 1.2rem}
.pv-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.8rem 1.5rem;align-items:flex-end;margin-bottom:1.3rem}
.pv-head h3{margin:0;font:600 1.5rem/1.2 Outfit,sans-serif;color:var(--ink)}
.pv-head p{margin:.25rem 0 0;color:var(--mut)}
.pv-head p b{color:var(--ink)}
.pv-stats{display:flex;gap:.5rem;flex-wrap:wrap}
.pv-stats span{padding:.45rem .75rem;border-radius:12px;background:var(--mist);font-size:.85rem;color:var(--mut)}
.pv-stats .pb{background:#FFF3D6;color:#7a5200}.pv-stats .pb s{color:var(--mut);margin-left:.2rem}.pv-stats b{display:block;font:700 1.05rem Outfit,sans-serif;color:var(--ink)}
.journey{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:1.6rem}
.step{position:relative;display:flex;flex-direction:column;gap:.35rem;padding:1rem;border-radius:18px;border:1.5px solid var(--line);background:#fff;min-width:0}
.step:not(:last-child)::after{content:"";position:absolute;top:2.1rem;right:-1.6rem;width:1.6rem;height:2px;background:var(--brand)}
.step:not(:last-child)::before{content:"";position:absolute;top:calc(2.1rem - 4px);right:-1.62rem;border:5px solid transparent;border-left-color:var(--brand);border-right:0;z-index:1}
.step.soon{background:#FFFDF6;border-style:dashed;border-color:#F2CF7F}
.step.opt{border-style:dashed}
.step.top{border-color:var(--sun);box-shadow:0 6px 18px rgba(255,185,56,.18)}
.st-n{display:flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--mut)}
.st-n i{display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--brand);color:#fff;font:700 .85rem Outfit,sans-serif;font-style:normal;letter-spacing:0}
.step.soon .st-n i{background:#E0A82E}
.step h4{margin:.15rem 0 0;font:600 1.02rem/1.25 Outfit,sans-serif;color:var(--ink)}
.st-tags{display:flex;flex-wrap:wrap;gap:.3rem}
.st-tags span{font-size:.7rem;font-weight:700;padding:.15rem .5rem;border-radius:999px;background:#E5F6EE;color:#17804E}
.st-tags span.s{background:#FDE7B0;color:#7a5200}
.st-tags span.o{background:var(--mist);color:var(--brand)}
.st-tags span.t{background:var(--sun);color:#3d2a00}
.st-after{margin:0;font-size:.86rem;line-height:1.4;color:var(--txt)}
.st-after b{display:block;font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;color:var(--mut)}
.st-meta{margin-top:auto;padding-top:.4rem;font-size:.82rem;color:var(--mut)}
.st-meta b{color:var(--ink);font:700 .95rem Outfit,sans-serif}
.pv-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem;margin-top:1.3rem;padding-top:1rem;border-top:1px dashed var(--line)}
.pv-foot p{margin:0;color:var(--mut);font-size:.9rem;max-width:44rem}
.pv-foot p b{color:var(--ink)}
@media (max-width:980px){.path-pick{grid-template-columns:repeat(2,minmax(0,1fr))}
 .journey{grid-auto-flow:row;grid-auto-columns:auto;gap:1.1rem}
 .step:not(:last-child)::after{top:auto;bottom:-1.1rem;right:auto;left:1.85rem;width:2px;height:1.1rem}
 .step:not(:last-child)::before{top:auto;bottom:-1.15rem;right:auto;left:calc(1.85rem - 4px);border:5px solid transparent;border-top-color:var(--brand);border-bottom:0}}
@media (max-width:640px){.path-pick{grid-template-columns:1fr 1fr;gap:.5rem}.pp{padding:.6rem;gap:.5rem}.pp i{width:2rem;height:2rem;font-size:.75rem}.pp small{display:none}.path-view{padding:1rem;border-radius:20px}.cat-hint.bar .go{margin-left:0}}
.best-tag,.seller-tag{white-space:nowrap;display:inline-block}
.mods .mod-line{display:flex;gap:.6rem;align-items:baseline;padding:.6rem .8rem}
.mods .mod-line::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 .mod-line b{flex:1;color:var(--ink);font-weight:700}
.course .expand-body{margin-top:.6rem}