#nhsc-london *,#nhsc-london *::before,#nhsc-london *::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#0d1117;--s1:#161b22;--s2:#1c2230;--s3:#21262d;
  --bd:rgba(255,255,255,0.08);--bd2:rgba(255,255,255,0.15);
  --t1:#e6edf3;--t2:#8b949e;--t3:#484f58;
  --bl:#1f6feb;--bll:#388bfd;--blp:rgba(31,111,235,0.15);
  --gn:#238636;--gnl:#3fb950;--gnp:rgba(35,134,54,0.15);
  --am:#bb8009;--aml:#e3b341;--amp:rgba(187,128,9,0.15);
  --rd:#da3633;--rdl:#f85149;--rdp:rgba(218,54,51,0.15);
  --pu:#8957e5;--pul:#b083f0;--pup:rgba(137,87,229,0.15);
  --fn:'Inter',system-ui,sans-serif;--r:6px;--r2:10px;--r3:16px;
}

#nhsc-london{max-width:1200px;margin:0 auto;padding:24px 16px;background:var(--bg);color:var(--t1);font-family:var(--fn);font-size:14px;line-height:1.5}

/* HERO */
#nhsc-london .hero{background:linear-gradient(135deg,#0d2137,#1a3a5c,#0d2137);border:1px solid rgba(31,111,235,0.3);border-radius:var(--r3);padding:36px 44px;margin-bottom:18px;position:relative;overflow:hidden}

#nhsc-london .hero::after{content:'';position:absolute;bottom:-80px;right:-60px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(56,139,253,.1),transparent 70%)}

#nhsc-london .hi{position:relative;z-index:1}

#nhsc-london .htag{display:inline-flex;align-items:center;gap:6px;background:rgba(56,139,253,.15);border:1px solid rgba(56,139,253,.35);border-radius:20px;padding:4px 13px;font-size:11px;font-weight:600;color:var(--bll);letter-spacing:.05em;text-transform:uppercase;margin-bottom:13px}

#nhsc-london .hdot{width:6px;height:6px;background:#3fb950;border-radius:50%;box-shadow:0 0 6px #3fb950}

#nhsc-london .hero h1{font-size:clamp(22px,3.2vw,36px);font-weight:700;color:#fff;line-height:1.15;margin-bottom:6px}

#nhsc-london .hero p{font-size:13px;color:var(--t2);max-width:520px;line-height:1.65;margin-bottom:16px}

#nhsc-london .pills{display:flex;flex-wrap:wrap;gap:5px}

#nhsc-london .pill{display:flex;align-items:center;gap:4px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:3px 10px;font-size:11px;color:var(--t2)}

#nhsc-london .pok{color:#3fb950;font-size:10px}

/* GEO */
#nhsc-london .geo{background:var(--gnp);border:1px solid rgba(63,185,80,.25);border-radius:var(--r);padding:8px 14px;margin-bottom:14px;font-size:12px;color:var(--gnl);display:none;align-items:center;gap:8px}

#nhsc-london .geo.on{display:flex}

/* REGION BANNER */
#nhsc-london .rbanner{border-radius:var(--r);padding:10px 14px;margin-bottom:14px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:10px;display:none}

#nhsc-london .rbanner.on{display:flex}

#nhsc-london .rbanner.scot{background:rgba(0,94,184,.15);border:1px solid rgba(0,94,184,.3);color:#60a5fa}

#nhsc-london .rbanner.wales{background:rgba(220,20,60,.1);border:1px solid rgba(220,20,60,.25);color:#fca5a5}

#nhsc-london .rbanner.ni{background:rgba(0,120,50,.1);border:1px solid rgba(0,120,50,.25);color:#4ade80}

#nhsc-london .rbanner.lon{background:var(--amp);border:1px solid rgba(187,128,9,.25);color:var(--aml)}

/* LAYOUT */
#nhsc-london .layout{display:grid;grid-template-columns:1fr 385px;gap:16px;align-items:start}

