/* Resource Centre: index and programme pages. Builds on tokens, base and the shared drawing styles in home.css. */

/* D8 drawing extras */
.ns-bk{fill:var(--ns-ink)}
.ns-bk-o{fill:var(--ns-ochre)}
.ns-bk-v{fill:var(--ns-verdigris)}
.ns-lamp{fill:var(--ns-ink)}
.ns-glow{fill:var(--ns-ochre);opacity:.12}
.ns-plant{fill:#5E8F4E;stroke:#5E8F4E;stroke-width:2}
.ns-d8{display:block;width:100%;height:auto}

/* breadcrumb */
.ns-crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.ns-crumbs li+li::before{content:"/";margin-right:6px;color:var(--ns-survey)}
.ns-crumbs a{color:var(--ns-ink-2);text-decoration:none;border-bottom:1px solid var(--ns-rule)}
.ns-crumbs a:hover{color:var(--ns-redline);border-color:currentColor}
.ns-crumbs [aria-current]{color:var(--ns-ink)}

/* index header */
.ns-rc-head{padding-block:var(--ns-s6) var(--ns-s6)}
.ns-rc-title{margin-top:var(--ns-s6);container-type:inline-size}
.ns-rc-h1{margin:0;font-family:var(--ns-f-display);font-weight:800;font-stretch:82%;letter-spacing:-.035em;line-height:.9;font-size:min(var(--ns-t-d1),calc(100cqi / 6.6))}
.ns-rc-line{margin:var(--ns-s3) 0 0;font-family:var(--ns-f-display);font-weight:700;font-stretch:90%;font-size:clamp(1.25rem,1rem + 1.4vw,2.25rem);letter-spacing:-.015em;line-height:1.1}
.ns-rc-line::after{content:"";display:block;width:3.2em;height:.12em;margin-top:.3em;background:var(--ns-redline);transform:skewX(-14deg);transform-origin:left}
.ns-rc-lead{margin-top:var(--ns-s5);max-width:52ch}
/* desktop: title on the left, lead on the right, level with the bottom of the title block */
@media (min-width:1024px){
  .ns-rc-top{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--ns-gutter);align-items:end}
  .ns-rc-top .ns-rc-title{grid-column:1 / 8}
  .ns-rc-top .ns-rc-lead{grid-column:8 / 13;margin:0}
}
.ns-rc-fig{margin:var(--ns-s6) 0 0}

/* ---------- programme editions on the index ----------
   Each programme is one horizontal band, read top to bottom: its drawing, then its name and summary, then its formats.
   Bands are stacked and separated by ink rules, so the eye never has to jump across columns to another programme. */
.ns-eds{margin-top:var(--ns-s6);border-bottom:1px solid var(--ns-ink)}
.ns-ed{display:grid;gap:var(--ns-s4) var(--ns-s6);padding:var(--ns-s6) 0;border-top:1px solid var(--ns-ink);grid-template-areas:"fig" "text" "rows"}
.ns-ed-fig{grid-area:fig;background:var(--ns-paper);border:1px solid var(--ns-rule);padding:var(--ns-s3);aspect-ratio:16 / 10;display:flex;align-items:center}
.ns-ed-fig .ns-d8{width:100%;height:100%}
.ns-ed-text{grid-area:text}
.ns-ed .ns-h3{margin:0}
.ns-ed .ns-body{margin:var(--ns-s2) 0 0}
.ns-ed-rows{grid-area:rows;list-style:none;margin:0;padding:0;border-top:1px solid var(--ns-rule);align-self:start}
.ns-ed-row{display:grid;grid-template-columns:1fr auto;grid-template-areas:"dur view" "sched sched" "prices prices";column-gap:var(--ns-s4);padding:var(--ns-s4) 0;border-bottom:1px solid var(--ns-rule);font-variant-numeric:tabular-nums lining-nums}
.ns-ed-row:last-child{border-bottom:0}
.ns-ed-dur{grid-area:dur;margin:0;font-family:var(--ns-f-display);font-weight:700;font-stretch:94%;font-size:1.25rem;line-height:1.1}
.ns-ed-sched{grid-area:sched;margin:4px 0 var(--ns-s3);font-size:.8125rem;color:var(--ns-ink-2)}
.ns-ed-link{grid-area:view;align-self:baseline;justify-self:end;white-space:nowrap;font-family:var(--ns-f-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ns-ink-2);text-decoration:none;border-bottom:1px solid var(--ns-rule);padding-bottom:2px}
.ns-ed-link:hover,.ns-ed-link:focus-visible{color:var(--ns-redline);border-color:currentColor}
@media (min-width:768px){
  .ns-ed{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-areas:"fig text" "fig rows";align-items:start}
}
@media (min-width:1024px){
  .ns-ed{grid-template-columns:minmax(0,4fr) minmax(0,3fr) minmax(0,5fr);grid-template-areas:"fig text rows";column-gap:var(--ns-s6)}
  .ns-ed-rows{border-top:0}
  .ns-ed-row:first-child{padding-top:0}
}

