:root { --ink:#123d5c; --deep:#073a61; --paper:#f7fbff; --gold:#f9c900; --coral:#7dc928; --mist:#e3f2fb; --white:#ffffff; --line:rgba(7,58,97,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; }
.skip-link { position:absolute; left:-999px; top:0; background:var(--gold); padding:.7rem 1rem; z-index:3; }
.skip-link:focus { left:1rem; }
.site-header { position:fixed; z-index:10; inset:0 auto 0 0; width:238px; padding:2rem 1.4rem; display:flex; flex-direction:column; align-items:flex-start; gap:2.7rem; background:var(--deep); color:var(--white); border-right:1px solid rgba(255,255,255,.14); }
.brand { display:flex; align-items:center; gap:.7rem; text-decoration:none; font-size:.8rem; line-height:1.08; letter-spacing:.01em; }
.brand strong { font-size:1rem; }
.brand-mark { width:9rem; height:9rem; display:block; flex:none; overflow:hidden; background:transparent url("images/NST-HUB.png") center / contain no-repeat; color:transparent; }
.brand > span:last-child { display:none; }
nav { width:100%; display:flex; flex-direction:column; align-items:stretch; gap:.25rem; font-size:.9rem; font-weight:700; }
nav a { padding:.7rem .75rem; text-decoration:none; border-radius:.25rem; }
nav a:not(.nav-contact):hover, nav a:not(.nav-contact):focus-visible { background:rgba(255,255,255,.1); }.text-link:hover { text-decoration:underline; text-underline-offset:.3rem; }
nav a[aria-current="page"]:not(.nav-contact) { background:rgba(255,255,255,.17); }
.nav-contact { margin-top:.8rem; background:var(--gold); color:var(--deep); text-align:center; padding:.75rem .95rem; border-radius:100px; }
.sidebar-note { margin:auto 0 0; color:rgba(255,255,255,.7); font-size:.76rem; line-height:1.5; }
main, footer { margin-left:238px; }
.hero { max-width:1400px; min-height:580px; margin:auto; padding:clamp(3rem,8vw,7.7rem) clamp(1.25rem,8vw,9rem) clamp(3rem,6vw,6rem); display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); align-items:center; gap:4rem; }
.eyebrow { margin:0 0 1rem; font-family:monospace; text-transform:uppercase; font-size:.71rem; letter-spacing:.1em; font-weight:500; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:Georgia,serif; line-height:1.04; letter-spacing:-.035em; }
h1 { max-width:670px; margin-bottom:1.3rem; font-size:clamp(3rem,5.5vw,5.5rem); font-weight:600; }
h2 { font-size:clamp(2.15rem,4vw,4rem); font-weight:600; }
h3 { font-size:1.3rem; line-height:1.2; letter-spacing:-.025em; }
.hero-intro { max-width:565px; font-size:1.08rem; }
.hero-brand { margin:0 0 .3rem; font-family:Arial,sans-serif; font-size:clamp(1.3rem,2.6vw,2rem); font-weight:800; letter-spacing:.035em; text-transform:uppercase; line-height:1.1; }.hero-brand span:nth-child(1) { color:#2895d3; }.hero-brand span:nth-child(2) { color:var(--gold); }.hero-brand span:nth-child(3) { color:#5c9f16; }.hero-brand-subtitle { margin:0 0 1.15rem; color:#161616; font-family:Arial,sans-serif; font-size:clamp(.72rem,1.15vw,.9rem); font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.hero-actions,.contact-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem; margin-top:2rem; }
.button { display:inline-block; border-radius:100px; padding:.8rem 1.25rem; font-weight:800; font-size:.87rem; text-decoration:none; transition:transform .2s ease,background .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-dark { background:var(--ink); color:var(--white); }
.button-light { background:var(--white); color:var(--ink); }
.text-link,.phone-link { font-weight:800; font-size:.9rem; }
.hero-panels { min-height:410px; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:.8rem; }
.hero-panel { padding:1.2rem; border-radius:.4rem; display:flex; flex-direction:column; justify-content:space-between; min-height:180px; transform:rotate(-1deg); }
.hero-panel:nth-child(2) { transform:rotate(1.5deg); margin-top:1.2rem; }
.hero-panel:nth-child(3) { grid-column:1 / -1; min-height:155px; transform:rotate(-.5deg); }
.panel-gold { background:var(--gold); color:#12212b; }.panel-blue { background:var(--deep); color:var(--white); }.panel-coral { background:var(--coral); color:#12212b; }
.panel-number { font-family:monospace; font-size:.73rem; }.hero-panel h2 { margin:.6rem 0 0; font-family:Arial,sans-serif; font-size:clamp(1.5rem,2.4vw,2.35rem); letter-spacing:-.06em; }.hero-panel p { margin:0; font-size:.81rem; line-height:1.35; max-width:240px; }
.intro-band { background:var(--mist); padding:clamp(3.5rem,8vw,7.5rem) clamp(1.25rem,10vw,12rem); }.intro-grid { max-width:1100px; margin:auto; display:grid; grid-template-columns:1fr 1fr; gap:5rem; }.intro-grid h2 { margin:0; }.intro-grid p { max-width:440px; font-size:1.05rem; }
.services { max-width:1400px; margin:auto; padding:clamp(4rem,9vw,8rem) clamp(1.25rem,5vw,5rem); }.section-heading { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:2.5rem; }.section-heading h2 { margin:0; }.section-heading > p { max-width:330px; margin:0 0 .35rem; font-size:.94rem; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.9rem; }.service-card { min-height:305px; display:flex; flex-direction:column; padding:1.5rem; border:1px solid var(--line); border-top-width:8px; background:#fff9dd; border-radius:.35rem; box-shadow:0 4px 12px rgba(7,58,97,.08); }.service-card:nth-child(1) { border-top-color:var(--gold); }.service-card:nth-child(2) { border-top-color:var(--coral); }.service-card:nth-child(3) { border-top-color:#2895d3; }.service-card:nth-child(4) { border-top-color:#8167b5; }.service-card:nth-child(5) { border-top-color:#ef7a64; }.service-card-featured { grid-column:auto; }.service-card-room { background:var(--deep); color:var(--white); border-top-color:var(--gold); box-shadow:none; }.service-icon { margin-bottom:auto; font-size:1.75rem; line-height:1; }.service-card h3 { margin:.75rem 0 .7rem; }.service-card p { margin-bottom:1rem; font-size:.9rem; line-height:1.5; }.service-card a { margin-top:auto; font-weight:800; font-size:.84rem; text-decoration:none; }.service-card a:hover { text-decoration:underline; }.detail { font-size:.78rem!important; }
.highlight { padding:clamp(3.5rem,8vw,7rem) clamp(1.25rem,8vw,9rem); background:var(--coral); display:grid; grid-template-columns:minmax(250px,.7fr) minmax(0,1fr); align-items:center; gap:clamp(2rem,8vw,8rem); }.highlight h2 { margin-bottom:1.2rem; max-width:680px; }.highlight > div:last-child > p:not(.eyebrow) { max-width:650px; }.highlight-shape { display:grid; grid-template-columns:repeat(3,1fr); align-items:end; gap:.7rem; height:240px; padding:1rem; border:1px solid rgba(13,53,73,.24); border-radius:50% 50% .35rem .35rem; }.highlight-shape span { display:block; background:var(--deep); }.highlight-shape span:nth-child(1) { height:38%; }.highlight-shape span:nth-child(2) { height:77%; background:var(--gold); }.highlight-shape span:nth-child(3) { height:55%; }
.visit { max-width:1400px; margin:auto; padding:clamp(4rem,9vw,8rem) clamp(1.25rem,8vw,9rem); display:grid; grid-template-columns:1fr .75fr; gap:clamp(2rem,7vw,7rem); align-items:center; }.visit-copy h2 { margin-bottom:1.2rem; }.visit-copy > p:not(.eyebrow) { max-width:540px; }.visit-card { background:var(--mist); border-radius:.4rem; padding:2rem; display:grid; gap:2rem; }.visit-card p { margin-bottom:0; }.visit-card address { font-style:normal; font-size:1.08rem; line-height:1.6; }.card-label { color:var(--ink); font-family:monospace; text-transform:uppercase; letter-spacing:.1em; font-size:.71rem; font-weight:600; margin-bottom:.4rem!important; }
.inner-page { min-height:100vh; }.page-hero { padding:clamp(4rem,10vw,9rem) clamp(1.25rem,9vw,10rem); }.page-hero > * { max-width:860px; }.page-hero h1 { margin-bottom:1.4rem; }.page-hero > p:last-child { font-size:1.1rem; max-width:660px; }.page-gold { background:var(--gold); }.page-blue { background:var(--deep); color:var(--white); }.page-coral { background:var(--coral); }.page-mist { background:var(--mist); }.page-content { max-width:1400px; margin:auto; padding:clamp(4rem,8vw,7rem) clamp(1.25rem,9vw,10rem); }.list-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.list-grid article { border:1px solid var(--line); border-radius:.35rem; padding:1.5rem; background:var(--white); }.list-grid h3 { margin-bottom:1rem; }.list-grid ul,.feedback-prompt ul { padding-left:1.15rem; margin:0; }.list-grid li,.feedback-prompt li { margin-bottom:.55rem; }.callout { background:var(--mist); padding:clamp(3rem,6vw,5.5rem) clamp(1.25rem,9vw,10rem); display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:end; }.callout h2 { margin:0; }.callout > div:last-child { max-width:430px; }.group-layout,.feedback-layout,.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,7vw,7rem); align-items:start; }.group-layout h2,.feedback-layout h2,.contact-grid h2 { margin-bottom:1rem; }.session-cards { display:grid; gap:1rem; }.session-cards article { padding:1.5rem; border-radius:.35rem; background:var(--gold); }.session-cards article:nth-child(2) { background:var(--coral); }.session-cards span { font-family:monospace; text-transform:uppercase; font-size:.72rem; letter-spacing:.08em; }.session-cards h3 { margin:1.7rem 0 .4rem; }.session-cards p { margin:0; }.feedback-prompt { padding:2rem; background:var(--gold); border-radius:.35rem; }.contact-large { font-family:Georgia,serif; color:var(--ink); font-size:clamp(1.35rem,2.2vw,2.2rem); font-weight:700; overflow-wrap:anywhere; }
footer { padding:2rem clamp(1.25rem,5vw,5rem); background:var(--deep); color:var(--white); display:grid; grid-template-columns:auto 1fr auto auto; gap:2rem; align-items:center; }footer .brand-mark { width:4.5rem; height:4.5rem; background:transparent url("images/NST-HUB.png") center / contain no-repeat; } footer p { margin:0; font-size:.82rem;}.footer-social { display:flex; flex-wrap:wrap; gap:.55rem; }.footer-social a { color:var(--deep); background:var(--white); padding:.35rem .6rem; border-radius:100px; font-size:.73rem; font-weight:700; text-decoration:none; }.footer-social a:hover { background:var(--gold); }.footer-note { opacity:.75; text-align:right; }
.course-section-alt { background:var(--mist); max-width:none; padding-left:clamp(1.25rem,9vw,10rem); padding-right:clamp(1.25rem,9vw,10rem); }.criteria-card { background:var(--deep)!important; color:var(--white); }.contact-detail { margin:1.25rem 0 0!important; font-size:.85rem!important; overflow-wrap:anywhere; }
.course-section .list-grid article { border-width:1px; border-top-width:8px; box-shadow:0 4px 12px rgba(7,58,97,.08); }.course-section .list-grid article:nth-child(1) { background:#fff9dd; border-top-color:var(--gold); }.course-section .list-grid article:nth-child(2) { background:#fff9dd; border-top-color:var(--coral); }.course-section .list-grid article:nth-child(3) { background:#fff9dd; border-top-color:#2895d3; }.course-section .list-grid article:nth-child(4) { background:#fff9dd; border-top-color:#8167b5; }.course-section .list-grid .criteria-card { background:var(--deep)!important; border-top-color:var(--gold); box-shadow:none; }
@media (min-width:1201px) { .site-header .brand { align-self:center; } }
@media (max-width:1200px) { .site-header { position:sticky; inset:auto; top:0; width:100%; min-height:0; padding:1rem clamp(1.25rem,4vw,3rem); flex-direction:row; align-items:center; justify-content:space-between; gap:1rem; }.site-header .brand-mark { width:3.7rem; height:3.7rem; }.site-header nav { width:auto; flex-direction:row; align-items:center; gap:.2rem; }.site-header nav a { padding:.55rem .65rem; }.site-header .nav-contact { margin:0 0 0 .35rem; padding:.65rem .9rem; }.sidebar-note { display:none; } main, footer { margin-left:0; }.hero { grid-template-columns:1fr; gap:2rem; min-height:0; }.hero-panels { max-width:620px; min-height:330px; }.intro-grid,.visit,.group-layout,.feedback-layout,.contact-grid { grid-template-columns:1fr; gap:1.5rem; }.section-heading { display:block; }.section-heading > p { margin-top:1rem; }.service-grid { grid-template-columns:1fr 1fr; }.service-card-featured { grid-column:auto; }.highlight { grid-template-columns:1fr; }.highlight-shape { max-width:270px; height:170px; }.visit-card { max-width:430px; } footer { grid-template-columns:1fr; gap:1.25rem; }.footer-note { text-align:left; } }
@media (max-width:680px) { .site-header { position:sticky; inset:auto; top:0; width:100%; min-height:0; padding:.75rem 1rem; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.65rem; transition:transform .28s ease; will-change:transform; }.site-header.mobile-header-hidden { transform:translateY(-100%); }.brand { font-size:.68rem; }.brand strong { font-size:.83rem; }.site-header .brand-mark { width:3.1rem; height:3.1rem; }.site-header nav { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:.35rem; }.site-header nav a { display:block; margin:0; padding:.55rem .4rem; text-align:center; font-size:.78rem; line-height:1.2; background:rgba(255,255,255,.08); }.site-header nav .nav-contact { margin:0; padding:.55rem .4rem; font-size:.78rem; background:var(--gold); color:var(--deep); }.sidebar-note { display:none; } main, footer { margin-left:0; }.hero { padding-top:3.2rem; }.hero-panels { grid-template-columns:1fr 1fr; gap:.55rem; }.hero-panel { padding:.9rem; }.hero-panel p { font-size:.73rem; }.service-grid,.list-grid { grid-template-columns:1fr; }.service-card-featured { grid-column:auto; }.service-card { min-height:255px; }.service-card-featured { background:var(--gold); }.highlight { padding-top:3.5rem; padding-bottom:3.5rem; }.page-hero { padding-top:3.5rem; }.callout { grid-template-columns:1fr; gap:1.5rem; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.button,.site-header { transition:none; } }
body:has(.site-header nav a[href="courses.html"][aria-current="page"]) .page-hero, body:has(.site-header nav a[href="groups.html"][aria-current="page"]) .page-hero, body:has(.site-header nav a[href="feedback.html"][aria-current="page"]) .page-hero { position:relative; overflow:hidden; }
body:has(.site-header nav a[href="courses.html"][aria-current="page"]) .page-hero::before, body:has(.site-header nav a[href="groups.html"][aria-current="page"]) .page-hero::before, body:has(.site-header nav a[href="feedback.html"][aria-current="page"]) .page-hero::before { content:""; position:absolute; width:clamp(19rem,35vw,35rem); aspect-ratio:1; right:clamp(1rem,6vw,8rem); top:50%; transform:translateY(-50%); background:url("images/NST-HUB.png") center / contain no-repeat; opacity:.2; pointer-events:none; }
body:has(.site-header nav a[href="courses.html"][aria-current="page"]) .page-hero > *, body:has(.site-header nav a[href="groups.html"][aria-current="page"]) .page-hero > *, body:has(.site-header nav a[href="feedback.html"][aria-current="page"]) .page-hero > * { position:relative; z-index:1; }
@media (max-width:680px) { body:has(.site-header nav a[href="courses.html"][aria-current="page"]) .page-hero::before, body:has(.site-header nav a[href="groups.html"][aria-current="page"]) .page-hero::before, body:has(.site-header nav a[href="feedback.html"][aria-current="page"]) .page-hero::before { display:none; } }