@media(max-width:960px){
#nhsc-london .layout{grid-template-columns:1fr}

}

/* CARD */
#nhsc-london .card{background:var(--s1);border:1px solid var(--bd);border-radius:var(--r2);margin-bottom:12px;overflow:hidden}

#nhsc-london .ch{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--bd)}

#nhsc-london .ci{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}

#nhsc-london .ci-b{background:var(--blp)}
 #nhsc-london .ci-g{background:var(--gnp)}
 #nhsc-london .ci-p{background:var(--pup)}
 #nhsc-london .ci-a{background:var(--amp)}

#nhsc-london .ct{font-size:12px;font-weight:600;color:var(--t1)}

#nhsc-london .cb{padding:14px 16px}

/* LABEL */
#nhsc-london .lbl{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:600;color:var(--t3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px}

#nhsc-london .tag{font-size:9px;padding:2px 6px;border-radius:10px;font-weight:600;text-transform:none;letter-spacing:0}

#nhsc-london .tg-y{background:var(--gnp);color:var(--gnl)}
 #nhsc-london .tg-n{background:var(--amp);color:var(--aml)}

/* BAND */
#nhsc-london .bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(55px,1fr));gap:5px;margin-bottom:12px}

#nhsc-london .bb{background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:8px 3px;font:600 11px/1.3 var(--fn);color:var(--t2);cursor:pointer;text-align:center;transition:.15s}

#nhsc-london .bb:hover{border-color:var(--bl);color:var(--bll);background:var(--blp)}

#nhsc-london .bb.on{background:var(--bl);border-color:var(--bl);color:#fff;box-shadow:0 0 0 3px rgba(31,111,235,.25)}

#nhsc-london .bb small{display:block;font-size:9px;opacity:.6;margin-top:1px}

/* PAY STEPS */
#nhsc-london .stabs{display:flex;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:3px;gap:3px;margin-bottom:12px}

#nhsc-london .stab{flex:1;padding:7px 4px;background:transparent;border:none;border-radius:5px;font:600 11px/1.3 var(--fn);color:var(--t2);cursor:pointer;text-align:center;transition:.15s}

#nhsc-london .stab:hover{background:var(--s3);color:var(--t1)}

#nhsc-london .stab.on{background:var(--s3);color:var(--bll);box-shadow:0 1px 3px rgba(0,0,0,.3)}

#nhsc-london .stab-s{display:block;font-size:10px;font-weight:700;color:var(--gnl);margin-top:2px}

/* INPUT */
#nhsc-london .fld{margin-bottom:10px}

#nhsc-london .iw{position:relative}

#nhsc-london .ipx{position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:600;color:var(--t3);pointer-events:none}

#nhsc-london .inp{width:100%;height:38px;padding:0 10px;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);font:500 13px var(--fn);color:var(--t1);outline:none;transition:border-color .15s;-webkit-appearance:none}

#nhsc-london .inp:focus{border-color:var(--bl)}

#nhsc-london .iw .inp{padding-left:22px}

#nhsc-london .hint{font-size:10px;color:var(--t3);margin-top:3px}

#nhsc-london select.inp{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23484f58'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}

/* REGION */
#nhsc-london .rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:5px;margin-bottom:8px}

#nhsc-london .rb{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);font:600 10px var(--fn);color:var(--t2);cursor:pointer;transition:.15s;text-align:center}

#nhsc-london .rb:hover{border-color:var(--bl);color:var(--bll);background:var(--blp)}

#nhsc-london .rb.on{background:var(--blp);border-color:var(--bll);color:var(--bll)}

#nhsc-london .rflag{font-size:15px}

/* TOGGLE */
#nhsc-london .trow{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--bd)}

#nhsc-london .trow:last-child{border-bottom:none;padding-bottom:0}

#nhsc-london .tinfo strong{font-size:12px;font-weight:600;color:var(--t1);display:block}

#nhsc-london .tinfo span{font-size:10px;color:var(--t3)}

