:root{
  --nh-bg:#0f141a;
  --nh-surface:#171e26;
  --nh-surface-soft:#1b232d;
  --nh-surface-blue:#172734;
  --nh-border:#2a3541;
  --nh-border-strong:#384654;
  --nh-text:#dbe4ee;
  --nh-heading:#f4f7fa;
  --nh-muted:#91a0b2;
  --nh-blue:#4f9fd0;
  --nh-blue-strong:#2f7fad;
  --nh-blue-soft:#152936;
  --nh-teal:#58b9a1;
  --nh-green:#63b48f;
  --nh-yellow:#d4a64d;
  --nh-red:#de7180;
  --nh-radius:12px;
  --nh-shadow:0 10px 28px rgba(0,0,0,.16);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  min-height:100vh;
  margin:0;
  background:var(--nh-bg);
  color:var(--nh-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  color-scheme:dark;
}
a{color:var(--nh-blue)}
.text-secondary{color:var(--nh-muted)!important}

/* Navigation */
.nh-navbar{
  min-height:68px;
  background:rgba(15,20,26,.96);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--nh-border);
}
.navbar-brand{font-weight:800;color:var(--nh-heading)!important;letter-spacing:-.025em}
.nh-logo{
  width:35px;height:35px;display:grid;place-items:center;border-radius:8px;
  background:#1f6187;color:#f7fbff;font-weight:900;font-size:.88rem;
  border:1px solid #347da4;
}
.navbar .nav-link{color:#a5b2c1;font-weight:600;font-size:.92rem}
.navbar .nav-link:hover{color:var(--nh-heading)}
.nh-xp-badge{display:inline-block;padding:.43rem .72rem;border:1px solid var(--nh-border);border-radius:999px;background:#151c24;color:var(--nh-muted);font-size:.79rem}
.nh-xp-badge span{color:var(--nh-teal);font-weight:800}
.nh-user-btn{border:1px solid var(--nh-border);background:#171e26;color:var(--nh-heading);border-radius:8px;width:38px;height:38px;font-weight:700}

/* Home */
.nh-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--nh-border);background:#11171e}
.nh-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(79,159,208,.035),transparent 48%)}
.nh-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,#315d77,transparent);opacity:.45}
.py-lg-6{padding-top:6rem!important;padding-bottom:6rem!important}
.nh-kicker{display:flex;align-items:center;gap:9px;color:var(--nh-blue);font-size:.71rem;letter-spacing:.105em;font-weight:800;text-transform:uppercase}
.nh-kicker span{width:20px;height:1px;background:#55758a}
.nh-display{letter-spacing:-.047em;line-height:1.01;color:var(--nh-heading)}
.nh-display span{color:#75b5da}
.nh-hero-copy,.nh-lead{color:var(--nh-muted);line-height:1.72}
.nh-hero-copy{max-width:720px}
.nh-proof{font-size:.84rem;color:#7f8fa1}
.nh-btn-primary{background:#2d769f;border-color:#2d769f;color:#fff;font-weight:750;border-radius:9px;padding-left:1.1rem;padding-right:1.1rem}
.nh-btn-primary:hover{background:#3686b2;border-color:#3686b2;color:#fff;transform:none}
.nh-btn-outline{border:1px solid var(--nh-border-strong);background:#171e26;color:#c5d0dc;font-weight:700;border-radius:9px}
.nh-btn-outline:hover{border-color:#536576;background:#1b242e;color:var(--nh-heading)}

/* Terminal: intentionally a little darker than the rest of the interface. */
.nh-terminal-hero,.nh-cli{border:1px solid #273440;border-radius:11px;overflow:hidden;box-shadow:0 12px 28px rgba(0,0,0,.2);background:#0b1016}
.terminal-head,.cli-head{height:42px;background:#151d26;display:flex;align-items:center;padding:0 14px;gap:7px;border-bottom:1px solid #26323e}
.terminal-head i,.cli-head i{width:8px;height:8px;border-radius:50%;background:#667787}
.terminal-head span,.cli-head span{font-size:.71rem;color:#9eacb9;margin-left:6px}
.nh-terminal-hero pre{margin:0;padding:24px;color:#cad5df;min-height:270px;overflow:auto;font-size:.77rem;line-height:1.75}
.prompt{color:#6db6e1}.ok{color:#78c8a3}.warn{color:#d8ad62}.cursor{animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}

/* Cards */
.nh-feature-card,.nh-course-card,.nh-info-card,.nh-concept-box,.nh-scenario,.nh-quick-check,.nh-note,.nh-lab-task,.nh-rail-card,.nh-stat{
  background:var(--nh-surface);
  border:1px solid var(--nh-border);
  border-radius:var(--nh-radius);
  box-shadow:none
}
.nh-feature-card{padding:27px}
.nh-feature-card p,.nh-course-card p,.nh-info-card p,.nh-concept-box p,.nh-rail-card p{color:var(--nh-muted);line-height:1.65}
.nh-feature-no{font-size:.7rem;font-weight:800;color:#708396;letter-spacing:.12em;margin-bottom:22px}
.nh-feature-card h3{font-size:1.18rem;color:var(--nh-heading)}
.nh-course-card{padding:29px}
.nh-course-code{font-size:2rem;font-weight:800;letter-spacing:-.045em;color:#344555}
.nh-badge{background:#173027;border:1px solid #285440;color:#8bc9ae}
.muted-card{opacity:.78}
.nh-progress{height:6px;background:#242f3a;border-radius:99px;overflow:hidden}
.nh-progress .progress-bar{background:#4f9fd0;transition:width .3s ease}
.nh-footer{border-top:1px solid var(--nh-border);background:#0d1218;color:#738397;font-size:.84rem}

/* Course shell */
.nh-course-shell{min-height:calc(100vh - 68px);background:var(--nh-bg)}
.nh-course-sidebar{border-right:1px solid var(--nh-border);background:#11171e;min-height:calc(100vh - 68px)}
.nh-course-sidebar>div{position:sticky;top:68px;max-height:calc(100vh - 68px);overflow:auto}
.nh-lesson-nav{display:flex;flex-direction:column;gap:4px}
.nh-lesson-nav button{display:grid;grid-template-columns:52px minmax(0,1fr) 10px;align-items:center;gap:8px;width:100%;border:0;background:transparent;color:#8999aa;text-align:left;padding:10px;border-radius:8px}
.nh-lesson-nav button:hover{background:#18212a;color:var(--nh-heading)}
.nh-lesson-nav button.active{background:#182936;color:#c8e6f7;font-weight:700;border-left:2px solid var(--nh-blue)}
.nh-lesson-nav button b{font-size:.68rem;color:#718295}
.nh-lesson-nav button i{width:8px;height:8px;border:1px solid #647587;border-radius:50%}
.nh-lesson-nav button.done i{background:#58aa86;border-color:#58aa86;box-shadow:none}
.nh-lesson-area{min-height:calc(100vh - 68px);background:#121820}
.nh-lesson-wrap{max-width:980px;margin:auto;padding:56px 54px 90px}
.nh-lesson{display:none}
.nh-lesson.active{display:block;animation:nhFade .2s ease}@keyframes nhFade{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:none}}
.nh-lesson h1{font-size:clamp(2.35rem,5vw,4.35rem);line-height:1.03;letter-spacing:-.048em;font-weight:800;color:var(--nh-heading);margin:12px 0 22px}
.nh-lead{font-size:1.08rem;max-width:850px}
.nh-accent{color:var(--nh-blue)}

.nh-stat{padding:17px;background:#161e27}
.nh-stat strong{display:block;font-size:1.45rem;color:var(--nh-heading)}
.nh-stat span{color:var(--nh-muted);font-size:.78rem}
.nh-concept-box{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;padding:25px;margin:26px 0;background:#151d25}
.nh-concept-box h3{font-weight:750;margin:.45rem 0;color:var(--nh-heading)}
.nh-topology-mini{display:flex;align-items:center;justify-content:center;min-width:0}
.nh-topology-mini .node{padding:10px 11px;border:1px solid var(--nh-border-strong);background:#1b242e;border-radius:8px;font-size:.72rem;font-weight:750;white-space:nowrap;color:#dce5ee}
.nh-topology-mini .sw{border-color:#386f8b}.nh-topology-mini .rt,.nh-topology-mini .cloud{border-color:#3d7665}
.nh-topology-mini>span{height:1px;width:23px;background:#526171;flex:0 1 23px}
.nh-info-card{padding:22px;background:#171f28}
.nh-info-card .icon{font-size:1.55rem;color:#6aafd4;margin-bottom:13px}
.nh-info-card h4{font-size:1rem;font-weight:750;color:var(--nh-heading)}
.nh-scenario,.nh-quick-check,.nh-lab-task{padding:23px;margin:26px 0}
.nh-scenario{background:#151d25}
.nh-flow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.nh-flow span{background:#1b242e;border:1px solid var(--nh-border);padding:9px 12px;border-radius:8px;font-size:.8rem;color:#b8c5d2}
.nh-flow b{color:#6e8091}
.nh-quick-check button{display:block;width:100%;text-align:left;border:1px solid var(--nh-border);background:#1a232d;color:#c0ccd8;padding:12px 14px;border-radius:8px;margin:9px 0}
.nh-quick-check button:hover{border-color:#496070;background:#1d2833}
.nh-quick-check .feedback{font-weight:750;margin-top:12px}
.nh-objectives{display:grid;gap:0}
.nh-objectives>div{display:grid;grid-template-columns:54px 1fr;gap:10px;padding:17px 5px;border-bottom:1px solid var(--nh-border);align-items:start}
.nh-objectives b{font-size:.72rem;color:#64a9d0}
.nh-objectives span{color:#bbc6d1;line-height:1.6}
.nh-note{color:#b9c9d7;border-color:#2c4658;padding:18px;background:#14232e}
.nh-timeline{margin-left:17px;border-left:1px solid #344250;padding-left:26px}
.nh-timeline>div{display:grid;grid-template-columns:38px 1fr;gap:14px;margin-bottom:22px}
.nh-timeline>div>b{margin-left:-46px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#18212a;border:1px solid var(--nh-border-strong);color:#70b3d8}
.nh-timeline section p{color:var(--nh-muted);margin:0}.nh-timeline h4{font-size:1rem;font-weight:750;color:var(--nh-heading)}

/* Packet Tracer / diagrams */
.nh-pt-window{border:1px solid var(--nh-border);border-radius:11px;overflow:hidden;background:#151c24;box-shadow:var(--nh-shadow)}
.pt-menu,.pt-tray{background:#202a34;padding:12px 15px;font-size:.76rem;color:#9cabb9}
.pt-canvas{min-height:330px;display:flex;align-items:center;justify-content:center;background:linear-gradient(#202a34 1px,transparent 1px),linear-gradient(90deg,#202a34 1px,transparent 1px),#141b22;background-size:28px 28px}
.pt-device{padding:16px 22px;border:1px solid var(--nh-border-strong);border-radius:9px;background:#1b242d;font-weight:750;color:#e0e7ee}
.pt-device.switch{border-color:#437a96}.pt-device.router{border-color:#477b69}.pt-canvas>span{height:1px;width:90px;background:#5c6b78}
.pt-tray{display:flex;gap:10px;flex-wrap:wrap}.pt-tray span{background:#18212a;border:1px solid var(--nh-border);border-radius:7px;padding:7px 10px}
.nh-mode-btn{background:#171e26;color:#99a9b9;border:1px solid var(--nh-border-strong)}
.nh-mode-btn.active{background:#2d769f;border-color:#2d769f;color:#fff}
.nh-mode-view{display:none}.nh-mode-view.active{display:block}
.nh-network-stage{display:flex;align-items:center;justify-content:center;min-height:310px;border:1px solid var(--nh-border);border-radius:11px;background:#141b22}
.stage-node{width:145px;padding:18px 12px;background:#1a232c;border:1px solid var(--nh-border-strong);border-radius:9px;text-align:center;color:#dce5ee}
.stage-node small{display:block;color:var(--nh-muted);font-size:.68rem;margin-top:4px}.stage-node.sw{border-color:#437b98}.stage-node.rt{border-color:#457966}.stage-link{width:110px;height:1px;background:#596976}
.nh-building{position:relative;padding:48px 18px 18px;display:grid;grid-template-columns:1fr 1fr;gap:18px;border:1px solid var(--nh-border);border-radius:11px;background:#151c24}
.building-label{position:absolute;left:18px;top:16px;font-weight:800;color:var(--nh-heading)}
.nh-room{border:1px dashed #4c5c6a;border-radius:9px;padding:16px;color:#9fadb9}
.nh-rack{margin-top:16px;border:1px solid var(--nh-border);border-radius:7px;overflow:hidden}.nh-rack span{display:block;padding:10px;background:#1a232c;border-bottom:1px solid var(--nh-border);font-size:.74rem}.desk{max-width:170px;margin:35px auto;padding:25px 12px;text-align:center;border:1px solid var(--nh-border);background:#1a232c;border-radius:8px}

/* Lab */
.nh-lab-topology{min-height:350px;display:flex;align-items:center;justify-content:center;border:1px solid var(--nh-border);border-radius:11px;background:#141b22}
.nh-lab-topology button{border:1px solid var(--nh-border-strong);background:#1a232c;color:#dbe4ed;border-radius:9px;min-width:110px;padding:14px 10px}
.nh-lab-topology button:hover{background:#202b36}
.nh-lab-topology button b,.nh-lab-topology button small{display:block}.nh-lab-topology button small{font-size:.63rem;color:var(--nh-muted);margin-top:4px}.nh-lab-topology button i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px}.nh-lab-topology i.green{background:#5eb58d}.nh-lab-topology i.amber{background:#d0a34d}.nh-lab-topology>span{height:2px;width:45px}.nh-lab-topology>span.good{background:#667684}.nh-lab-topology>span.bad{background:repeating-linear-gradient(90deg,#ce6877 0 8px,transparent 8px 14px)}
.nh-cli{height:350px;display:flex;flex-direction:column}.cli-output{flex:1;padding:15px;background:#0b1016;color:#d2dbe4;overflow:auto;font:12px/1.6 Consolas,"SFMono-Regular",monospace;white-space:pre-wrap}.cli-output .muted{color:#798a9a}.cli-input{display:grid;grid-template-columns:20px 1fr auto;align-items:center;border-top:1px solid #26323d;padding:10px 12px;background:#10171f;color:#d7e0e8}.cli-input input{background:transparent;border:0;outline:0;color:#fff;font-family:Consolas,monospace}.cli-input button{border:1px solid #3b6e8b;border-radius:7px;background:#1c4f6c;color:#eaf6fd;font-weight:800;padding:7px 10px}.nh-lab-task code{color:#8bc8e6;background:#102431;border:1px solid #244356;padding:2px 6px;border-radius:5px}
.form-select{background-color:#161f28;border-color:var(--nh-border-strong);color:#d5dee7}.form-select:focus{border-color:#5689a8;box-shadow:0 0 0 .2rem rgba(79,159,208,.08)}

/* Quiz */
.nh-question{padding:22px;background:#171f28;border:1px solid var(--nh-border);border-radius:10px}
.nh-question h4{font-size:1rem;line-height:1.55;color:var(--nh-heading)}
.nh-question label{display:block;border:1px solid var(--nh-border);border-radius:8px;padding:11px 12px;margin:8px 0;color:#bcc8d4;cursor:pointer;background:#161e27}
.nh-question label:hover{background:#1c2630}.nh-question.correct{border-color:#3e7b62;background:#14231d}.nh-question.wrong{border-color:#7e4650;background:#24171a}.nh-quiz-result{display:none;padding:20px;border:1px solid var(--nh-border);border-radius:10px;background:#171f28}.nh-quiz-result.show{display:block}

/* Right rail */
.nh-right-rail{border-left:1px solid var(--nh-border);background:#11171e}.rail-sticky{top:68px!important}
.nh-rail-card{padding:18px;margin-bottom:14px;background:#161e27}.nh-rail-card small{color:#6fa3c0;font-size:.67rem;letter-spacing:.08em;text-transform:uppercase;font-weight:800}.nh-rail-card h5{margin:.6rem 0 .2rem;color:var(--nh-heading)}.nh-rail-card p{font-size:.78rem;margin-bottom:0}.nh-ring{width:100px;height:100px;border-radius:50%;display:grid;place-items:center;margin:18px auto;background:conic-gradient(#4f9fd0 0deg,#26313c 0deg);position:relative}.nh-ring:before{content:"";position:absolute;width:77px;height:77px;border-radius:50%;background:#161e27}.nh-ring span{position:relative;font-weight:800;color:var(--nh-heading)}

/* Bootstrap dark harmonisation */
.table{--bs-table-color:#cbd5df;--bs-table-bg:transparent;--bs-table-border-color:#2c3742;--bs-table-striped-color:#cbd5df;--bs-table-striped-bg:#171f28;--bs-table-hover-color:#fff;--bs-table-hover-bg:#1c2630}
.form-check-input{background-color:#141c24;border-color:#526170}.form-check-input:checked{background-color:#3d87b0;border-color:#3d87b0}

@media(max-width:1199.98px){.nh-lesson-wrap{padding:48px 40px 80px}}
@media(max-width:991.98px){.nh-course-sidebar{min-height:auto;border-right:0;border-bottom:1px solid var(--nh-border)}.nh-course-sidebar>div{position:static;max-height:none}.nh-lesson-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.nh-lesson-wrap{padding:38px 24px 70px}.py-lg-6{padding-top:4rem!important;padding-bottom:4rem!important}}
@media(max-width:767.98px){.nh-display{font-size:3.05rem}.nh-concept-box{grid-template-columns:1fr}.nh-topology-mini{justify-content:flex-start;overflow-x:auto;padding-bottom:4px}.nh-network-stage{overflow-x:auto;justify-content:flex-start;padding:20px}.stage-link{min-width:50px}.stage-node{min-width:120px}.nh-building{grid-template-columns:1fr}.nh-lab-topology{overflow-x:auto;justify-content:flex-start;padding:20px}.nh-lab-topology button{min-width:100px}.nh-lab-topology>span{min-width:28px}.nh-flow b{display:none}}
@media(max-width:575.98px){.nh-lesson-nav{grid-template-columns:1fr}.nh-lesson h1{font-size:2.45rem}.nh-lesson-wrap{padding:30px 15px 60px}.nh-display{font-size:2.55rem}.nh-course-card,.nh-feature-card{padding:22px}.pt-canvas>span{width:30px}.pt-device{padding:12px 9px;font-size:.75rem}}