/* prices: US dollars leads in ink; pounds and naira follow close by, smaller and in grey, all on one baseline */
.ns-ed-prices,.ns-prog-prices{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px var(--ns-s4)}
.ns-ed-prices{grid-area:prices}
.ns-ed-price,.ns-prog-prices p{margin:0}
.ns-ed-price b,.ns-prog-prices b{font-family:var(--ns-f-display);font-weight:800;font-stretch:88%;letter-spacing:-.02em;line-height:1}
.ns-ed-price b{font-size:1.5rem}
.ns-prog-prices b{font-size:2.25rem}
.ns-cur-alt b{color:var(--ns-ink-2);font-weight:600;font-stretch:92%;letter-spacing:-.005em}
.ns-ed-price.ns-cur-alt b{font-size:1rem}
.ns-prog-prices .ns-cur-alt b{font-size:1.125rem}
.ns-prog-prices{padding-bottom:var(--ns-s4);border-bottom:1px solid var(--ns-rule)}
.ns-rc-note{margin-top:var(--ns-s5)}

/* how enrolment works */
.ns-steps3{list-style:none;margin:var(--ns-s6) 0 0;padding:0;display:grid;gap:var(--ns-s5)}
@media (min-width:768px){.ns-steps3{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ns-gutter)}}
.ns-steps3 li{border-left:1px solid var(--ns-ink);padding:0 0 0 var(--ns-s4)}
.ns-steps3 .ns-h3{margin:var(--ns-s3) 0 var(--ns-s2);max-width:20ch}
.ns-steps3 .ns-body{margin:0}

/* closing band */
.ns-rc-help-body{display:grid;gap:var(--ns-s5);margin-top:var(--ns-s5);align-items:end}
@media (min-width:1024px){.ns-rc-help-body{grid-template-columns:7fr 5fr}.ns-rc-help-body > :last-child{justify-self:end}}
.ns-rc-help-body .ns-lead{margin:0}
.ns-rc-help-actions{display:flex;flex-wrap:wrap;gap:var(--ns-s3)}