#nhsc-london .tog{position:relative;width:38px;height:20px;flex-shrink:0;margin-left:10px}

#nhsc-london .tog input{opacity:0;width:0;height:0}

#nhsc-london .tsl{position:absolute;inset:0;background:var(--s3);border:1px solid var(--bd2);border-radius:10px;cursor:pointer;transition:.2s}

#nhsc-london .tsl::before{content:'';position:absolute;width:14px;height:14px;left:2px;top:2px;background:var(--t3);border-radius:50%;transition:.2s}

#nhsc-london .tog input:checked+.tsl{background:var(--bl);border-color:var(--bl)}

#nhsc-london .tog input:checked+.tsl::before{transform:translateX(18px);background:#fff}

/* PRESETS */
#nhsc-london .prow{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:6px}

#nhsc-london .pb{padding:4px 9px;background:var(--s2);border:1px solid var(--bd);border-radius:10px;font:600 10px var(--fn);color:var(--t2);cursor:pointer;transition:.15s}

#nhsc-london .pb:hover{border-color:var(--gnl);color:var(--gnl)}

#nhsc-london .pb.on{background:var(--gnp);border-color:var(--gnl);color:var(--gnl)}

/* LOAN */
#nhsc-london .lgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:10px}

#nhsc-london .lb{padding:7px 3px;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);font:700 10px var(--fn);color:var(--t2);cursor:pointer;transition:.15s;text-align:center}

#nhsc-london .lb small{display:block;font-size:8px;font-weight:500;color:var(--t3);margin-top:2px}

#nhsc-london .lb:hover{border-color:var(--gnl);color:var(--gnl)}

#nhsc-london .lb.on{background:var(--gnp);border-color:var(--gnl);color:var(--gnl)}

/* MONTHS */
#nhsc-london .mgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-bottom:8px}

#nhsc-london .mb{padding:5px 2px;background:var(--s2);border:1px solid var(--bd);border-radius:6px;font:700 9px var(--fn);color:var(--t3);cursor:pointer;transition:.15s;text-align:center}

#nhsc-london .mb:hover{border-color:var(--bl);color:var(--bll)}

#nhsc-london .mb.on{background:var(--blp);border-color:var(--bll);color:var(--bll)}

/* INFO */
#nhsc-london .ib{border-radius:var(--r);padding:8px 10px;font-size:11px;line-height:1.6;display:flex;gap:7px;align-items:flex-start;margin:7px 0}

#nhsc-london .ib.w{background:var(--amp);border:1px solid rgba(187,128,9,.25);color:var(--aml)}

#nhsc-london .ib.i{background:var(--blp);border:1px solid rgba(31,111,235,.25);color:var(--bll)}

#nhsc-london .ib.ok{background:var(--gnp);border:1px solid rgba(63,185,80,.25);color:var(--gnl)}

#nhsc-london .ib strong{color:inherit}

#nhsc-london .dv{height:1px;background:var(--bd);margin:10px 0}

/* RESULTS */
#nhsc-london .res{background:var(--s1);border:1px solid var(--bd);border-radius:var(--r2);position:sticky;top:16px;overflow:hidden}

#nhsc-london .rtop{padding:24px 20px;text-align:center;background:linear-gradient(160deg,#071a0d,#0d2818);position:relative;overflow:hidden}

#nhsc-london .rtop::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 120%,rgba(35,134,54,.25),transparent 70%)}

#nhsc-london .rlbl{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(63,185,80,.5);margin-bottom:4px;position:relative}

#nhsc-london .ramt{font-size:50px;font-weight:700;color:#fff;line-height:1;letter-spacing:-2px;position:relative}

#nhsc-london .ramt sup{font-size:22px;font-weight:700;vertical-align:super;letter-spacing:0}

#nhsc-london .rsub{font-size:12px;color:rgba(63,185,80,.6);margin-top:4px;position:relative}

#nhsc-london .rsub strong{color:rgba(63,185,80,.9)}

