:root {
--red:#d71920;
--ink:#131b28;
--muted:#657080;
--line:#e8e9ed;
--cream:#f6f5f2
}
* {
	box-sizing:border-box
}
html {
	scroll-behavior:smooth;
	scroll-padding-top:100px
}
body {
	margin:0;
	color:var(--ink);
	font-family:Arial, Helvetica, sans-serif;
	line-height:1.6
}
button, input, select, textarea {
	font:inherit
}
button, a {
	-webkit-tap-highlight-color:transparent
}
a {
	color:inherit;
	text-decoration:none
}
button {
	cursor:pointer
}
img {
	max-width:100%;
	display:block
}
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
outline:3px solid #ea9919;
outline-offset:4px
}
.wrap {
	width:min(1200px, calc(100% - 48px));
	margin:auto
}
.top {
	background:var(--ink);
	color:#d9dee6;
	font-size:12px;
	padding:8px 0
}
.top .wrap {
	display:flex;
	justify-content:space-between;
	gap:20px
}
.top a {
	color:white
}
.header {
	position:sticky;
	top:0;
	z-index:20;
	background:#fffffff5;
	backdrop-filter:blur(14px);
	border-bottom:1px solid var(--line)
}
.nav {
	display:flex;
	align-items:center;
	justify-content:space-between;
	height:88px;
	gap:24px
}
.logo {
	width:178px
}
.links {
	display:flex;
	align-items:center;
	gap:26px;
	font-size:14px;
	font-weight:600
}
.links a:hover {
	color:var(--red)
}
.drop {
	position:relative
}
.drop>button {
	border:0;
	background:none;
	padding:18px 0;
	font-weight:600;
	color:var(--ink)
}
.dropmenu {
	display:none;
	position:absolute;
	top:100%;
	left:-18px;
	background:white;
	box-shadow:0 15px 50px #131b2820;
	min-width:220px;
	padding:12px;
	border:1px solid var(--line);
	border-radius:10px
}
.dropmenu a {
	display:block;
	padding:9px 12px
}
.drop:hover .dropmenu, .drop:focus-within .dropmenu, .drop.open .dropmenu {
display:block
}
.btn {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:24px;
	border:0;
	border-radius:6px;
	background:var(--red);
	color:white!important;
	padding:13px 22px;
	font-size:14px;
	font-weight:700
}
.btn.light {
	background:white;
	color:var(--ink)!important
}
.btn.outline {
	background:transparent;
	border:1px solid #ffffff70
}
.menu {
	display:none;
	border:1px solid var(--line);
	background:white;
	border-radius:6px;
	padding:8px 12px;
	font-size:22px
}
.hero {
	position:relative;
	background:#14202b;
	min-height:620px;
	color:white;
	overflow:hidden
}
.heroimage {
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	opacity:.6;
transition:opacity .5s
}
.hero:after {
	content:'';
	position:absolute;
	inset:0;
	background:linear-gradient(90deg, #0d172aee 0%, #0d172a99 50%, #0d172a20)
}
.herobody {
	position:relative;
	z-index:1;
	padding:90px 0 96px;
	max-width:740px
}
.eyebrow {
	display:flex;
	gap:10px;
	align-items:center;
	font-size:12px;
	font-weight:700;
	letter-spacing:2px;
	text-transform:uppercase;
	color:var(--red);
	margin-bottom:16px
}
.eyebrow:before {
	content:'';
	width:24px;
	height:2px;
	background:currentColor
}
.hero .eyebrow {
	color:#fff
}
.hero h1 {
	font-size:clamp(42px, 5.4vw, 70px);
	line-height:1.08;
	letter-spacing:-2.6px;
	margin:0 0 24px;
	font-weight:800
}
.hero h1 em {
	font-style:normal;
	color:#ff6265
}
.hero p {
	max-width:520px;
	font-size:17px;
	color:#d8dee8
}
.actions {
	display:flex;
	gap:12px;
	flex-wrap:wrap;
	margin-top:32px
}
.herobottom {
	position:absolute;
	z-index:2;
	bottom:28px;
	left:0;
	width:100%
}
.herobottom .wrap {
	display:flex;
	align-items:center;
	justify-content:space-between
}
.dots {
	display:flex;
	gap:9px
}
.dots button {
	width:9px;
	height:9px;
	padding:0;
	background:#ffffff60;
	border:0;
	border-radius:20px
}
.dots button.active {
	width:28px;
	background:var(--red)
}
.control {
	border:1px solid #ffffff60;
	color:white;
	background:#ffffff12;
	width:38px;
	height:38px;
	border-radius:50%;
	margin-left:5px
}
.quick {
	border-bottom:1px solid var(--line)
}
.quick .wrap {
	display:grid;
	grid-template-columns:repeat(4, 1fr)
}
.quick a {
	padding:26px 20px;
	border-right:1px solid var(--line);
	display:flex;
	gap:16px;
	align-items:center
}
.quick a:last-child {
	border:0
}
.quick span {
	font-size:24px;
	color:var(--red)
}
.quick strong {
	display:block;
	font-size:14px
}
.quick small {
	color:var(--muted);
	font-size:12px
}
section {
	padding:90px 0
}
h2 {
	font-size:clamp(30px, 3.4vw, 44px);
	letter-spacing:-1.4px;
	line-height:1.17;
	margin:0 0 20px
}
h3 {
	line-height:1.3
}
.muted {
	color:var(--muted)
}
.split {
	display:grid;
	grid-template-columns:1fr 1fr;
	align-items:center;
	gap:70px
}
.aboutvisual {
	position:relative;
	padding:0 25px 25px 0
}
.aboutvisual img {
	height:430px;
	width:100%;
	object-fit:cover;
	border-radius:12px
}
.tag {
	position:absolute;
	bottom:0;
	right:0;
	background:var(--red);
	color:white;
	padding:24px 30px;
	border:8px solid white;
	border-radius:10px
}
.tag strong {
	display:block;
	font-size:23px
}
.checks {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:12px;
	margin:25px 0
}
.checks span:before {
	content:'✓';
	color:var(--red);
	font-weight:bold;
	margin-right:10px
}
.sectionhead {
	display:flex;
	justify-content:space-between;
	gap:25px;
	align-items:end;
	margin-bottom:32px
}
.sectionhead p {
	max-width:420px;
	margin:0;
	color:var(--muted)
}
.courses {
	background:var(--cream)
}
.filters {
	display:flex;
	gap:8px;
	flex-wrap:wrap;
	margin:0 0 30px
}
.filters button {
	border:1px solid #ddd;
	background:white;
	border-radius:24px;
	padding:8px 18px;
	font-size:13px
}
.filters button.active {
	background:var(--ink);
	color:white;
	border-color:var(--ink)
}
.coursegrid {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:24px
}
.course {
	border-radius:10px;
	overflow:hidden;
	background:white;
	border:1px solid var(--line);
transition:transform .2s
}
.course:hover {
	transform:translateY(-5px)
}
.course .cover {
	height:190px;
	width:100%;
	object-fit:cover
}
.coursebody {
	padding:25px
}
.pill {
	font-size:10px;
	letter-spacing:1px;
	font-weight:700;
	color:var(--red);
	text-transform:uppercase
}
.course h3 {
	font-size:21px;
	margin:10px 0
}
.course p {
	font-size:14px;
	color:var(--muted)
}
.coursefoot {
	border-top:1px solid var(--line);
	padding-top:17px;
	display:flex;
	justify-content:space-between;
	font-size:12px
}
.coursefoot button {
	border:0;
	background:none;
	color:var(--red);
	font-weight:700
}
.note {
	font-size:12px;
	color:var(--muted);
	margin:20px 0 0
}
.why {
	background:var(--ink);
	color:white
}
.whygrid {
	display:grid;
	grid-template-columns:1.2fr 1fr 1fr;
	gap:40px
}
.why .eyebrow {
	color:#ff7276
}
.why article {
	border-left:1px solid #ffffff30;
	padding-left:28px
}
.why article span {
	font-size:28px;
	color:#ff7276
}
.why p {
	color:#b8c0cc;
	font-size:14px
}
.staffgrid {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:24px
}
.staff {
	background:var(--cream);
	border-radius:9px;
	overflow:hidden
}
.staff img {
	width:100%;
	height:260px;
	object-fit:cover;
	filter:grayscale(100%)
}
.staff div {
	padding:20px
}
.staff h3 {
	margin:0 0 5px;
	font-size:18px
}
.staff p {
	margin:0;
	color:var(--muted);
	font-size:12px
}
.partners {
	padding:45px 0;
	background:var(--cream);
	border-top:1px solid var(--line)
}
.partners .wrap {
	display:grid;
	grid-template-columns:1fr 2.3fr;
	gap:40px;
	align-items:center
}
.partnerlist {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:14px
}
.partnerlist div {
	border:1px solid #dedfe3;
	background:white;
	text-align:center;
	border-radius:8px;
	padding:20px;
	font-weight:700;
	color:#647080
}
.partnerlist small {
	display:block;
	font-size:10px;
	font-weight:400;
	margin-top:6px
}
.galleryhead {
	display:flex;
	gap:20px;
	align-items:center
}
.gallerytrack {
	display:flex;
	gap:18px;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	scrollbar-width:none;
	padding:4px 0 12px
}
.gallerytrack::-webkit-scrollbar {
display:none
}
.photo {
	flex:0 0 calc((100% - 36px)/3);
	border:0;
	padding:0;
	background:var(--ink);
	position:relative;
	border-radius:10px;
	overflow:hidden;
	scroll-snap-align:start;
	color:white;
	text-align:left
}
.photo img {
	height:300px;
	width:100%;
	object-fit:cover;
	opacity:.85;
transition:.3s
}
.photo:hover img {
	transform:scale(1.04);
	opacity:.65
}
.photo span {
	position:absolute;
	bottom:20px;
	left:20px;
	font-weight:700
}
.round {
	background:white;
	border:1px solid #dfe1e6;
	border-radius:50%;
	width:42px;
	height:42px;
	color:var(--ink)
}
.videos {
	padding-top:0
}
.videogrid {
	display:grid;
	grid-template-columns:1.2fr 1fr;
	gap:25px
}
.videocard {
	position:relative;
	border:0;
	background:var(--ink);
	border-radius:10px;
	overflow:hidden;
	color:white;
	padding:0;
	text-align:left
}
.videocard img {
	height:280px;
	object-fit:cover;
	width:100%;
	opacity:.55
}
.play {
	position:absolute;
	top:40%;
	left:46%;
	display:grid;
	place-items:center;
	background:white;
	color:var(--red);
	width:60px;
	height:60px;
	border-radius:50%;
	font-size:22px
}
.videocard strong {
	position:absolute;
	left:25px;
	bottom:25px;
	font-size:20px
}
.testimonials {
	background:#f7f3f1
}
.testlayout {
	display:grid;
	grid-template-columns:1fr 1.5fr;
	gap:80px
}
.quote {
	background:white;
	border:1px solid var(--line);
	padding:42px;
	border-radius:12px
}
.quote .quoteicon {
	font-family:Georgia;
	font-size:75px;
	color:var(--red);
	height:60px;
	line-height:1
}
.quote blockquote {
	font-size:23px;
	line-height:1.55;
	margin:12px 0 30px;
	letter-spacing:-.4px
}
.quote small {
	color:var(--muted)
}
.quotebottom {
	display:flex;
	justify-content:space-between;
	align-items:center
}
.cta {
	background:var(--red);
	color:white;
	padding:48px 0
}
.cta .wrap {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:25px
}
.cta h2 {
	margin:0;
	font-size:34px
}
.contactgrid {
	display:grid;
	grid-template-columns:1fr 1.2fr;
	gap:70px
}
.contactline {
	padding:20px 0;
	border-bottom:1px solid var(--line)
}
.contactline small {
	display:block;
	color:var(--red);
	text-transform:uppercase;
	letter-spacing:1.4px;
	font-weight:700;
	font-size:11px;
	margin-bottom:6px
}
.form {
	border:1px solid var(--line);
	border-radius:12px;
	background:var(--cream);
	padding:32px
}
.form h3 {
	margin-top:0
}
.fields {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:18px
}
.field {
	display:flex;
	flex-direction:column;
	gap:6px;
	font-size:12px;
	font-weight:700
}
.field.full {
	grid-column:1/-1
}
input, select, textarea {
	border:1px solid #d9dde2;
	background:white;
	padding:12px;
	border-radius:5px;
	width:100%;
	font-size:14px;
	color:var(--ink)
}
textarea {
	resize:vertical;
	min-height:105px
}
.form .btn {
	margin-top:20px
}
.form small {
	display:block;
	color:var(--muted);
	font-size:11px;
	margin-top:10px
}
.footer {
	background:var(--ink);
	color:#d3d9e2;
	padding:55px 0 20px
}
.footergrid {
	display:grid;
	grid-template-columns:1.5fr 1fr 1fr 1.3fr;
	gap:45px
}
.footerlogo {
	background:white;
	border-radius:5px;
	width:180px;
	padding:8px
}
.footer p {
	font-size:13px;
	color:#aab4c3
}
.footer h4 {
	color:white;
	margin-top:0
}
.footer a {
	display:block;
	font-size:13px;
	margin:10px 0
}
.copyright {
	display:flex;
	justify-content:space-between;
	font-size:11px;
	color:#9aa6b7;
	padding-top:22px;
	margin-top:35px;
	border-top:1px solid #ffffff20
}
.totop {
	position:fixed;
	right:20px;
	bottom:20px;
	background:var(--red);
	color:white;
	border:0;
	border-radius:8px;
	width:44px;
	height:44px;
	z-index:15
}
dialog {
	border:0;
	border-radius:12px;
	padding:0;
	width:min(950px, calc(100% - 30px));
	max-height:90vh;
	background:#121923;
	color:white
}
dialog::backdrop {
background:#080d16dc;
backdrop-filter:blur(6px)
}
.modalbar {
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:13px 20px
}
.modalbar button {
	background:transparent;
	border:0;
	color:white;
	font-size:24px
}
.modalimg {
	max-height:66vh;
	width:100%;
	object-fit:contain;
	background:#080d16
}
.modalnav {
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:14px 20px
}
.modalnav button {
	background:#ffffff15;
	color:white;
	border:1px solid #ffffff40;
	border-radius:6px;
	padding:8px 20px
}
.modalcontent {
	padding:35px;
	max-width:700px
}
.modalcontent video {
	width:100%;
	max-height:55vh
}
.modalcontent p {
	color:#bbc3d0
}
[hidden] {
display:none!important
}
@media(max-width:1000px) {
.links {
gap:15px;
font-size:12px
}
.logo {
width:145px
}
.nav>.btn {
display:none
}
.split, .contactgrid {
gap:35px
}
.staffgrid {
grid-template-columns:repeat(2, 1fr)
}
.whygrid {
gap:20px
}
.testlayout {
gap:30px
}
.footergrid {
gap:25px
}
.hero h1 {
max-width:650px
}
}
@media(max-width:760px) {
.wrap {
width:calc(100% - 32px)
}
.top .wrap>span {
display:none
}
.top .wrap {
justify-content:center
}
.nav {
height:74px
}
.logo {
width:138px
}
.menu {
display:block
}
.links {
display:none;
position:absolute;
top:74px;
left:0;
right:0;
background:white;
max-height:calc(100vh - 100px);
overflow:auto;
padding:15px 25px;
box-shadow:0 15px 20px #0001;
align-items:stretch
}
.links.open {
display:flex;
flex-direction:column;
gap:0
}
.links>a {
padding:12px 0
}
.drop>button {
width:100%;
text-align:left;
padding:12px 0
}
.dropmenu {
position:static;
box-shadow:none;
border:0;
background:var(--cream);
margin-bottom:8px
}
.drop:hover .dropmenu {
display:none
}
.drop.open .dropmenu, .drop:focus-within .dropmenu {
display:block
}
.hero {
min-height:570px
}
.herobody {
padding:65px 0 90px
}
.hero h1 {
letter-spacing:-1.7px
}
.hero p {
font-size:15px
}
.heroimage {
object-position:65%
}
.quick .wrap {
grid-template-columns:1fr 1fr
}
.quick a {
padding:20px 10px;
border-bottom:1px solid var(--line)
}
.quick a:nth-child(2) {
border-right:0
}
.quick strong {
font-size:12px
}
.quick small {
font-size:10px
}
section {
padding:60px 0
}
.split, .contactgrid, .testlayout, .partners .wrap {
grid-template-columns:1fr;
gap:30px
}
.aboutvisual img {
height:320px
}
.sectionhead {
align-items:start;
flex-direction:column;
gap:5px
}
.coursegrid {
grid-template-columns:1fr
}
.course .cover {
height:220px
}
.whygrid {
grid-template-columns:1fr
}
.why article {
padding:15px 0 0;
border-left:0;
border-top:1px solid #ffffff30
}
.staffgrid {
gap:15px
}
.staff img {
height:210px
}
.staff div {
padding:15px
}
.staff h3 {
font-size:15px
}
.partnerlist {
gap:7px
}
.partnerlist div {
padding:16px 7px;
font-size:12px
}
.photo {
flex-basis:85%
}
.photo img {
height:280px
}
.videogrid {
grid-template-columns:1fr
}
.quote {
padding:28px
}
.quote blockquote {
font-size:20px
}
.cta .wrap {
align-items:start;
flex-direction:column
}
.cta h2 {
font-size:30px
}
.form {
padding:22px
}
.fields {
grid-template-columns:1fr
}
.footergrid {
grid-template-columns:1fr 1fr;
gap:25px
}
.copyright {
flex-direction:column;
gap:5px
}
.checks {
font-size:13px
}
.galleryhead {
width:100%;
justify-content:space-between
}
.modalnav {
gap:8px;
font-size:12px
}
.modalnav button {
padding:8px 12px
}
}
@media(prefers-reduced-motion:reduce) {
html {
scroll-behavior:auto
}
* {
transition:none!important
}
}
/* Premium edition */
:root {
--red:#df1425;
--ink:#10182b;
--cream:#f5f7fc
}
body {
	background:#fff
}
.wrap {
	width:min(1440px, calc(100% - 64px))
}
.top {
	background:linear-gradient(110deg, #b50817, #e11b2c 55%, #a40918);
	font-size:12px;
	letter-spacing:.2px;
	padding:10px 0
}
.top .wrap:after {
	content:'LEARN • GROW • SUCCEED';
	font-size:10px;
	font-weight:700;
	letter-spacing:2px;
	color:#fff
}
.header {
	border-bottom:0;
	box-shadow:0 6px 35px #10182b12
}
.nav {
	height:106px
}
.logo {
	width:205px
}
.links {
	gap:30px;
	font-size:14px
}
.links>a {
	position:relative
}
.links>a:after {
	content:'';
	position:absolute;
	bottom:-12px;
	left:0;
	right:100%;
	height:3px;
	background:var(--red);
transition:right .2s
}
.links>a:hover:after {
	right:0
}
.nav>.btn {
	border-radius:40px;
	box-shadow:0 7px 20px #df142530;
	padding:15px 25px
}
.dropmenu {
	border-top:3px solid var(--red);
	border-radius:0 0 12px 12px
}
.btn {
	border-radius:30px;
	padding:15px 25px;
	box-shadow:0 6px 15px #df14251a;
transition:transform .2s, box-shadow .2s
}
.btn:hover {
	transform:translateY(-3px);
	box-shadow:0 10px 24px #df142535
}
.hero {
	min-height:700px;
	border-radius:0 0 40px 40px;
	background:#111c34
}
.hero:after {
	background:linear-gradient(90deg, #0b1227f5 0%, #101a35c9 40%, #101a3545 100%)
}
.heroimage {
	opacity:.8
}
.herobody {
	padding:110px 0 120px;
	max-width:800px
}
.hero h1 {
	font-size:clamp(46px, 5.5vw, 82px);
	letter-spacing:-3px
}
.hero h1 em {
	background:linear-gradient(90deg, #ff6974, #ffaf91);
	background-clip:text;
	-webkit-background-clip:text;
	color:transparent
}
.hero .eyebrow {
	width:fit-content;
	border:1px solid #ffffff35;
	border-radius:30px;
	background:#ffffff0d;
	padding:9px 18px;
	margin-bottom:26px;
	letter-spacing:2px
}
.hero p {
	font-size:18px;
	max-width:580px
}
.herobottom {
	bottom:35px
}
.hero-feature {
	position:absolute;
	right:5%;
	bottom:90px;
	z-index:3;
	display:flex;
	gap:22px;
	background:#ffffff13;
	border:1px solid #ffffff30;
	backdrop-filter:blur(15px);
	padding:24px 30px;
	border-radius:18px;
	color:white
}
.hero-feature strong {
	font-size:20px;
	display:block
}
.hero-feature small {
	font-size:11px;
	color:#d6deed
}
.hero-feature b {
	font-size:36px;
	color:#ff6570
}
.quick {
	border:0;
	position:relative;
	margin-top:-1px;
	padding:25px 0;
	background:white
}
.quick .wrap {
	border:1px solid #e8eaf1;
	border-radius:16px;
	background:white;
	box-shadow:0 16px 45px #1926480b
}
.quick a {
	padding:25px
}
.quick span {
	background:#fff0f1;
	border-radius:14px;
	min-width:50px;
	height:50px;
	display:grid;
	place-items:center;
	font-size:26px
}
.quick a:hover {
	background:#fff7f8
}
.quick strong {
	font-size:15px
}
section {
	padding:95px 0
}
.eyebrow {
	letter-spacing:2.4px;
	font-size:11px
}
h2 {
	font-size:clamp(32px, 3.2vw, 48px);
	letter-spacing:-1.6px
}
.aboutvisual img {
	height:470px;
	border-radius:24px
}
.aboutvisual:before {
	content:'';
	position:absolute;
	inset:30px 0 0 30px;
	z-index:-1;
	border-radius:24px;
	background:#fee9ec
}
.tag {
	border-radius:18px;
	padding:28px 35px;
	box-shadow:0 10px 30px #bd102d20
}
.split {
	gap:85px
}
.checks span {
	background:#f7f8fb;
	border:1px solid #eef0f5;
	border-radius:8px;
	padding:12px;
	font-size:13px
}
.courses {
	background:linear-gradient(160deg, #f0f3fc, #faf6f5);
	overflow:hidden
}
.sectionhead {
	margin-bottom:35px
}
.filters button {
	padding:10px 20px;
	border:1px solid #e1e6f0;
	box-shadow:0 3px 12px #10182b05
}
.filters button.active {
	background:var(--red);
	border-color:var(--red);
	box-shadow:0 5px 16px #df14252b
}
.course-carousel {
	position:relative
}
.coursegrid {
	display:flex!important;
	gap:16px;
	overflow-x:auto;
	scrollbar-width:none;
	scroll-snap-type:x mandatory;
	padding:9px 0 26px
}
.coursegrid::-webkit-scrollbar {
display:none
}
.course {
	flex:0 0 calc((100% - 80px)/6);
	min-width:0;
	scroll-snap-align:start;
	border:1px solid #e7eaf2;
	border-radius:16px;
	box-shadow:0 8px 24px #17295208;
	position:relative
}
.course:hover {
	box-shadow:0 15px 30px #17295214;
	transform:translateY(-5px)
}
.course .cover {
	height:140px
}
.coursebody {
	padding:17px 14px
}
.course h3 {
	font-size:17px;
	min-height:44px;
	letter-spacing:-.4px;
	margin:12px 0
}
.course p {
	font-size:12px;
	min-height:76px;
	line-height:1.7
}
.course .pill {
	font-size:9px;
	letter-spacing:.5px;
	display:inline-block;
	background:#fff0f1;
	border-radius:5px;
	padding:4px 6px
}
.coursefoot {
	display:block;
	padding-top:12px
}
.coursefoot span {
	display:block;
	font-size:10px;
	margin-bottom:10px;
	color:#7a8391
}
.coursefoot button {
	padding:8px 0;
	font-size:12px
}
.course:before {
	content:'↗';
	position:absolute;
	top:12px;
	right:12px;
	width:28px;
	height:28px;
	border-radius:50%;
	background:white;
	color:var(--red);
	text-align:center;
	font-weight:bold
}
.sliderbar {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	margin-top:4px
}
.sliderbar small {
	color:var(--muted);
	font-size:12px
}
.sliderbuttons {
	display:flex;
	gap:8px
}
.round {
	width:43px;
	height:43px;
	box-shadow:0 3px 12px #18223e08
}
.round:hover {
	background:var(--red);
	color:white;
	border-color:var(--red)
}
.why {
	background:radial-gradient(ellipse at 90% 30%, #26314e, #10182b 65%);
	border-radius:30px;
	margin:20px 24px;
	position:relative
}
.whygrid {
	gap:55px
}
.why article {
	background:#ffffff05;
	border:1px solid #ffffff16;
	border-radius:18px;
	padding:30px
}
.why article h3 {
	font-size:22px
}
.why article span {
	font-size:20px;
	font-weight:bold
}
.staff {
	background:white;
	border:1px solid var(--line);
	border-radius:18px;
	box-shadow:0 8px 25px #10182b08
}
.staff img {
	height:300px;
	filter:none
}
.staff div {
	padding:24px
}
.staff h3 {
	font-size:20px
}
.staff .pill {
	font-size:9px
}
.partners {
	background:#f4f6fb;
	padding:48px 0
}
.partnerlist div {
	padding:30px 20px;
	border-radius:14px;
	box-shadow:0 5px 20px #18244705
}
.photo {
	border-radius:18px
}
.photo img {
	height:340px;
	opacity:.82
}
.photo:after {
	content:'';
	position:absolute;
	inset:0;
	background:linear-gradient(0deg, #0b1227b3, transparent 60%);
	pointer-events:none
}
.photo span {
	z-index:1;
	font-size:20px;
	bottom:25px;
	left:25px
}
.videocard {
	border-radius:18px
}
.videocard img {
	height:330px
}
.play {
	box-shadow:0 0 0 12px #ffffff20
}
.testimonials {
	background:linear-gradient(135deg, #fff4f3, #f3f5fc)
}
.quote {
	padding:45px;
	border-radius:22px;
	border:1px solid #fff;
	box-shadow:0 20px 50px #3c25480a
}
.quote blockquote {
	font-size:25px
}
.cta {
	margin:0 24px;
	border-radius:24px;
	background:linear-gradient(100deg, #b4091c, #ec2237);
	box-shadow:0 20px 40px #df14251c;
	padding:55px 0
}
.form {
	background:#f8f9fd;
	border-radius:20px;
	padding:38px;
	box-shadow:0 15px 45px #13274707
}
.form h3 {
	font-size:24px
}
.field {
	font-size:12px
}
input, select, textarea {
	border-radius:9px;
	padding:14px;
	border:1px solid #e1e5ee
}
.footer {
	background:radial-gradient(ellipse at 0% 0%, #24304c, #10182b 60%);
	padding-top:65px
}
.footerlogo {
	width:205px;
	border-radius:10px
}
.footer h4 {
	font-size:16px
}
.footer a:hover {
	color:#ff6570
}
.footergrid {
	gap:70px
}
.totop {
	border-radius:50%;
	box-shadow:0 6px 24px #df142550
}
@media(min-width:1600px) {
.course .cover {
height:150px
}
}
@media(max-width:1150px) {
.nav {
gap:16px
}
.links {
gap:18px
}
.nav>.btn {
padding:12px 15px;
font-size:12px
}
.logo {
width:175px
}
.hero-feature {
right:4%;
padding:18px
}
.coursebody {
padding:13px 10px
}
.course h3 {
font-size:15px
}
.course .cover {
height:115px
}
.course p {
font-size:11px
}
.course .pill {
font-size:8px
}
.footergrid {
gap:30px
}
.split {
gap:40px
}
}
@media(max-width:900px) {
.hero-feature {
display:none
}
.course {
flex-basis:calc((100% - 32px)/3)
}
.course .cover {
height:160px
}
.course h3 {
font-size:18px
}
.course p {
font-size:13px;
min-height:70px
}
.coursebody {
padding:18px
}
.course .pill {
font-size:9px
}
.nav>.btn {
display:none
}
.links {
gap:20px
}
.hero h1 {
font-size:65px
}
.quick a {
padding:20px 12px
}
.quick span {
min-width:40px;
height:40px
}
.quick strong {
font-size:12px
}
.staff img {
height:270px
}
}
@media(max-width:760px) {
.wrap {
width:calc(100% - 32px)
}
.top .wrap:after {
display:none
}
.top {
font-size:11px
}
.nav {
height:82px
}
.logo {
width:165px
}
.links {
top:82px;
gap:0
}
.hero {
min-height:620px;
border-radius:0 0 25px 25px
}
.herobody {
padding:75px 0 105px
}
.hero h1 {
font-size:clamp(44px, 9vw, 66px);
letter-spacing:-2px
}
.hero .eyebrow {
font-size:9px;
padding:8px 12px;
letter-spacing:1.3px
}
.hero p {
font-size:15px
}
.hero .actions {
gap:10px
}
.hero .btn {
padding:13px 18px;
font-size:12px
}
.quick {
padding:20px 0
}
.quick a {
padding:18px 10px;
gap:10px
}
.quick .wrap {
border-radius:12px;
overflow:hidden
}
.quick small {
font-size:10px
}
.split {
gap:38px
}
.aboutvisual img {
height:340px
}
.checks span {
font-size:11px;
padding:10px
}
.tag {
padding:20px
}
.tag strong {
font-size:18px
}
section {
padding:65px 0
}
.sectionhead {
gap:12px
}
.coursegrid {
gap:12px
}
.course {
flex-basis:calc((100% - 12px)/2)
}
.course h3 {
font-size:17px;
min-height:44px
}
.course .cover {
height:150px
}
.coursebody {
padding:16px 12px
}
.course p {
font-size:12px;
min-height:82px
}
.course .pill {
font-size:8px
}
.sliderbar small {
font-size:10px;
max-width:180px
}
.filters button {
padding:8px 13px;
font-size:11px
}
.filters {
gap:7px
}
.why {
margin:10px 12px;
border-radius:20px
}
.whygrid {
gap:20px
}
.why article {
padding:25px
}
.staff img {
height:210px
}
.staff div {
padding:17px
}
.staff h3 {
font-size:16px
}
.partners {
padding:35px 0
}
.partnerlist div {
padding:20px 8px;
font-size:11px
}
.photo img {
height:310px
}
.videocard img {
height:280px
}
.quote {
padding:28px
}
.quote blockquote {
font-size:21px
}
.cta {
margin:0 12px;
border-radius:20px;
padding:38px 0
}
.cta h2 {
font-size:30px
}
.contactgrid {
gap:35px
}
.form {
padding:24px
}
.footergrid {
gap:30px
}
.footerlogo {
width:170px
}
}
@media(max-width:380px) {
.course {
flex-basis:85%
}
.course .cover {
height:175px
}
.course p {
min-height:50px
}
.hero h1 {
font-size:44px
}
}
/* Professional institute masthead */
html {
	scroll-padding-top:185px
}
.brandbar {
	height:108px;
	display:flex;
	align-items:center;
	gap:28px
}
.brandidentity {
	flex-shrink:0
}
.brandbar .logo {
	width:215px
}
.brandstatement {
	border-left:1px solid #dde1eb;
	padding-left:28px;
	display:flex;
	flex-direction:column;
	gap:6px
}
.brandstatement strong {
	font-size:12px;
	letter-spacing:2px
}
.brandstatement span {
	color:var(--red);
	font-size:14px;
	letter-spacing:1px
}
.headercontact {
	margin-left:auto;
	display:flex;
	align-items:center;
	gap:13px
}
.headercontact small {
	font-size:9px;
	letter-spacing:1.2px;
	color:#798398;
	display:block;
	margin-bottom:4px
}
.headercontact a {
	font-size:14px;
	font-weight:bold
}
.contactbadge {
	display:grid;
	place-items:center;
	width:43px;
	height:43px;
	border:1px solid #f2d4d7;
	background:#fff5f5;
	color:var(--red);
	border-radius:50%;
	font-size:20px
}
.brandbar>.btn {
	font-size:12px;
	padding:13px 20px
}
.menuband {
	background:#111c34;
	border-top:1px solid #253149;
	border-bottom:3px solid var(--red)
}
.menuband .nav {
	height:60px;
	gap:18px
}
.menuband .links {
	gap:30px;
	flex:1;
	color:#fff;
	font-size:13px
}
.menuband .links>a {
	padding:18px 0
}
.menuband .links>a:after {
	bottom:9px
}
.menuband .links a:hover {
	color:#ff8d97
}
.menuband .drop>button {
	color:#fff;
	font-size:13px;
	padding:19px 0
}
.menuband .dropmenu {
	top:100%;
	color:var(--ink);
	z-index:25
}
.menuband .dropmenu a:hover {
	background:#fff1f3;
	color:var(--red)
}
.logindrop {
	margin-left:auto
}
.logindrop>button {
	background:#ffffff0b!important;
	border-left:1px solid #ffffff20!important;
	border-right:1px solid #ffffff20!important;
	padding:19px 20px!important
}
.logindrop .dropmenu {
	right:0;
	left:auto
}
.navcta {
	font-size:11px;
	letter-spacing:.5px;
	color:#ff8d97;
	font-weight:700;
	white-space:nowrap
}
.servicessection {
	background:#fff
}
.servicegrid {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:22px
}
.servicecard {
	border:1px solid #e5e9f2;
	border-radius:18px;
	padding:30px 25px;
	position:relative;
	box-shadow:0 12px 28px #12264706;
transition:.25s;
	background:linear-gradient(145deg, white, #f8faff)
}
.servicecard:hover {
	transform:translateY(-6px);
	border-color:#efb9bf;
	box-shadow:0 18px 35px #d11c2910
}
.serviceicon {
	width:62px;
	height:62px;
	display:grid;
	place-items:center;
	border-radius:16px;
	background:#fff0f2;
	color:var(--red);
	font-size:31px;
	margin-bottom:26px
}
.servicecard:nth-child(2) .serviceicon {
background:#edf3ff;
color:#2b64cd
}
.servicecard:nth-child(3) .serviceicon {
background:#f4edff;
color:#8854c6
}
.servicecard:nth-child(4) .serviceicon {
background:#e9f8f1;
color:#2c8a60
}
.servicecard small {
	font-size:9px;
	letter-spacing:1.4px;
	color:#808a9b;
	font-weight:bold
}
.servicecard h3 {
	font-size:21px;
	margin:13px 0
}
.servicecard p {
	font-size:13px;
	color:var(--muted);
	min-height:66px
}
.servicecard b {
	font-size:12px;
	color:var(--red);
	display:block;
	border-top:1px solid var(--line);
	padding-top:18px;
	margin-top:24px
}
.countersection {
	background:linear-gradient(110deg, #111a31, #263354);
	padding:55px 0;
	color:white
}
.countersection>.wrap {
	display:grid;
	grid-template-columns:1fr 2fr;
	gap:50px;
	align-items:center
}
.counterintro .eyebrow {
	color:#ff8b96
}
.counterintro h2 {
	font-size:32px;
	margin-bottom:12px
}
.counterintro p {
	font-size:12px;
	color:#b7c2d6;
	margin:0
}
.countergrid {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:15px
}
.countergrid>div {
	border-left:1px solid #ffffff20;
	padding:20px;
	text-align:center
}
.countergrid strong {
	display:block;
	font-size:54px;
	font-weight:800;
	letter-spacing:-2px;
	background:linear-gradient(180deg, #fff, #ffcbd1);
	background-clip:text;
	-webkit-background-clip:text;
	color:transparent
}
.countergrid span {
	display:block;
	font-size:11px;
	color:#c4cddd
}
.footer {
	padding-top:0
}
.footerlead {
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:55px 0;
	border-bottom:1px solid #ffffff20;
	margin-bottom:50px;
	gap:25px
}
.footerlead .eyebrow {
	color:#ff8d97;
	font-size:10px
}
.footerlead h2 {
	color:white;
	font-size:40px;
	margin:0
}
.footergrid {
	grid-template-columns:1.35fr 1fr 1.15fr 1.2fr;
	gap:50px
}
.footergrid h4 {
	position:relative;
	padding-bottom:16px;
	margin-bottom:20px
}
.footergrid h4:after {
	content:'';
	width:28px;
	height:2px;
	background:#ef4353;
	position:absolute;
	bottom:0;
	left:0
}
.footergrid a {
	font-size:12px;
	margin:12px 0;
	color:#bcc6d7
}
.footergrid p {
	font-size:13px;
	line-height:1.85
}
.footerchips {
	display:flex;
	gap:7px
}
.footerchips span {
	border:1px solid #ffffff20;
	border-radius:20px;
	padding:5px 12px;
	font-size:10px;
	color:#dbe3ef
}
.copyright {
	margin-top:45px;
	padding-top:25px
}
@media(max-width:1200px) {
.brandbar {
gap:18px
}
.brandstatement {
padding-left:18px
}
.brandbar .logo {
width:190px
}
.headercontact a {
font-size:12px
}
.menuband .links {
gap:20px
}
.navcta {
display:none
}
.servicecard {
padding:25px 20px
}
.servicecard h3 {
font-size:19px
}
.countergrid>div {
padding:12px
}
.countergrid strong {
font-size:45px
}
}
@media(max-width:1000px) {
.brandstatement {
display:none
}
.brandbar {
height:95px
}
.menuband .links {
gap:18px;
font-size:12px
}
.menuband .drop>button {
font-size:12px
}
.logindrop>button {
padding:19px 12px!important
}
.servicegrid {
grid-template-columns:repeat(2, 1fr)
}
.servicecard p {
min-height:44px
}
.countersection>.wrap {
grid-template-columns:1fr
}
.countergrid strong {
font-size:52px
}
.footergrid {
gap:30px
}
}
@media(max-width:760px) {
html {
scroll-padding-top:100px
}
.brandbar {
height:88px;
gap:12px
}
.brandbar .logo {
width:167px
}
.headercontact, .brandbar>.btn {
display:none
}
.brandbar>.menu {
margin-left:auto
}
.menuband {
height:4px;
border-top:0
}
.menuband .nav {
height:0
}
.menuband .links {
position:absolute;
top:92px;
color:var(--ink);
padding:14px 22px;
gap:0;
border-bottom:3px solid var(--red)
}
.menuband .links>a {
padding:12px 0
}
.menuband .links a:hover {
color:var(--red)
}
.menuband .drop>button {
color:var(--ink);
padding:13px 0;
font-size:14px
}
.menuband .links>a:after {
display:none
}
.logindrop {
margin-left:0
}
.logindrop>button {
background:#fff0f2!important;
border:0!important;
border-radius:8px;
padding:13px!important;
width:100%
}
.logindrop .dropmenu {
position:static
}
.menuband .dropmenu {
border-radius:8px
}
.servicegrid {
gap:14px
}
.servicecard {
padding:22px 16px;
border-radius:14px
}
.serviceicon {
width:48px;
height:48px;
font-size:25px;
margin-bottom:20px
}
.servicecard h3 {
font-size:17px
}
.servicecard small {
font-size:8px;
letter-spacing:.6px
}
.servicecard p {
font-size:12px;
min-height:85px
}
.servicecard b {
font-size:10px;
margin-top:18px
}
.countersection {
padding:40px 0
}
.countersection>.wrap {
gap:25px
}
.countergrid {
grid-template-columns:1fr 1fr;
gap:12px
}
.countergrid>div {
border:1px solid #ffffff16;
border-radius:12px;
background:#ffffff04;
padding:16px
}
.countergrid strong {
font-size:44px
}
.counterintro h2 {
font-size:30px
}
.footerlead {
padding:40px 0;
align-items:start;
flex-direction:column;
margin-bottom:35px
}
.footerlead h2 {
font-size:30px
}
.footergrid {
grid-template-columns:1fr 1fr;
gap:30px 20px
}
.footergrid h4 {
font-size:14px
}
.footergrid a {
font-size:11px
}
.footergrid p {
font-size:12px
}
.footerchips span {
padding:4px 8px;
font-size:9px
}
}
/* Final typography, spacing and institute navigation system */
:root {
--ink:#15223c;
--red:#d91d35;
--muted:#6b768a;
--line:#e8edf4
}
body, button, input, select, textarea {
	font-family:'Manrope', Arial, sans-serif
}
body {
	font-size:15px;
	line-height:1.8
}
.wrap {
	width:min(1400px, calc(100% - 72px))
}
h1, h2, h3, h4 {
	font-family:'Manrope', Arial, sans-serif
}
h2 {
	font-weight:800;
	line-height:1.22;
	letter-spacing:-1.6px
}
h3 {
	font-weight:800
}
.top {
	background:#111d34;
	padding:9px 0;
	color:#bcc7d9;
	font-size:10px;
	letter-spacing:.3px
}
.top .wrap:after {
	content:'ITXPRT • PADRAUNA';
	color:#adb9ce;
	letter-spacing:1.8px;
	font-size:9px
}
.header {
	background:#fff;
	box-shadow:0 8px 30px #1223440c;
	backdrop-filter:none
}
.professionalnav {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:38px;
	height:102px
}
.signature {
	width:200px;
	flex-shrink:0;
	display:flex;
	flex-direction:column;
	align-items:center
}
.signature .logo {
	width:180px;
	height:75px;
	object-fit:contain
}
.signature>span {
	font-size:8px;
	letter-spacing:1.8px;
	font-weight:800;
	color:#4f5b6d;
	margin-top:-7px;
	background:white;
	position:relative
}
.professionalnav .links {
	position:static;
	flex:1;
	display:flex;
	justify-content:flex-end;
	gap:24px;
	font-size:12px;
	font-weight:700;
	color:var(--ink)
}
.professionalnav .links>a {
	padding:25px 0;
	white-space:nowrap
}
.professionalnav .links>a:after {
	bottom:17px;
	height:2px
}
.professionalnav .drop>button {
	color:var(--ink);
	font-size:12px;
	font-weight:700;
	padding:25px 0;
	white-space:nowrap
}
.professionalnav .dropmenu {
	top:calc(100% - 8px);
	left:-18px;
	min-width:230px;
	border-top:3px solid var(--red);
	padding:10px;
	box-shadow:0 16px 45px #1323441a;
	border-radius:0 0 12px 12px
}
.professionalnav .dropmenu a {
	font-size:12px;
	padding:11px 13px;
	border-radius:6px;
transition:background .15s
}
.professionalnav .dropmenu a:hover {
	background:#fff0f3;
	color:var(--red)
}
.professionalnav .logindrop {
	margin:0 0 0 8px
}
.professionalnav .logindrop>button {
	background:var(--ink)!important;
	color:#fff;
	border:0!important;
	border-radius:8px;
	padding:13px 23px!important;
	font-weight:700;
	box-shadow:0 6px 16px #13234418
}
.professionalnav .logindrop>button:hover {
	background:var(--red)!important
}
.professionalnav .logindrop .dropmenu {
	left:auto;
	right:0;
	top:calc(100% + 10px)
}
.headerstrip {
	background:#f5f7fb;
	border-top:1px solid #edf0f6;
	border-bottom:1px solid #e8edf4;
	font-size:10px;
	color:#6b778b
}
.headerstrip>.wrap {
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding-top:9px;
	padding-bottom:9px
}
.headerstrip span {
	display:flex;
	align-items:center;
	gap:9px
}
.headerstrip i {
	width:6px;
	height:6px;
	background:var(--red);
	border-radius:50%
}
.headerstrip .wrap>div {
	display:flex;
	gap:25px
}
.headerstrip a {
	color:#283a59;
	font-weight:700
}
.headerstrip a:last-child {
	color:var(--red)
}
html {
	scroll-padding-top:155px
}
.hero {
	min-height:665px;
	border-radius:0;
	background:#111d34
}
.hero:after {
	background:linear-gradient(90deg, #0d1830ed 0%, #0d1830c4 38%, #0d183061 66%, #0d183016 100%);
	pointer-events:none
}
.hero-slides {
	position:absolute;
	inset:0;
	display:flex;
	width:100%;
	height:100%;
	transition:transform 1s cubic-bezier(.22, .65, .3, 1);
	will-change:transform
}
.hero-slide {
	flex:0 0 100%;
	position:relative;
	height:100%;
	overflow:hidden
}
.hero-slide img {
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	opacity:.84
}
.herobody {
	padding:88px 0 110px;
	max-width:780px
}
.hero h1 {
	font-size:clamp(44px, 5.1vw, 73px);
	line-height:1.12;
	letter-spacing:-3px;
	font-weight:800
}
.hero p {
	font-size:15px;
	line-height:1.9;
	color:#d4ddec;
	max-width:530px
}
.hero .eyebrow {
	padding:0;
	border:0;
	background:none;
	border-radius:0;
	letter-spacing:2.3px;
	font-size:10px;
	color:#ffcbd1
}
.hero .eyebrow:before {
	width:32px;
	background:#f24c63
}
.hero .btn {
	border-radius:7px;
	padding:14px 24px;
	font-size:12px
}
.hero .btn.outline {
	background:#ffffff0d
}
.hero-feature {
	right:5%;
	bottom:92px;
	padding:18px 24px;
	max-width:365px;
	border-radius:12px;
	background:#111d344d
}
.hero-feature strong {
	font-size:16px
}
.hero-feature small {
	font-size:10px
}
.hero-feature b {
	font-size:30px
}
.herobottom {
	bottom:32px
}
.hero .control {
	border-radius:7px;
	width:37px;
	height:37px
}
.hero .dots button {
	height:4px;
	width:17px;
	border-radius:2px
}
.hero .dots button.active {
	width:42px
}
.btn {
	border-radius:7px;
	font-size:12px;
	padding:14px 23px
}
.quick {
	padding:0;
	background:#fff;
	border-bottom:1px solid var(--line)
}
.quick .wrap {
	border:0;
	border-radius:0;
	box-shadow:none
}
.quick a {
	padding:25px 20px
}
.quick span {
	background:#f7f0f2;
	border-radius:10px;
	min-width:42px;
	height:42px;
	font-size:22px
}
.quick strong {
	font-size:12px;
	font-weight:800
}
.quick small {
	font-size:10px
}
.sectionhead p {
	font-size:13px;
	line-height:1.9
}
.split p {
	font-size:14px
}
.eyebrow {
	font-size:10px;
	letter-spacing:2.2px
}
section {
	padding:80px 0
}
.course {
	border-radius:12px
}
.course h3 {
	font-size:15px;
	line-height:1.4;
	min-height:45px
}
.coursebody {
	padding:17px 14px
}
.course p {
	font-size:11px;
	line-height:1.9;
	min-height:82px
}
.coursefoot button {
	font-family:inherit
}
.servicecard {
	border-radius:12px
}
.servicecard h3 {
	font-size:19px
}
.servicecard p {
	font-size:12px
}
.why {
	border-radius:18px
}
.why article {
	border-radius:12px
}
.why article h3 {
	font-size:20px
}
.why p {
	font-size:12px
}
.staff {
	border-radius:12px
}
.staff h3 {
	font-size:17px
}
.staff p {
	font-size:11px
}
.quote {
	border-radius:16px
}
.quote blockquote {
	font-size:22px
}
.cta {
	border-radius:16px
}
.form {
	border-radius:14px
}
.footer {
	background:#101c32
}
.footerlead h2 {
	font-size:36px
}
.footergrid h4 {
	font-size:13px;
	letter-spacing:.2px
}
.footergrid a {
	font-size:11px
}
.footer p {
	font-size:12px
}
.footerchips span {
	border-radius:5px
}
.footerlogo {
	border-radius:7px
}
.copyright {
	font-size:10px
}
.technicalintro {
	background:#f7f9fc
}
.technicalgrid {
	display:grid;
	grid-template-columns:1.1fr 1fr;
	gap:70px;
	align-items:center
}
.technicalvisual {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px
}
.technicaltile {
	border:1px solid #e1e7f0;
	background:white;
	padding:25px;
	border-radius:12px
}
.technicaltile span {
	display:inline-block;
	font-size:25px;
	color:var(--red);
	margin-bottom:12px
}
.technicaltile h3 {
	font-size:16px;
	margin:0 0 8px
}
.technicaltile p {
	font-size:12px;
	color:var(--muted);
	margin:0
}
.technicaltile:nth-child(2), .technicaltile:nth-child(3) {
background:#15223c;
color:white;
border-color:#15223c
}
.technicaltile:nth-child(2) p, .technicaltile:nth-child(3) p {
color:#c0cbe0
}
.technicalcopy>p {
	font-size:14px;
	color:var(--muted)
}
@media(max-width:1200px) {
.professionalnav {
gap:22px
}
.signature {
width:175px
}
.signature .logo {
width:165px
}
.professionalnav .links {
gap:17px;
font-size:11px
}
.professionalnav .drop>button {
font-size:11px
}
.professionalnav .logindrop>button {
padding:11px 18px!important
}
.technicalgrid {
gap:40px
}
}
@media(max-width:1000px) and (min-width:761px) {
.wrap {
width:calc(100% - 36px)
}
.professionalnav {
gap:12px
}
.signature {
width:145px
}
.signature .logo {
width:145px
}
.signature>span {
font-size:6px
}
.professionalnav .links {
gap:12px;
font-size:10px
}
.professionalnav .drop>button {
font-size:10px
}
.professionalnav .logindrop {
margin-left:0
}
.professionalnav .logindrop>button {
padding:10px 13px!important
}
.hero h1 {
font-size:60px
}
}
@media(max-width:760px) {
.wrap {
width:calc(100% - 32px)
}
.top {
font-size:10px
}
.professionalnav {
height:84px;
gap:20px
}
.signature {
width:165px;
align-items:flex-start
}
.signature .logo {
width:155px;
height:69px
}
.signature>span {
font-size:7px;
letter-spacing:1.4px;
margin-top:-6px
}
.professionalnav>.menu {
display:block;
border:1px solid #e0e6ef;
border-radius:8px;
width:43px;
height:43px;
padding:0;
line-height:1;
color:var(--ink);
font-size:23px
}
.professionalnav .links {
display:none;
position:absolute;
top:84px;
left:0;
right:0;
background:#fff;
padding:15px 22px;
border-bottom:3px solid var(--red);
box-shadow:0 16px 24px #15223c18;
max-height:calc(100vh - 125px);
overflow:auto;
justify-content:flex-start;
align-items:stretch;
font-size:13px;
gap:0
}
.professionalnav .links.open {
display:flex;
flex-direction:column
}
.professionalnav .links>a {
padding:13px 0;
border-bottom:1px solid #f0f2f7
}
.professionalnav .links>a:after {
display:none
}
.professionalnav .drop>button {
width:100%;
text-align:left;
padding:13px 0;
font-size:13px;
border-bottom:1px solid #f0f2f7
}
.professionalnav .dropmenu {
position:static;
min-width:0;
border:0;
box-shadow:none;
top:auto;
background:#f7f9fc;
border-radius:8px;
padding:6px 10px
}
.professionalnav .dropmenu a {
font-size:12px;
padding:10px 12px
}
.professionalnav .logindrop {
margin:12px 0 0
}
.professionalnav .logindrop>button {
padding:13px 17px!important
}
.professionalnav .logindrop .dropmenu {
margin-top:10px;
position:static
}
.headerstrip .wrap {
padding:7px 0
}
.headerstrip span {
font-size:9px
}
.headerstrip .wrap>div a:first-child {
display:none
}
.headerstrip .wrap>div {
gap:0;
font-size:9px
}
.headerstrip span {
max-width:190px
}
html {
scroll-padding-top:120px
}
.hero {
min-height:610px
}
.herobody {
padding:70px 0 100px
}
.hero h1 {
font-size:clamp(42px, 9.5vw, 62px);
letter-spacing:-2px
}
.hero p {
font-size:13px;
max-width:460px
}
.hero .eyebrow {
font-size:8px;
letter-spacing:1.6px;
margin-bottom:22px
}
.hero .btn {
padding:12px 17px;
font-size:10px
}
.hero .actions {
gap:10px
}
.hero-slide img {
object-position:65%
}
.hero:after {
background:linear-gradient(90deg, #0d1830ed, #0d1830a6)
}
.quick a {
padding:18px 9px
}
.quick strong {
font-size:10px
}
.quick small {
font-size:9px
}
.quick span {
min-width:35px;
width:35px;
height:35px;
font-size:18px
}
section {
padding:60px 0
}
h2 {
font-size:31px;
letter-spacing:-1px
}
.course h3 {
font-size:15px
}
.course p {
font-size:11px
}
.technicalgrid {
grid-template-columns:1fr;
gap:25px
}
.technicalvisual {
gap:12px
}
.technicaltile {
padding:20px 16px
}
.technicaltile h3 {
font-size:14px
}
.technicaltile p {
font-size:11px
}
.technicalcopy>p {
font-size:13px
}
.servicecard h3 {
font-size:16px
}
.quote blockquote {
font-size:19px
}
.footerlead h2 {
font-size:29px
}
.footergrid a {
font-size:10px
}
.footergrid p {
font-size:11px
}
}
@media(prefers-reduced-motion:reduce) {
.hero-slides {
transition:none
}
}
/* Reference-inspired institute edition */
body, button, input, select, textarea {
	font-family:'Inter', Arial, sans-serif
}
h1, h2, h3, h4 {
	font-family:'Plus Jakarta Sans', 'Inter', Arial, sans-serif
}
.top {
	background:#152a4c;
	font-size:12px;
	padding:10px 0
}
.top .wrap:after {
	display:none
}
.top .wrap {
	align-items:center
}
.toplinks {
	display:flex;
	gap:8px
}
.toplinks a {
	padding:7px 12px;
	background:#d91d35;
	border-radius:6px;
	font-size:10px;
	font-weight:700;
	color:white
}
.professionalnav {
	height:120px;
	gap:25px
}
.signature {
	width:auto;
	flex-direction:row;
	gap:15px;
	text-align:left
}
.signature .logo {
	width:160px;
	height:85px
}
.signature>span {
	display:none
}
.institutionname strong {
	font-family:'Plus Jakarta Sans', sans-serif;
	font-size:28px;
	font-weight:800;
	letter-spacing:-.8px;
	color:#152a4c;
	display:block;
	line-height:1.2
}
.institutionname small {
	font-size:12px;
	color:var(--red);
	letter-spacing:2px;
	font-weight:700
}
.institutionname p {
	margin:5px 0 0;
	font-size:10px;
	color:#7a8699
}
.mastactions {
	margin-left:auto;
	display:flex;
	gap:12px;
	align-items:center
}
.mastcard {
	border:1px solid #e0e9f5;
	background:#f7faff;
	padding:12px 17px;
	border-radius:12px;
	display:flex;
	align-items:center;
	gap:12px
}
.mastcard>b {
	width:35px;
	height:35px;
	background:#e7f0ff;
	display:grid;
	place-items:center;
	border-radius:9px;
	color:#2560b4;
	font-size:21px
}
.mastcard strong {
	display:block;
	font-size:11px;
	color:#213c62
}
.mastcard small {
	font-size:9px;
	color:#8291a7
}
.mastactions .btn {
	border-radius:25px;
	padding:14px 22px
}
.mainmenu {
	background:linear-gradient(90deg, #122747, #173f6c);
	border-bottom:3px solid var(--red)
}
.mainmenu .wrap {
	display:flex;
	align-items:center;
	gap:20px
}
.mainmenu .links {
	position:static;
	display:flex;
	align-items:center;
	flex:1;
	justify-content:space-between;
	gap:18px;
	color:white;
	font-size:12px
}
.mainmenu .links>a {
	padding:18px 0;
	white-space:nowrap
}
.mainmenu .links>a:after {
	bottom:10px
}
.mainmenu .drop>button {
	font-size:12px;
	color:white;
	padding:18px 0
}
.mainmenu .dropmenu {
	z-index:30;
	color:#152a4c;
	top:100%
}
.mainmenu .dropmenu a {
	font-size:12px;
	border-radius:5px
}
.mainmenu .dropmenu a:hover {
	color:var(--red);
	background:#fff0f3
}
.mainmenu .logindrop {
	margin-left:0
}
.mainmenu .logindrop>button {
	background:transparent!important;
	color:white;
	padding:18px 0!important;
	border:0!important
}
.navapply {
	align-self:stretch;
	display:flex;
	align-items:center;
	background:var(--red);
	color:white;
	font-weight:bold;
	padding:0 20px;
	font-size:11px
}
.headerstrip {
	display:none
}
.hero {
	min-height:580px
}
.herobody {
	padding:75px 0 100px
}
.hero h1 {
	font-size:clamp(42px, 4.7vw, 66px)
}
.course .cover {
	height:190px
}
.coursebody {
	padding:19px 15px
}
.course h3 {
	font-size:15px;
	line-height:1.5;
	min-height:48px
}
.course p {
	min-height:86px;
	font-size:11px;
	line-height:1.8
}
.coursefoot {
	display:flex;
	justify-content:space-between;
	gap:7px;
	flex-wrap:wrap;
	border:0;
	padding:0
}
.coursefoot span {
	width:100%;
	font-size:10px;
	margin:2px 0 8px
}
.coursefoot button {
	font-size:10px;
	border:1px solid #e1e6ef;
	border-radius:6px;
	padding:10px 8px;
	flex:1;
	background:white
}
.coursefoot .registercourse {
	background:var(--red);
	color:white;
	border:1px solid var(--red);
	border-radius:6px;
	padding:10px 8px;
	font-size:10px;
	flex:1;
	text-align:center;
	font-weight:bold
}
.course .pill {
	font-size:8px
}
.courses .sectionhead h2 {
	margin-bottom:5px
}
.countersection {
	padding:60px 0;
	background:#f5f8fd;
	color:var(--ink)
}
.countersection>.wrap {
	display:block
}
.counterintro {
	text-align:center;
	margin-bottom:35px
}
.counterintro h2 br {
	display:none
}
.counterintro p {
	color:var(--muted)
}
.countergrid {
	gap:22px
}
.countergrid>div {
	background:white;
	border:1px solid #e0e7f0;
	border-radius:15px;
	padding:28px 20px;
	box-shadow:0 10px 26px #19335108;
	position:relative;
	overflow:hidden
}
.countergrid>div:before {
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:4px;
	background:var(--red)
}
.countergrid>div:nth-child(2):before {
background:#1e72d1
}
.countergrid>div:nth-child(3):before {
background:#15987b
}
.countergrid>div:nth-child(4):before {
background:#9257d0
}
.countericon {
	display:grid;
	place-items:center;
	width:54px;
	height:54px;
	border-radius:14px;
	background:#fff0f3;
	color:var(--red);
	font-size:25px;
	margin:0 auto 15px
}
.countergrid>div:nth-child(2) .countericon {
background:#edf4ff;
color:#1e72d1
}
.countergrid>div:nth-child(3) .countericon {
background:#eaf9f4;
color:#15987b
}
.countergrid>div:nth-child(4) .countericon {
background:#f4edff;
color:#9257d0
}
.countergrid strong {
	color:var(--ink);
	background:none;
	font-family:'Plus Jakarta Sans', sans-serif;
	font-size:46px;
	letter-spacing:-1px;
	line-height:1.4
}
.countergrid span {
	color:#7b879b;
	font-size:12px
}
.partnercarousel {
	overflow:hidden
}
.partnertrack {
	display:flex;
	gap:18px;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	scrollbar-width:none;
	padding:10px 0
}
.partnertrack::-webkit-scrollbar {
display:none
}
.partnerlogo {
	flex:0 0 calc((100% - 54px)/4);
	background:white;
	border:1px solid #e1e8f1;
	border-radius:13px;
	padding:20px;
	text-align:center;
	scroll-snap-align:start
}
.partnerlogo img {
	width:100%;
	height:90px;
	object-fit:contain
}
.partnerlogo small {
	display:block;
	font-size:9px;
	color:#8a95a5;
	margin-top:12px
}
.partners .wrap {
	display:block
}
.partners h3 {
	font-size:30px;
	margin:8px 0
}
.partnerheading {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:20px;
	margin-bottom:20px
}
.pagebanner {
	padding:65px 0;
	background:linear-gradient(110deg, #112847, #254773);
	color:white
}
.pagebanner h1 {
	font-size:42px;
	margin:12px 0;
	line-height:1.2
}
.pagebanner p {
	color:#c9d7e9;
	max-width:650px;
	font-size:14px
}
.breadcrumb {
	font-size:11px;
	color:#d4deed
}
.pagecontent {
	padding:65px 0
}
.innergrid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:55px
}
.infoletter {
	background:#f7f9fd;
	border:1px solid #e4eaf3;
	padding:30px;
	border-radius:15px
}
.infoletter h3 {
	margin-top:0
}
.innerform {
	max-width:900px;
	margin:auto
}
.innerform .fields {
	gap:20px
}
.innerform label {
	font-size:12px
}
.innerform .formnote {
	font-size:12px;
	background:#eaf1fc;
	padding:14px;
	border-radius:7px;
	color:#46638b
}
.verifynote {
	font-size:12px;
	color:#667990
}
.innergrid p {
	font-size:14px;
	color:var(--muted)
}
.innerlist {
	padding-left:20px;
	color:#65738a;
	font-size:14px
}
.innerlist li {
	margin:10px 0
}
.successmessage {
	padding:15px;
	background:#edf4ff;
	color:#285180;
	border-radius:8px;
	font-size:12px
}
.formhelp {
	font-size:11px;
	color:#7b8899
}
.modalcontent .btn {
	color:white!important
}
@media(max-width:1150px) {
.institutionname strong {
font-size:23px
}
.signature .logo {
width:135px
}
.mastcard {
padding:10px 12px
}
.mastcard small {
display:none
}
.mainmenu .links {
gap:14px
}
.mastactions {
gap:8px
}
.mastactions .btn {
font-size:10px;
padding:12px 17px
}
.course .cover {
height:165px
}
}
@media(max-width:900px) {
.mastcard {
display:none
}
.institutionname strong {
font-size:24px
}
.mainmenu .links {
gap:10px;
font-size:10px
}
.mainmenu .drop>button {
font-size:10px
}
.navapply {
padding:0 12px;
font-size:10px
}
.toplinks a {
padding:6px 8px;
font-size:9px
}
}
@media(max-width:760px) {
.top .wrap {
justify-content:space-between
}
.top .wrap>span {
display:none
}
.toplinks {
gap:5px
}
.toplinks a {
font-size:8px;
padding:5px 7px
}
.top .wrap>a {
font-size:9px
}
.toplinks a:nth-child(n+3) {
display:none
}
.professionalnav {
height:94px;
gap:12px
}
.signature {
gap:9px;
flex:1;
width:auto
}
.signature .logo {
width:88px;
height:60px
}
.institutionname strong {
font-size:20px;
letter-spacing:-.5px
}
.institutionname small {
font-size:8px;
letter-spacing:.8px
}
.institutionname p {
font-size:8px;
margin-top:3px
}
.mastactions {
display:none
}
.mainmenu {
height:4px
}
.mainmenu .links {
display:none;
position:absolute;
top:98px;
left:0;
right:0;
flex-direction:column;
background:white;
color:var(--ink);
padding:15px 22px;
align-items:stretch;
max-height:calc(100vh - 135px);
overflow:auto;
gap:0;
border-bottom:3px solid var(--red)
}
.mainmenu .links.open {
display:flex
}
.mainmenu .links>a {
font-size:13px;
padding:12px 0;
border-bottom:1px solid #eef1f6
}
.mainmenu .drop>button {
color:var(--ink);
width:100%;
text-align:left;
font-size:13px;
padding:12px 0
}
.mainmenu .dropmenu {
position:static;
box-shadow:none;
background:#f7f9fc;
border:0;
margin-bottom:5px
}
.mainmenu .logindrop>button {
color:var(--ink);
padding:12px 0!important
}
.navapply {
display:none
}
.hero {
min-height:565px
}
.herobody {
padding:65px 0 95px
}
.hero h1 {
font-size:44px
}
.course .cover {
height:180px
}
.coursebody {
padding:17px 12px
}
.course h3 {
font-size:14px
}
.course p {
font-size:11px;
min-height:82px
}
.countergrid {
gap:14px
}
.countergrid>div {
padding:22px 12px
}
.countergrid strong {
font-size:36px
}
.countergrid span {
font-size:10px
}
.countericon {
width:44px;
height:44px;
font-size:22px
}
.partnerlogo {
flex-basis:calc((100% - 18px)/2);
padding:18px 12px
}
.partnerlogo img {
height:80px
}
.partnerheading {
align-items:start
}
.partners h3 {
font-size:25px
}
.pagebanner {
padding:45px 0
}
.pagebanner h1 {
font-size:32px
}
.pagecontent {
padding:45px 0
}
.innergrid {
grid-template-columns:1fr;
gap:25px
}
.infoletter {
padding:23px
}
.innerform .fields {
grid-template-columns:1fr
}
}
/* Compact reference header and homepage composition */
:root {
--ink:#13284a;
--red:#d91d35;
--muted:#66778f
}
body {
	background:#fff;
	font-size:14px
}
.wrap {
	width:min(1420px, calc(100% - 40px))
}
.top {
	background:#142747;
	padding:7px 0
}
.top .wrap {
	justify-content:space-between
}
.top .wrap>a {
	font-size:11px;
	color:white
}
.utilitylinks {
	display:flex;
	gap:8px;
	align-items:center
}
.utilitylinks a {
	background:#d91d35;
	color:white;
	font-size:10px;
	font-weight:700;
	border-radius:6px;
	padding:8px 13px;
	line-height:1.4
}
.utilitylinks a:hover {
	background:#b81329
}
.referenceheader {
	background:#142747;
	box-shadow:0 8px 20px #11254512
}
.announcement {
	background:#edf4fd;
	border-bottom:1px solid #d6e3f6;
	color:#345579
}
.announcement>.wrap {
	display:flex;
	gap:15px;
	align-items:center;
	height:31px;
	font-size:9px
}
.announcement b {
	align-self:stretch;
	display:flex;
	align-items:center;
	background:#2076ba;
	color:white;
	padding:0 15px;
	font-size:9px;
	letter-spacing:.4px;
	white-space:nowrap;
	clip-path:polygon(0 0, 92% 0, 100% 50%, 92% 100%, 0 100%)
}
.announcementtext {
	overflow:hidden;
	white-space:nowrap;
	flex:1;
	font-size:10px
}
.announcement a {
	background:var(--red);
	color:white;
	font-weight:bold;
	padding:4px 10px;
	border-radius:4px;
	font-size:8px;
	white-space:nowrap
}
.headercanvas {
	padding:0 0 10px
}
.headercard {
	background:white;
	border-radius:0 0 14px 14px;
	min-height:100px;
	display:flex;
	align-items:center;
	gap:25px;
	padding:17px 22px
}
.referencebrand {
	display:flex;
	align-items:center;
	gap:12px;
	flex-shrink:0
}
.referencebrand>img {
	width:104px;
	height:66px;
	object-fit:contain
}
.referencebrand strong {
	display:block;
	color:#a91b2c;
	font-family:'Plus Jakarta Sans', sans-serif;
	font-size:30px;
	font-weight:800;
	letter-spacing:.5px;
	line-height:1.1
}
.referencebrand span {
	font-size:10px;
	letter-spacing:1.6px;
	display:block;
	font-weight:800;
	color:#152e52;
	margin-top:5px
}
.referencebrand small {
	display:block;
	color:#7a879c;
	font-size:8px;
	margin-top:5px
}
.referencenav {
	margin-left:auto;
	flex:1
}
.referencenav .links {
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:20px;
	font-size:11px;
	color:#182a49;
	position:static
}
.referencenav .links>a {
	padding:16px 0;
	white-space:nowrap;
	font-weight:800
}
.referencenav .links>a:after {
	bottom:9px
}
.referencenav .drop>button {
	font-size:11px;
	color:#182a49;
	font-weight:800;
	padding:16px 0;
	white-space:nowrap
}
.referencenav .drop>button:hover {
	color:var(--red)
}
.referencenav .dropmenu {
	top:100%;
	left:-10px;
	border-top:3px solid #d91d35;
	min-width:225px;
	border-radius:0 0 8px 8px;
	z-index:30
}
.referencenav .dropmenu a {
	font-size:11px;
	padding:10px 12px;
	border-radius:5px
}
.referencenav .dropmenu a:hover {
	background:#fff0f3;
	color:var(--red)
}
.referencenav .logindrop {
	margin-left:0
}
.referencenav .logindrop>button {
	padding:11px 14px!important;
	background:#fff0f3!important;
	color:var(--red);
	border:0!important;
	border-radius:7px;
	box-shadow:none
}
.headercard>.menu {
	display:none
}
.hero {
	min-height:475px;
	background:#142747;
	border-radius:0
}
.hero:after {
	background:linear-gradient(90deg, #122544 0%, #122544 49%, #12254480 62%, #12254400 77%)
}
.hero-slides {
	left:48%;
	width:52%
}
.hero-slide img {
	opacity:1;
	object-position:center
}
.herobody {
	padding:58px 0 83px;
	max-width:700px;
	width:54%
}
.hero h1 {
	font-size:clamp(36px, 3.7vw, 53px);
	line-height:1.17;
	letter-spacing:-1.5px;
	margin-bottom:18px
}
.hero .eyebrow {
	letter-spacing:1px;
	font-size:9px;
	margin-bottom:20px;
	padding:6px 11px;
	background:#ffffff0b;
	border:1px solid #ffffff25;
	border-radius:20px
}
.hero p {
	font-size:13px;
	line-height:1.85;
	max-width:470px;
	margin-bottom:0
}
.hero .actions {
	margin-top:24px;
	gap:10px
}
.hero .btn {
	font-size:10px;
	padding:12px 17px;
	border-radius:6px
}
.hero-feature {
	display:none
}
.herobottom {
	bottom:22px
}
.herobottom .wrap {
	justify-content:flex-start;
	gap:28px
}
.hero .control {
	width:30px;
	height:30px;
	font-size:12px
}
.hero .dots button {
	height:6px;
	width:6px
}
.hero .dots button.active {
	width:27px
}
.quick .wrap {
	border-radius:0;
	box-shadow:none
}
.quick a {
	padding:19px 20px
}
.quick strong {
	font-size:12px
}
.quick small {
	font-size:10px
}
section {
	padding:48px 0
}
.sectionhead {
	margin-bottom:24px;
	gap:20px
}
h2 {
	font-size:32px;
	letter-spacing:-.8px;
	margin-bottom:15px
}
.sectionhead p {
	font-size:12px;
	max-width:410px
}
.split {
	gap:45px
}
.aboutvisual img {
	height:335px;
	border-radius:12px
}
.aboutvisual {
	padding:0 16px 16px 0
}
.tag {
	padding:17px 20px;
	border-radius:10px;
	border-width:5px
}
.tag strong {
	font-size:18px
}
.tag small {
	font-size:10px
}
.split p {
	font-size:13px;
	line-height:1.9
}
.checks {
	gap:9px;
	margin:18px 0
}
.checks span {
	padding:9px;
	font-size:11px
}
.filters {
	margin-bottom:16px
}
.filters button {
	padding:7px 15px;
	font-size:11px
}
.courses {
	background:#f4f7fc
}
.coursegrid {
	gap:14px;
	padding:4px 0 18px
}
.course {
	flex-basis:calc((100% - 70px)/6);
	border-radius:10px;
	box-shadow:0 5px 15px #16274408
}
.course .cover {
	height:170px
}
.course h3 {
	font-size:14px
}
.coursebody {
	padding:15px 12px
}
.course p {
	font-size:11px;
	min-height:81px
}
.course .pill {
	font-size:7px;
	letter-spacing:.5px
}
.coursefoot button, .coursefoot .registercourse {
	font-size:9px;
	padding:9px 6px
}
.sliderbar {
	margin:0
}
.why {
	margin:0;
	border-radius:0;
	padding:48px 0
}
.whygrid {
	gap:30px
}
.why article {
	padding:22px
}
.why article h3 {
	font-size:18px
}
.why article p {
	font-size:12px
}
.technicalgrid {
	gap:40px
}
.technicaltile {
	padding:20px
}
.technicaltile span {
	margin-bottom:8px;
	font-size:23px
}
.technicaltile h3 {
	font-size:15px
}
.technicaltile p {
	font-size:11px
}
.servicegrid {
	gap:16px
}
.servicecard {
	padding:23px 19px;
	border-radius:10px
}
.serviceicon {
	width:46px;
	height:46px;
	font-size:24px;
	border-radius:10px;
	margin-bottom:18px
}
.servicecard h3 {
	font-size:17px
}
.servicecard p {
	font-size:12px
}
.servicecard b {
	margin-top:18px;
	padding-top:13px
}
.countersection {
	padding:40px 0
}
.counterintro {
	margin-bottom:25px
}
.counterintro h2 {
	font-size:29px
}
.countergrid>div {
	padding:22px 18px
}
.countergrid strong {
	font-size:40px
}
.countergrid span {
	font-size:11px
}
.countericon {
	width:45px;
	height:45px;
	font-size:22px;
	margin-bottom:8px
}
.staff img {
	height:235px
}
.staff div {
	padding:18px
}
.staff h3 {
	font-size:16px
}
.partners {
	padding:35px 0
}
.partners h3 {
	font-size:27px
}
.partnerheading {
	margin-bottom:12px
}
.partnerlogo {
	padding:16px
}
.partnerlogo img {
	height:75px
}
.gallerytrack {
	gap:16px
}
.photo img {
	height:270px
}
.photo {
	border-radius:10px
}
.photo span {
	font-size:17px;
	bottom:18px;
	left:18px
}
.videocard img {
	height:240px
}
.videocard {
	border-radius:10px
}
.videocard strong {
	font-size:17px
}
.testlayout {
	gap:45px
}
.quote {
	padding:30px
}
.quote blockquote {
	font-size:20px;
	margin-bottom:20px
}
.cta {
	margin:0;
	border-radius:0;
	padding:32px 0
}
.cta h2 {
	font-size:28px
}
.contactgrid {
	gap:45px
}
.form {
	padding:27px
}
.contactline {
	padding:16px 0;
	font-size:13px
}
.footerlead {
	padding:35px 0;
	margin-bottom:32px
}
.footerlead h2 {
	font-size:30px
}
.footergrid {
	gap:35px
}
.copyright {
	margin-top:30px
}
.round {
	width:35px;
	height:35px;
	font-size:12px
}
.note {
	font-size:10px;
	margin-top:12px
}
@media(max-width:1200px) {
.headercard {
gap:16px;
padding:15px 18px
}
.referencebrand>img {
width:85px
}
.referencebrand strong {
font-size:27px
}
.referencebrand span {
font-size:8px;
letter-spacing:1px
}
.referencenav .links {
gap:15px;
font-size:10px
}
.referencenav .drop>button {
font-size:10px
}
.referencenav .logindrop>button {
padding:10px 11px!important
}
.herobody {
max-width:600px
}
.hero h1 {
font-size:44px
}
.course .cover {
height:140px
}
}
@media(max-width:1000px) and (min-width:761px) {
.headercard {
flex-wrap:wrap;
gap:4px
}
.referencebrand {
width:100%;
justify-content:center;
gap:12px
}
.referencebrand>img {
width:90px;
height:48px
}
.referencebrand strong {
font-size:24px
}
.referencebrand small {
display:none
}
.referencenav {
width:100%;
margin-left:0
}
.referencenav .links {
justify-content:space-between
}
.hero h1 {
font-size:39px
}
.hero p {
font-size:12px
}
.hero .actions {
max-width:370px
}
.course {
flex-basis:calc((100% - 28px)/3)
}
.course .cover {
height:170px
}
}
@media(max-width:760px) {
.wrap {
width:calc(100% - 24px)
}
.top {
padding:6px 0
}
.top .wrap {
gap:10px
}
.top .wrap>a {
font-size:9px
}
.utilitylinks {
gap:5px
}
.utilitylinks a {
padding:6px 8px;
font-size:8px
}
.utilitylinks a:nth-child(n+3) {
display:none
}
.announcement>.wrap {
height:28px;
gap:7px
}
.announcement b {
padding:0 8px;
font-size:7px
}
.announcementtext {
font-size:8px
}
.announcement a {
display:none
}
.headercanvas {
padding-bottom:7px
}
.headercard {
padding:11px 12px;
min-height:79px;
border-radius:0 0 10px 10px;
gap:10px
}
.referencebrand {
gap:8px;
flex:1
}
.referencebrand>img {
width:78px;
height:52px
}
.referencebrand strong {
font-size:24px
}
.referencebrand span {
font-size:8px;
letter-spacing:.7px
}
.referencebrand small {
font-size:7px;
margin-top:3px
}
.headercard>.menu {
display:block;
flex-shrink:0;
width:36px;
height:36px;
border-radius:6px;
font-size:21px;
padding:0;
border:1px solid #e4e9f2
}
.referencenav {
margin:0;
flex:0
}
.referencenav .links {
display:none;
position:absolute;
top:114px;
left:12px;
right:12px;
border-radius:0 0 9px 9px;
max-height:calc(100vh - 155px);
overflow:auto;
padding:12px 18px;
background:white;
align-items:stretch;
box-shadow:0 18px 30px #11254433;
gap:0
}
.referencenav .links.open {
display:flex;
flex-direction:column
}
.referencenav .links>a {
padding:12px 0;
font-size:12px;
border-bottom:1px solid #edf1f7
}
.referencenav .drop>button {
width:100%;
text-align:left;
padding:12px 0;
font-size:12px
}
.referencenav .dropmenu {
position:static;
background:#f5f8fd;
border:0;
box-shadow:none;
min-width:0
}
.referencenav .logindrop>button {
margin-top:8px;
width:100%
}
.hero {
min-height:530px
}
.hero-slides {
left:0;
width:100%
}
.hero:after {
background:linear-gradient(90deg, #122544ed, #122544a6)
}
.herobody {
width:100%;
max-width:100%;
padding:52px 0 80px
}
.hero h1 {
font-size:43px;
max-width:500px
}
.hero p {
max-width:400px;
font-size:12px
}
.hero .btn {
font-size:9px;
padding:11px 14px
}
.hero .eyebrow {
font-size:8px
}
.hero .actions {
margin-top:22px
}
.quick a {
padding:15px 8px
}
.quick strong {
font-size:10px
}
.quick small {
font-size:8px
}
.quick span {
min-width:32px;
height:32px;
font-size:17px
}
.sectionhead {
gap:8px;
margin-bottom:20px
}
section {
padding:36px 0
}
h2 {
font-size:28px;
line-height:1.25
}
.sectionhead p {
font-size:11px
}
.split {
gap:25px
}
.aboutvisual img {
height:280px
}
.checks span {
font-size:10px
}
.filters button {
padding:7px 11px;
font-size:10px
}
.coursegrid {
gap:12px
}
.course {
flex-basis:calc((100% - 12px)/2)
}
.course .cover {
height:160px
}
.course h3 {
font-size:13px;
min-height:45px
}
.coursebody {
padding:13px 10px
}
.course p {
font-size:10px;
min-height:80px
}
.coursefoot button, .coursefoot .registercourse {
font-size:8px;
padding:8px 4px
}
.why {
padding:36px 0
}
.whygrid {
gap:18px
}
.why article {
padding:19px
}
.technicalgrid {
gap:24px
}
.technicaltile {
padding:17px 13px
}
.technicaltile h3 {
font-size:13px
}
.technicaltile p {
font-size:10px
}
.servicecard {
padding:19px 14px
}
.servicecard h3 {
font-size:15px
}
.servicecard p {
font-size:11px;
min-height:76px
}
.countergrid {
gap:12px
}
.countergrid>div {
padding:18px 12px
}
.countergrid strong {
font-size:33px
}
.counterintro h2 {
font-size:26px
}
.staff img {
height:195px
}
.staff div {
padding:14px
}
.staff h3 {
font-size:14px
}
.partnerlogo img {
height:70px
}
.photo img {
height:250px
}
.videocard img {
height:225px
}
.quote blockquote {
font-size:17px
}
.quote {
padding:24px
}
.testlayout {
gap:25px
}
.cta {
padding:28px 0
}
.cta h2 {
font-size:24px
}
.contactgrid {
gap:25px
}
.form {
padding:22px
}
.footerlead h2 {
font-size:26px
}
.footergrid {
gap:25px 18px
}
.footerlead {
padding:28px 0;
margin-bottom:28px
}
html {
scroll-padding-top:125px
}
}
/* Menu, clear logo and team carousel refinement */
.referencebrand {
	width:224px;
	gap:0;
	display:block;
	flex-shrink:0
}
.referencebrand>img {
	width:216px;
	height:108px;
	object-fit:contain;
	display:block;
	max-width:100%
}
.headercard {
	padding:10px 23px;
	min-height:122px;
	gap:30px
}
.referencenav .links {
	gap:24px;
	font-family:'Inter', Arial, sans-serif;
	font-size:14px;
	font-weight:600;
	letter-spacing:0
}
.referencenav .links>a {
	font-weight:600;
	padding:18px 0;
	line-height:1.5
}
.referencenav .drop>button {
	font-family:'Inter', Arial, sans-serif;
	font-size:14px;
	font-weight:600;
	padding:18px 0;
	line-height:1.5
}
.referencenav .logindrop>button {
	padding:12px 19px!important;
	font-weight:700
}
.referencenav .dropmenu a {
	font-size:13px;
	font-weight:500;
	padding:12px 14px;
	line-height:1.5
}
.referencenav .dropmenu {
	min-width:245px
}
.hero-slides {
	overflow:visible
}
.hero-slide {
	min-width:0;
	max-width:100%;
	flex-shrink:0
}
.hero-slide img {
	min-width:0;
	max-width:100%;
	display:block
}
.hero {
	overflow:hidden
}
#staff {
	background:linear-gradient(135deg, #f7f9fd, #fff4f5);
	position:relative
}
.teamcarousel {
	overflow:hidden;
	padding:4px 0 8px
}
.staffgrid {
	display:flex!important;
	gap:22px;
	overflow-x:auto;
	scrollbar-width:none;
	scroll-snap-type:x mandatory;
	padding:4px 0 16px
}
.staffgrid::-webkit-scrollbar {
display:none
}
.staff {
	flex:0 0 calc((100% - 66px)/4);
	min-width:0;
	scroll-snap-align:start;
	background:white;
	border:1px solid #e5eaf3;
	border-radius:15px;
	box-shadow:0 8px 24px #12274708;
transition:transform .25s, box-shadow .25s;
	position:relative
}
.staff:hover {
	transform:translateY(-4px);
	box-shadow:0 12px 28px #14274714
}
.staff img {
	width:100%;
	height:280px;
	object-fit:cover;
	object-position:top;
	border-radius:14px 14px 0 0
}
.staff div {
	padding:23px;
	position:relative;
	background:white;
	border-radius:0 0 14px 14px
}
.staff div:before {
	content:'';
	position:absolute;
	left:23px;
	top:0;
	width:42px;
	height:3px;
	background:var(--red)
}
.staff h3 {
	font-size:18px;
	margin:10px 0 8px;
	color:#142747;
	line-height:1.45
}
.staff .pill {
	font-size:9px;
	font-weight:700;
	letter-spacing:1.2px;
	color:#c6273c
}
.staff p {
	font-size:12px;
	color:#72819a
}
.teambar {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:20px;
	padding-top:7px
}
.teambar>span {
	font-size:12px;
	color:#7a879b
}
.teambar .round {
	width:39px;
	height:39px;
	border-color:#dbe4f0;
	background:white;
	box-shadow:0 4px 12px #18355008
}
.teambar .round:hover {
	background:var(--red);
	color:white;
	border-color:var(--red)
}
#gallery .photo img {
transition:transform .4s
}
.photo:hover img {
	transform:scale(1.06)
}
#photoModal {
	width:min(1100px, calc(100% - 24px));
	border-radius:12px
}
#photoModal .modalnav button {
	font-size:13px;
	font-weight:600;
	padding:10px 20px
}
#photoModal .modalbar {
	padding:15px 22px;
	font-size:15px
}
@media(max-width:1200px) {
.headercard {
gap:20px
}
.referencebrand {
width:194px
}
.referencebrand>img {
width:190px;
height:100px
}
.referencenav .links {
gap:17px;
font-size:13px
}
.referencenav .drop>button {
font-size:13px
}
.staff img {
height:245px
}
.staff div {
padding:20px
}
.staff h3 {
font-size:16px
}
}
@media(max-width:1000px) and (min-width:761px) {
.headercard {
flex-wrap:wrap;
justify-content:center;
padding:7px 18px 10px;
gap:4px
}
.referencebrand {
width:195px
}
.referencebrand>img {
height:85px
}
.referencenav {
flex-basis:100%
}
.referencenav .links {
gap:13px;
font-size:12px
}
.referencenav .drop>button {
font-size:12px
}
.referencenav .links>a, .referencenav .drop>button {
padding:12px 0
}
.staff {
flex-basis:calc((100% - 44px)/3)
}
}
@media(max-width:760px) {
.headercard {
min-height:99px;
padding:8px 13px;
gap:15px
}
.referencebrand {
width:auto;
flex:1
}
.referencebrand>img {
width:175px;
height:85px
}
.referencenav .links {
top:132px;
font-size:14px;
left:12px;
right:12px
}
.referencenav .links>a {
font-size:14px;
padding:14px 0;
font-weight:600
}
.referencenav .drop>button {
font-size:14px;
padding:14px 0;
font-weight:600
}
.referencenav .dropmenu a {
font-size:13px;
padding:11px 13px
}
.headercard>.menu {
width:39px;
height:39px
}
.staffgrid {
gap:14px
}
.staff {
flex-basis:calc((100% - 14px)/2)
}
.staff img {
height:225px
}
.staff div {
padding:18px 14px
}
.staff div:before {
left:14px;
width:32px
}
.staff h3 {
font-size:15px;
margin-top:9px
}
.staff p {
font-size:11px
}
.staff .pill {
font-size:8px;
letter-spacing:.5px
}
.teambar>span {
font-size:10px;
max-width:170px
}
.teambar .round {
width:34px;
height:34px
}
#staff h2 {
font-size:27px
}
#photoModal .modalnav button {
font-size:11px;
padding:9px 12px
}
html {
scroll-padding-top:150px
}
}
@media(max-width:420px) {
.staff {
flex-basis:80%
}
.staff img {
height:285px
}
.referencebrand>img {
width:160px
}
}
/* Consistent menu arrows, compact scroll header and reference-style panels */
.headercard {
	min-height:104px;
	padding:8px 19px;
	gap:20px
}
.referencebrand {
	width:195px
}
.referencebrand>img {
	width:190px;
	height:90px
}
.referencenav .links {
	gap:19px;
	justify-content:flex-end
}
.referencenav .drop>button {
	display:inline-flex;
	align-items:center;
	gap:7px;
	font-size:13px;
	line-height:1.4;
	padding:15px 0
}
.referencenav .links>a {
	font-size:13px;
	padding:15px 0
}
.navchevron {
	display:inline-block;
	width:6px;
	height:6px;
	border-right:1.5px solid currentColor;
	border-bottom:1.5px solid currentColor;
	transform:rotate(45deg);
	margin-top:-3px;
	flex-shrink:0;
transition:transform .2s
}
.drop.open .navchevron, .drop:focus-within .navchevron {
transform:rotate(225deg);
margin-top:3px
}
.header.compact .announcement {
	display:none
}
.header.compact .headercanvas {
	padding-bottom:5px
}
.header.compact .headercard {
	min-height:76px;
	padding-top:4px;
	padding-bottom:4px
}
.header.compact .referencebrand>img {
	height:68px;
	width:160px
}
.header.compact .referencebrand {
	width:166px
}
.headercard, .referencebrand>img {
transition:height .2s, min-height .2s
}
.newwhy {
	background:#f5f8fe;
	color:var(--ink);
	padding:42px 0
}
.centerheading {
	text-align:center;
	margin-bottom:27px
}
.centerheading .eyebrow {
	justify-content:center
}
.centerheading h2 {
	font-size:33px;
	font-weight:800;
	letter-spacing:-.8px;
	margin-bottom:12px
}
.centerheading h2 em {
	font-style:normal;
	color:#1b72d4
}
.centerheading>p {
	font-size:12px;
	color:#72829b;
	margin:0
}
.whytiles {
	display:grid;
	grid-template-columns:repeat(8, 1fr);
	gap:12px
}
.whytiles article {
	position:relative;
	text-align:center;
	border:1px solid #dfe7f5;
	border-radius:13px;
	background:white;
	padding:21px 11px 17px;
	box-shadow:0 6px 18px #193a6b05;
	overflow:hidden
}
.whytiles article:before {
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	height:4px;
	background:#2580e5
}
.whytiles article:nth-child(4n+2):before {
background:#d5a014
}
.whytiles article:nth-child(4n+3):before {
background:#ef3654
}
.whytiles article:nth-child(4n):before {
background:#1461b8
}
.whyicon {
	display:grid;
	place-items:center;
	width:45px;
	height:45px;
	border-radius:13px;
	background:#eaf3ff;
	color:#247adc;
	margin:0 auto 14px;
	font-size:24px;
	font-weight:700
}
.whytiles article:nth-child(4n+2) .whyicon {
background:#fff6dc;
color:#c89309
}
.whytiles article:nth-child(4n+3) .whyicon {
background:#fff0f3;
color:#e83550
}
.whytiles h3 {
	font-size:12px;
	line-height:1.45;
	margin:0 0 8px;
	color:#122c52
}
.whytiles p {
	font-size:10px;
	line-height:1.75;
	margin:0;
	color:#72829b
}
.countersection {
	background:linear-gradient(105deg, #081b35, #0956ad);
	border-top:4px solid #ffc62a;
	padding:24px 0;
	color:white
}
.counterintro {
	display:none
}
.countergrid {
	gap:0;
	grid-template-columns:repeat(4, 1fr)
}
.countergrid>div {
	display:grid;
	grid-template-columns:48px 1fr;
	column-gap:17px;
	align-items:center;
	border:0;
	border-right:1px solid #ffffff25;
	border-radius:0;
	background:transparent;
	padding:12px 30px;
	box-shadow:none;
	text-align:left
}
.countergrid>div:last-child {
	border:0
}
.countergrid>div:before {
	display:none
}
.countericon {
	grid-row:1/3;
	margin:0;
	width:44px;
	height:44px;
	font-size:30px;
	color:#ffd32d!important;
	background:transparent!important;
	border-radius:0
}
.countergrid strong {
	color:white;
	background:none;
	font-size:33px;
	line-height:1.2;
	letter-spacing:-.6px
}
.countergrid>div>span {
	font-size:11px;
	color:#d4e6ff;
	line-height:1.6;
	margin-top:5px
}
.newssection {
	background:#f5f8fd;
	padding:42px 0
}
.updategrid {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:20px
}
.updatepanel {
	background:white;
	border:1px solid #dfe7f5;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 8px 24px #143a7007
}
.updatepanel>header {
	background:linear-gradient(110deg, #102b50, #0864cb);
	color:white;
	padding:20px;
	display:flex;
	align-items:center;
	gap:13px
}
.updatepanel:nth-child(2)>header {
background:linear-gradient(100deg, #bd1030, #f02947)
}
.updatepanel:nth-child(3)>header {
background:linear-gradient(100deg, #a1770c, #e7b400)
}
.updatepanel>header>span {
	font-size:24px;
	background:#ffffff20;
	border:1px solid #ffffff25;
	width:43px;
	height:43px;
	display:grid;
	place-items:center;
	border-radius:9px
}
.updatepanel h3 {
	font-size:17px;
	margin:0 0 5px;
	color:white
}
.updatepanel>header small {
	font-size:10px;
	color:#ffffffd9
}
.updaterow {
	display:flex;
	align-items:center;
	gap:13px;
	padding:20px;
	border-bottom:1px solid #e8eef8;
	min-height:97px
}
.updaterow>span {
	background:#eaf3ff;
	color:#2b7bcf;
	border:1px solid #e1edff;
	display:grid;
	place-items:center;
	min-width:43px;
	height:48px;
	border-radius:11px;
	font-size:22px
}
.updatepanel:nth-child(2) .updaterow>span {
background:#fff0f3;
color:#e22849;
border-color:#ffe1e7
}
.updatepanel:nth-child(3) .updaterow>span {
background:#fff7de;
color:#c5990d;
border-color:#fff0b8
}
.updaterow strong {
	display:block;
	font-size:12px;
	color:#193253;
	line-height:1.5
}
.updaterow small {
	display:block;
	color:#8090a9;
	font-size:10px;
	margin-top:5px;
	line-height:1.5
}
.updaterow>b {
	margin-left:auto;
	color:#3289e5;
	font-size:23px;
	font-weight:400
}
.updaterow:hover {
	background:#f9fbff
}
.panelbottom {
	display:block;
	padding:14px;
	text-align:center;
	background:#f8faff;
	font-size:12px;
	font-weight:700;
	color:#2179d8
}
.panelbottom:hover {
	background:#edf4ff
}
@media(max-width:1200px) {
.referencenav .links {
gap:14px
}
.referencenav .links>a, .referencenav .drop>button {
font-size:12px
}
.referencebrand {
width:175px
}
.referencebrand>img {
width:170px;
height:82px
}
.headercard {
gap:14px
}
.whytiles {
grid-template-columns:repeat(4, 1fr)
}
.countergrid>div {
padding:12px 18px;
column-gap:12px
}
}
@media(max-width:1000px) and (min-width:761px) {
.headercard {
flex-wrap:nowrap;
min-height:90px;
gap:12px
}
.referencebrand {
width:150px;
flex-shrink:0
}
.referencebrand>img {
width:145px;
height:75px
}
.referencenav {
flex-basis:auto
}
.referencenav .links {
gap:10px
}
.referencenav .links>a, .referencenav .drop>button {
font-size:10px
}
.referencenav .logindrop>button {
padding:10px!important
}
.header.compact .referencebrand {
width:145px
}
.countergrid>div {
grid-template-columns:35px 1fr;
padding:9px 12px;
column-gap:8px
}
.countericon {
width:35px;
font-size:25px
}
.countergrid strong {
font-size:27px
}
.countergrid>div>span {
font-size:9px
}
.updatepanel h3 {
font-size:14px
}
.updaterow {
padding:15px
}
.updaterow strong {
font-size:11px
}
}
@media(max-width:760px) {
.headercard {
min-height:85px;
padding:6px 12px;
gap:12px
}
.referencebrand {
width:auto
}
.referencebrand>img {
width:160px;
height:73px
}
.referencenav .links {
top:117px;
gap:0
}
.referencenav .links>a, .referencenav .drop>button {
font-size:14px;
padding:13px 0
}
.referencenav .drop>button {
display:flex;
justify-content:space-between
}
.referencenav .dropmenu {
min-width:0
}
.header.compact .headercard {
min-height:70px
}
.header.compact .referencebrand {
width:auto
}
.header.compact .referencebrand>img {
height:60px;
width:145px
}
.header.compact .referencenav .links {
top:75px
}
.whytiles {
grid-template-columns:repeat(2, 1fr);
gap:12px
}
.whytiles article {
padding:20px 14px
}
.whytiles h3 {
font-size:13px
}
.whytiles p {
font-size:11px
}
.centerheading h2 {
font-size:27px
}
.centerheading>p {
font-size:11px;
line-height:1.8
}
.countergrid {
grid-template-columns:1fr 1fr;
gap:0
}
.countergrid>div {
padding:14px 12px;
border-right:1px solid #ffffff20;
border-bottom:1px solid #ffffff20;
grid-template-columns:36px 1fr;
column-gap:12px
}
.countergrid>div:nth-child(2) {
border-right:0
}
.countergrid>div:nth-child(3) {
border-bottom:0
}
.countergrid>div:last-child {
border:0
}
.countericon {
width:36px;
height:40px;
font-size:27px
}
.countergrid strong {
font-size:28px
}
.countergrid>div>span {
font-size:10px
}
.updategrid {
grid-template-columns:1fr;
gap:18px
}
.updatepanel h3 {
font-size:17px
}
.updaterow {
min-height:90px;
padding:18px
}
.header.compact {
box-shadow:0 5px 20px #1125451a
}
html {
scroll-padding-top:100px
}
}
/* Readable typography and requested desktop row sizes */
body {
	font-size:15px
}
.sectionhead p, .split p, .technicalcopy>p, .contactgrid p {
	font-size:14px;
	line-height:1.85
}
.eyebrow {
	font-size:11px
}
.quick strong {
	font-size:13px
}
.quick small {
	font-size:11px
}
.whytiles h3 {
	font-size:13px
}
.whytiles p {
	font-size:11px
}
.servicecard h3 {
	font-size:19px
}
.servicecard p {
	font-size:13px
}
.staffgrid {
	gap:20px
}
.staff {
	flex-basis:calc((100% - 60px)/4);
	border-radius:16px;
	border:1px solid #dce5f1;
	box-shadow:0 9px 24px #1633540a
}
.staff img {
	height:290px;
	object-position:top
}
.staff div {
	padding:25px 22px;
	background:linear-gradient(135deg, white, #f5f8fd)
}
.staff h3 {
	font-size:20px;
	line-height:1.4;
	letter-spacing:-.3px;
	margin:12px 0 8px
}
.staff p {
	font-size:14px;
	line-height:1.65
}
.staff .pill {
	font-size:10px;
	letter-spacing:1px
}
.teambar>span {
	font-size:13px
}
.gallerytrack {
	gap:14px
}
.photo {
	flex-basis:calc((100% - 70px)/6);
	min-width:0;
	border-radius:12px;
	box-shadow:0 6px 18px #17354b0a
}
.photo img {
	height:205px
}
.photo span {
	font-size:14px;
	line-height:1.5;
	left:14px;
	bottom:14px;
	right:10px
}
.videogrid {
	grid-template-columns:repeat(4, minmax(0, 1fr));
	gap:18px
}
.videocard img {
	height:215px
}
.videocard strong {
	font-size:17px;
	line-height:1.4;
	left:18px;
	right:12px;
	bottom:18px
}
.videocard strong small {
	font-size:10px;
	display:block;
	margin-top:5px;
	color:#d6e2f1;
	font-weight:400
}
.play {
	width:47px;
	height:47px;
	font-size:17px;
	top:34%;
	left:calc(50% - 23px);
	box-shadow:0 0 0 9px #ffffff18
}
.updaterow strong {
	font-size:14px
}
.updaterow small {
	font-size:12px
}
.updatepanel h3 {
	font-size:18px
}
.updatepanel>header small {
	font-size:11px
}
.centerheading>p {
	font-size:14px
}
.newsticker {
	height:291px;
	overflow:hidden;
	scroll-behavior:auto;
	background:white
}
.newstickertrack {
	display:block
}
.newsticker .updaterow {
	min-height:97px
}
.newscontrols {
	display:flex;
	justify-content:center;
	gap:8px;
	padding:8px 0;
	background:#f8faff;
	border-top:1px solid #e7eef8
}
.newscontrols button {
	display:grid;
	place-items:center;
	width:29px;
	height:27px;
	border:1px solid #e2e8f2;
	background:white;
	border-radius:5px;
	color:#37557c;
	font-size:12px
}
.newscontrols button:hover {
	background:#eaf3ff
}
.panelbottom {
	font-size:13px
}
.footergrid a {
	font-size:12px
}
.footergrid p {
	font-size:13px
}
.form label {
	font-size:13px
}
.note {
	font-size:11px
}
.hero p {
	font-size:14px
}
.hero .btn {
	font-size:12px
}
.course h3 {
	font-size:15px
}
.course p {
	font-size:12px;
	min-height:92px
}
@media(max-width:1100px) {
.photo img {
height:175px
}
.photo span {
font-size:12px;
left:11px;
bottom:12px
}
.videocard img {
height:190px
}
.videocard strong {
font-size:15px;
left:13px
}
.staff img {
height:250px
}
.staff h3 {
font-size:18px
}
.staff p {
font-size:13px
}
.staff div {
padding:22px 17px
}
}
@media(max-width:900px) {
.photo {
flex-basis:calc((100% - 28px)/3)
}
.photo img {
height:235px
}
.videogrid {
grid-template-columns:repeat(2, minmax(0, 1fr))
}
.videocard img {
height:240px
}
.staff {
flex-basis:calc((100% - 40px)/3)
}
}
@media(max-width:760px) {
.sectionhead p, .split p, .technicalcopy>p, .contactgrid p {
font-size:13px
}
.hero p {
font-size:13px
}
.hero .btn {
font-size:11px
}
.gallerytrack {
gap:12px
}
.photo {
flex-basis:calc((100% - 12px)/2)
}
.photo img {
height:215px
}
.photo span {
font-size:13px;
left:12px;
bottom:13px
}
.videogrid {
gap:12px
}
.videocard img {
height:205px
}
.videocard strong {
font-size:14px;
left:12px;
bottom:15px
}
.play {
width:40px;
height:40px;
left:calc(50% - 20px);
font-size:15px
}
.staffgrid {
gap:14px
}
.staff {
flex-basis:calc((100% - 14px)/2)
}
.staff img {
height:245px
}
.staff div {
padding:20px 14px
}
.staff h3 {
font-size:17px
}
.staff p {
font-size:12px
}
.staff .pill {
font-size:9px
}
.teambar>span {
font-size:11px
}
.updaterow strong {
font-size:13px
}
.updaterow small {
font-size:11px
}
.centerheading>p {
font-size:12px
}
.servicecard h3 {
font-size:17px
}
.servicecard p {
font-size:12px
}
.course h3 {
font-size:14px
}
.course p {
font-size:11px;
min-height:87px
}
.whytiles h3 {
font-size:14px
}
.whytiles p {
font-size:12px
}
.newsticker {
height:291px
}
}
@media(max-width:400px) {
.photo {
flex-basis:85%
}
.photo img {
height:245px
}
.videogrid {
grid-template-columns:1fr
}
.videocard img {
height:235px
}
.staff {
flex-basis:85%
}
.staff img {
height:290px
}
}


/* Mobile navigation repair: visible panel over page content */
@media (max-width: 1100px) {
  .header.referenceheader { position: sticky; top: 0; z-index: 99990; }
  .header.referenceheader .headercanvas, .header.referenceheader .headercard { overflow: visible !important; }
  .header.referenceheader .headercard { position: relative; }
  .header.referenceheader .headercard > .menu { display: flex !important; align-items: center; justify-content: center; position: relative; z-index: 100002; cursor: pointer; }
  .header.referenceheader .referencenav .links { display: none !important; position: absolute !important; z-index: 100001 !important; left: 0 !important; right: 0 !important; top: 100% !important; width: 100% !important; max-height: min(75vh, 650px); overflow-y: auto; background: #fff; border-radius: 0 0 14px 14px; box-shadow: 0 16px 32px rgba(10,29,57,.22); padding: 12px 18px; }
  .header.referenceheader .referencenav .links.open { display: flex !important; flex-direction: column !important; align-items: stretch !important; }
  .header.referenceheader .referencenav .drop { width: 100%; }
  .header.referenceheader .referencenav .drop > button { width: 100%; text-align: left; display:flex; justify-content:space-between; align-items:center; }
  .header.referenceheader .referencenav .dropmenu { display: none; position: static !important; width: 100%; box-shadow: none; background: #f3f7fc; border-radius: 8px; padding: 5px 12px; }
  .header.referenceheader .referencenav .drop.open > .dropmenu { display: block !important; }
}