/* programme page */
.ns-prog-head{padding-block:var(--ns-s6) var(--ns-s7)}
.ns-prog-grid{display:grid;gap:var(--ns-s6);margin-top:var(--ns-s6);align-items:start}
@media (min-width:1024px){.ns-prog-grid .ns-prog-fig{margin-top:var(--ns-s6)}.ns-prog-grid{grid-template-columns:7fr 5fr;column-gap:var(--ns-s8);row-gap:0}.ns-prog-main{grid-column:1;grid-row:1}.ns-prog-card{grid-column:2;grid-row:1 / span 2;position:sticky;top:88px}.ns-prog-fig{grid-column:1;grid-row:2}}
.ns-prog-main > .ns-ann{margin:0 0 var(--ns-s3)}
.ns-prog-h1{margin:0 0 var(--ns-s5);font-family:var(--ns-f-display);font-weight:800;font-stretch:84%;letter-spacing:-.03em;line-height:.95;font-size:clamp(2.4rem,1.4rem + 4vw,5rem)}
.ns-prog-dur{display:block;margin-top:.15em;font-weight:700;font-stretch:90%;font-size:.5em;letter-spacing:-.015em;color:var(--ns-ink-2)}
.ns-prog-main .ns-lead{margin:0 0 var(--ns-s4)}
.ns-prog-main .ns-body strong{color:var(--ns-ink)}
.ns-alt{margin-top:var(--ns-s5);border-top:1px solid var(--ns-rule);padding-top:var(--ns-s3)}
.ns-alt ul{list-style:none;margin:var(--ns-s2) 0 0;padding:0}
.ns-alt a,.ns-others a{display:flex;justify-content:space-between;align-items:baseline;gap:var(--ns-s4);padding:var(--ns-s3) 0;border-bottom:1px solid var(--ns-rule);text-decoration:none;color:var(--ns-ink);font-weight:600}
.ns-alt a:hover,.ns-others a:hover{color:var(--ns-redline)}
.ns-prog-card{border:1px solid var(--ns-ink);background:var(--ns-sheet);padding:var(--ns-s5)}
.ns-prog-dl{margin:var(--ns-s4) 0 var(--ns-s5);display:grid;gap:var(--ns-s3)}
.ns-prog-dl div{display:grid;grid-template-columns:7.5em 1fr;gap:var(--ns-s3)}
.ns-prog-dl dt{padding-top:.2em}
.ns-prog-dl dd{margin:0;font-size:.9375rem}
.ns-prog-cta{width:100%;justify-content:center}
.ns-prog-fine{margin:var(--ns-s3) 0 0;font-size:.625rem}
.ns-prog-fig{margin:0;border:1px solid var(--ns-rule);padding:var(--ns-s4)}
.ns-faq-wrap .ns-faqs{margin-top:var(--ns-s5);max-width:860px}
.ns-faq{border-bottom:1px solid var(--ns-rule)}
.ns-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--ns-s4);padding:var(--ns-s4) 0}
.ns-faq summary::-webkit-details-marker{display:none}
.ns-faq summary::after{content:"+";font-family:var(--ns-f-mono);font-size:1.25rem;color:var(--ns-ink-2);transition:transform var(--ns-ui) var(--ns-ease)}
.ns-faq[open] summary::after{transform:rotate(45deg);color:var(--ns-redline)}
.ns-faq summary .ns-h3{font-size:clamp(1.1rem,1rem + .4vw,1.35rem)}
.ns-faq summary:hover .ns-h3{color:var(--ns-redline)}
.ns-faq .ns-body{margin:0 0 var(--ns-s5)}
.ns-others{list-style:none;margin:var(--ns-s5) 0 0;padding:0;display:grid;gap:0 var(--ns-gutter)}
@media (min-width:768px){.ns-others{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Resource Centre lead set a step smaller than the standard lead */
.ns-rc-lead{font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.55}
/* wide desktop: the lead block moves in from the left and sits flush with the right margin,
   at a width (432px, 4 lines at 18px) where every line naturally runs to within a few pixels of the edge */
/* wide desktop: the lead block moves in from the left and sits flush with the right margin, at a width
   (452px, three lines at 18px) where every line runs to within about 20px of the edge and no word is left alone */
@media (min-width:1280px){.ns-rc-top .ns-rc-lead{justify-self:end;width:452px;max-width:none}}
/* desktop: the lead's last line sits on the same baseline as "Knowledge to understand. Tools to build." */
@media (min-width:1024px){.ns-rc-top{align-items:last baseline}}


/* ---------- reading-room scene (Resource Centre header, rc-scene.js, motion on only) ---------- */
.sc-only{display:none}
.sc-on .sc-only{display:inline}
.sc-cat-f{fill:var(--ns-ink)}
.sc-cat-s{fill:none;stroke:var(--ns-ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sc-cat-hf{fill:var(--ns-paper);stroke:var(--ns-paper);stroke-width:3;stroke-linejoin:round}
.sc-cat-hs{fill:none;stroke:var(--ns-paper);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.sc-legf-h{fill:none;stroke:var(--ns-paper);stroke-width:5}

/* fee card: USD leads; GBP and NGN sit in two ruled boxes beneath, each a fixed fee in its own currency */
.ns-prog-card .ns-prog-prices{display:block;padding-bottom:var(--ns-s4)}
.ns-prog-prices > .ns-ann{margin:0 0 var(--ns-s2)}
.ns-prog-prices .ns-fee-main{display:flex;align-items:baseline;gap:var(--ns-s2);margin:0 0 var(--ns-s4)}
.ns-prog-prices .ns-fee-main b{font-size:2.5rem}
.ns-fee-alts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ns-s2)}
.ns-fee-alts li{display:grid;gap:6px;padding:var(--ns-s3) var(--ns-s4);border:1px solid var(--ns-rule);background:var(--ns-paper)}
.ns-prog-prices .ns-fee-alts b{font-size:1.375rem;color:var(--ns-ink)}
.ns-fee-note{margin:var(--ns-s3) 0 0;font-size:.8125rem;line-height:1.5;color:var(--ns-ink-2)}
.ns-prog-actions{display:grid;gap:var(--ns-s3)}

/* enrolment */
@media (min-width:600px){.ns-cur-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ns-cur-grid .ns-route-t{font-size:1.5rem;font-weight:800;font-stretch:88%;letter-spacing:-.02em}
.ns-en-cur-note{margin-top:var(--ns-s3)}
.ns-consent{margin-top:var(--ns-s5)}
.ns-consent.is-bad label{color:var(--ns-ink)}
.ns-en-sum .ns-en-name{margin:var(--ns-s2) 0 0}
.ns-en-small{margin:var(--ns-s3) 0 0;font-size:.8125rem;line-height:1.5;color:var(--ns-ink-2)}
.ns-en-small a{color:var(--ns-ink)}
.ns-en-done{max-width:760px}
.ns-en-box{border-top:1px solid var(--ns-ink);padding-top:var(--ns-s5)}
.ns-en-box > .ns-ann{margin:0 0 var(--ns-s3)}
.ns-en-box .ns-lead{margin:0 0 var(--ns-s5)}
.ns-en-next{margin:0 0 var(--ns-s6);padding-left:1.1em;display:grid;gap:var(--ns-s2);line-height:1.55}
.ns-en-list{list-style:none;margin:0 0 var(--ns-s5);padding:0;display:grid}
.ns-en-list li{display:grid;gap:var(--ns-s2);justify-items:start;padding-block:var(--ns-s5);border-top:1px solid var(--ns-rule)}
.ns-en-list .ns-h3{margin:0}
.ns-en-list .ns-ann{margin:0 0 var(--ns-s2)}
/* WhatsApp lines and the Telegram steps (30 Oct 2026) */
.ns-wa{margin-top:var(--ns-s5);padding-top:var(--ns-s4);border-top:1px solid var(--ns-rule)}
.ns-wa>.ns-ann{margin:0 0 var(--ns-s2)}
.ns-wa ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--ns-s2) var(--ns-s5)}
.ns-wa li a{display:inline-flex;align-items:baseline;gap:var(--ns-s2);color:inherit;font-weight:600}
.ns-wa li a .ns-ann{font-weight:400;text-decoration:none}
.ns-wa-ch{margin:var(--ns-s3) 0 0}
.ns-tg-steps{list-style:none;margin:0 0 var(--ns-s5);padding:0;display:grid}
.ns-tg-steps li{display:grid;grid-template-columns:2.5rem 1fr;gap:var(--ns-s2);padding-block:var(--ns-s3);border-top:1px solid var(--ns-rule);line-height:1.55}
.ns-tg-steps li:last-child{border-bottom:1px solid var(--ns-rule)}
.ns-ct-note{margin:var(--ns-s2) 0 0;font-size:.8125rem;line-height:1.5;color:var(--ns-ink-2)}
.ns-ct-note a{color:var(--ns-ink)}
.ns-rc-help-body>.ns-wa{grid-column:1/-1;justify-self:stretch;margin-top:0}
.ns-wa li a{text-decoration:none}
.ns-wa li a span:first-child{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.ns-wa li a:hover span:first-child,.ns-wa li a:focus-visible span:first-child{text-decoration-thickness:2px}

/* free practice test band on programme pages (30 Oct 2026) */
.ns-pt-try{display:grid;gap:var(--ns-s5);margin-top:var(--ns-s5);align-items:end}
.ns-pt-try .ns-lead{margin:0;max-width:56ch}
.ns-pt-try .ns-btn{justify-self:start}
@media (min-width:1024px){.ns-pt-try{grid-template-columns:7fr 5fr}.ns-pt-try .ns-btn{justify-self:end}}
@media (min-width:1024px){.ns-prog-h1--long{font-size:clamp(2.4rem,1rem + 3vw,3.75rem)}}

/* 31 Oct 2026, owner's review */
/* programme write-ups run edge to edge between their margins */
.ns-ed .ns-body{text-align:justify;-webkit-hyphens:auto;hyphens:auto}
/* programme rows react as the homepage ledger did: the whole row opens the page and turns red;
   View programme turns green, and hovering it fills it */
.ns-ed-row{position:relative}
.ns-ed-row,.ns-ed-row .ns-ed-sched,.ns-ed-row b,.ns-ed-link{transition:color var(--ns-ui) var(--ns-ease),background-color var(--ns-ui) var(--ns-ease),border-color var(--ns-ui) var(--ns-ease)}
.ns-ed-link::after{content:"";position:absolute;inset:0}
.ns-ed-row:hover,.ns-ed-row:focus-within{--ns-tint:color-mix(in srgb,var(--ns-ink) 4%,transparent);background:var(--ns-tint);box-shadow:-12px 0 0 var(--ns-tint),12px 0 0 var(--ns-tint)}
.ns-ed-row:hover,.ns-ed-row:hover .ns-ed-sched,.ns-ed-row:hover b,.ns-ed-row:focus-within,.ns-ed-row:focus-within .ns-ed-sched,.ns-ed-row:focus-within b{color:var(--ns-redline)}
.ns-ed-row:hover .ns-ed-link,.ns-ed-row:focus-within .ns-ed-link{color:var(--ns-verdigris);border-color:currentColor}
.ns-ed-link-t{position:relative;z-index:1;padding:2px 4px;margin:-2px -4px;transition:background-color var(--ns-ui) var(--ns-ease),color var(--ns-ui) var(--ns-ease)}
.ns-ed-row .ns-ed-link-t:hover,.ns-ed-link:focus-visible .ns-ed-link-t{background:var(--ns-ink);color:var(--ns-paper)}
/* price card: each label sits on the baseline of its value */
.ns-prog-dl div{align-items:baseline}
.ns-prog-dl dt{padding-top:0}
/* buttons rest on the baseline of the last line of text beside them */
@media (min-width:1024px){#practice-tests .ns-rc-help-actions,.ns-pt-try .ns-btn{margin-bottom:7px}}

/* Resource Centre rows: pay or enquire beside the prices (31 Oct 2026) */
.ns-ed-row{grid-template-areas:"dur view" "sched sched" "prices cta";align-items:center}
.ns-ed-dur,.ns-ed-link{align-self:baseline}
.ns-ed-cta{grid-area:cta;justify-self:end;position:relative;z-index:1;padding:9px 16px;font-size:.875rem;white-space:nowrap}
@media (max-width:479px){.ns-ed-row{grid-template-areas:"dur view" "sched sched" "prices prices" "cta cta"}.ns-ed-cta{justify-self:stretch;justify-content:center;text-align:center;margin-top:var(--ns-s3)}}

/* Notice, last programme of the year, and programmes not open for enrolment (November 2026) */
.ns-notice{margin-top:var(--ns-s6);padding:var(--ns-s5);background:var(--ns-deep);border-left:4px solid #E8673F;color:#ECEDE6}
.ns-notice-k{margin:0;font-family:var(--ns-f-display);font-weight:800;font-stretch:82%;font-size:clamp(2.25rem,1.5rem + 2.6vw,3.5rem);line-height:.9;letter-spacing:-.02em;text-transform:uppercase;color:#E8673F}
.ns-notice-h{margin:var(--ns-s3) 0 0;font-family:var(--ns-f-display);font-weight:750;font-stretch:88%;font-size:clamp(1.35rem,1.1rem + .9vw,1.75rem);line-height:1.1;color:#ECEDE6;text-wrap:balance}
.ns-notice .ns-body{margin:var(--ns-s3) 0 0;max-width:62ch;color:#C9CED0}
.ns-notice--prog{margin:var(--ns-s5) 0 0}
.ns-eds-label{margin:var(--ns-s7) 0 0;color:#C2401F}
.ns-eds-final{margin-top:var(--ns-s3)}
.ns-eds-off-h{margin-top:var(--ns-s8);padding-top:var(--ns-s4);border-top:1px dashed var(--ns-survey)}
.ns-eds-off-h .ns-ann{margin:0}
.ns-eds-off-h .ns-body{margin:var(--ns-s2) 0 0;color:var(--ns-ink-2)}
.ns-eds-off{margin-top:var(--ns-s4);opacity:.4;filter:grayscale(1);pointer-events:none;user-select:none}
.ns-eds-off .ns-ed-link,.ns-eds-off .ns-ed-cta{visibility:hidden}
.ns-en-bal{margin-top:var(--ns-s5);padding-top:var(--ns-s4);border-top:1px solid var(--ns-rule)}
.ns-routes-pick + .ns-routes-pick{margin-top:var(--ns-s6)}

/* Pay in full or half: what each includes */
.ns-plan-cmp{display:grid;gap:var(--ns-s4);margin-top:var(--ns-s4)}
@media (min-width:640px){.ns-plan-cmp{grid-template-columns:1fr 1fr}}
.ns-plan-cmp>div{border-top:1px solid var(--ns-ink);padding-top:var(--ns-s3)}
.ns-plan-cmp .ns-ann{margin:0 0 var(--ns-s2)}
.ns-plan-cmp ul{list-style:none;margin:0;padding:0}
.ns-plan-cmp li{position:relative;padding:4px 0 4px 22px;font-size:.9375rem;line-height:1.45}
.ns-plan-cmp li::before{content:"";position:absolute;left:2px;top:.62em;width:10px;height:5px;border-left:2px solid var(--ns-verdigris);border-bottom:2px solid var(--ns-verdigris);transform:rotate(-45deg)}
.ns-plan-cmp .ns-hint{margin-top:var(--ns-s3)}
.ns-plan-cmp--page{margin-top:var(--ns-s5)}