/* BREAKDOWN */
#nhsc-london .bkd{padding:14px 16px}

#nhsc-london .bkdh{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t3);margin-bottom:6px}

#nhsc-london .brow{display:flex;align-items:center;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--bd)}

#nhsc-london .brow:last-child{border-bottom:none}

#nhsc-london .bl2{display:flex;align-items:center;gap:6px;color:var(--t2);font-size:11px;font-weight:500}

#nhsc-london .d{width:6px;height:6px;border-radius:50%;flex-shrink:0}

#nhsc-london .dgn{background:var(--gnl)}
 #nhsc-london .dbl{background:var(--bll)}
 #nhsc-london .dam{background:var(--aml)}

#nhsc-london .drd{background:var(--rdl)}
 #nhsc-london .dpu{background:var(--pul)}
 #nhsc-london .dgr{background:var(--t3)}

#nhsc-london .bv{font-size:11px;font-weight:700;color:var(--t1);font-feature-settings:"tnum"}

#nhsc-london .bvd{color:var(--rdl)}
 #nhsc-london .bva{color:var(--gnl)}

#nhsc-london .tbdg{display:inline-flex;align-items:center;background:var(--pup);color:#b083f0;border-radius:10px;padding:1px 6px;font-size:9px;font-weight:700;margin-left:4px}

#nhsc-london .tot{background:var(--blp);border:1px solid rgba(31,111,235,.2);border-radius:var(--r);padding:9px 12px;display:flex;justify-content:space-between;align-items:center;margin:6px 0}

#nhsc-london .tot span{font-size:11px;font-weight:600;color:var(--bll)}

#nhsc-london .tot strong{font-size:13px;font-weight:700;color:#fff}

/* RATE BAR */
#nhsc-london .rbar{padding:10px 16px 12px;border-top:1px solid var(--bd)}

#nhsc-london .rbrt{display:flex;justify-content:space-between;font-size:10px;font-weight:600;color:var(--t3);margin-bottom:5px}

#nhsc-london .rbrk{height:4px;background:var(--s3);border-radius:10px;overflow:hidden}

#nhsc-london .rbrf{height:100%;border-radius:10px;background:linear-gradient(90deg,var(--gnl),var(--aml) 55%,var(--rdl));transition:width .4s ease}

/* EMPLOYER */
#nhsc-london .empb{background:var(--pup);border:1px solid rgba(137,87,229,.2);border-radius:var(--r);padding:9px 12px;margin:0 16px 12px}

#nhsc-london .empr{display:flex;justify-content:space-between;align-items:center}

#nhsc-london .empl{font-size:11px;font-weight:600;color:#b083f0}

#nhsc-london .empv{font-size:13px;font-weight:700;color:#b083f0}

#nhsc-london .emps{font-size:10px;color:rgba(176,131,240,.45);margin-top:3px;line-height:1.5}

#nhsc-london .disc{padding:10px 16px;border-top:1px solid var(--bd);font-size:10px;color:var(--t3);line-height:1.6}

/* PENSION TABLE */
#nhsc-london .ptbl{background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:10px;margin-top:10px}

#nhsc-london .ptbl table{width:100%;border-collapse:collapse;font-size:10px}

#nhsc-london .ptbl td{padding:4px 5px;color:var(--t3);border-bottom:1px solid var(--bd)}

#nhsc-london .ptbl td:last-child{text-align:right;color:var(--t2);font-weight:700}

#nhsc-london .ptbl tr:last-child td{border-bottom:none}

#nhsc-london .ptbl .hl td{background:rgba(187,128,9,.08)}

@media(max-width:640px){
#nhsc-london .hero{padding:24px 20px}
#nhsc-london .bgrid{grid-template-columns:repeat(5,1fr)}
#nhsc-london .mgrid{grid-template-columns:repeat(4,1fr)}
#nhsc-london .rgrid{grid-template-columns:repeat(3,1fr)}

}

@keyframes up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

#nhsc-london{animation:up .3s ease-out}