/**
 * NU Online Components, global stylesheet.
 *
 * Extracted from the per-page style blocks that every program page carried its
 * own copy of. Where the MSIS and AI Applications versions disagreed, MSIS
 * wins by decision: .faq-list uses columns, .fac-row is the two-column grid
 * that wraps at 1400px, .ey letter-spacing is .2em, .tr-stats is light.
 *
 * The one visible consequence: the certificate faculty blade has a third
 * column box that now wraps below the bio instead of sitting beside it.
 *
 * Unlike a Divi Code module, this is a real stylesheet, so custom properties
 * work. Every colour below goes through a token. The May gold reduction would
 * have been one line here instead of a migration.
 */

:root {
	--red: #CC0000;
	--red-dark: #A00000;
	/* Gold fully reduced to red, May 2026. The token is kept so the many
	   var(--gold) references still resolve; do not reintroduce #F5A623. */
	--gold: #CC0000;
	--black: #1A1816;
	--off-white: #FBF8F2;
	--gray-100: #F0EDE7;
	--gray-200: #E0DDD7;
	--gray-400: #9E9B96;
	--gray-600: #5A5754;
	--gray-light: #C0BDB8;
	--footer: #111009;
	--fd: 'Playfair Display', Georgia, serif;
	--fb: 'Manrope', sans-serif;

	--tint-red-04: rgba(204, 0, 0, .04);
	--tint-red-06: rgba(204, 0, 0, .06);
	--tint-red-08: rgba(204, 0, 0, .08);
	--tint-red-15: rgba(204, 0, 0, .15);
	--line-light: rgba(255, 255, 255, .08);
	--line-mid: rgba(255, 255, 255, .15);

	--ci-width: 70%;
	--ci-pad: 64px;
	--radius: 10px;
	--radius-lg: 12px;
	--on-dark: #C9C5BF;
}

/* ── THEME RESET ────────────────────────────────────────────────── */
/* Narrow on purpose. An earlier version of this block set font-family on every
   span and div inside a blade, which outranked each component's own rule and
   changed the face of eyebrows, course code pills and chips. It also used
   color:inherit on dark blades, which resolves to the theme's body colour and
   so rendered light text dark. Only the two properties Divi genuinely wins on
   are set here, and always to an explicit value. */
.blade, .hero, #snav, .sbar {
	font-family: var(--fb);
}
.blade h1, .blade h2, .blade h3, .blade h4, .blade h5, .blade h6 {
	font-family: var(--fd);
	font-weight: 900;
}
/* Editor output on dark blades. Explicit values, never inherit. */
.bd p, .bd li,
.bd .why-panel-desc, .bd .why-panel-desc p,
.bd .fac-p, .bd .fac-p p,
.bd .vid-desc, .bd .adm-intro p {
	color: var(--gray-light);
}
.bd .os-r { color: #D8D5D0; }
.bd .os-s { color: var(--gray-light); }
.bd .vid-title, .bd .fac-nm, .bd .why-panel-title { color: #fff; }

/* ── EDITOR NOTICE ──────────────────────────────────────────────── */
/* Shown only to logged-in editors, when a blade cannot find its program. */
.nuo-notice { font-family: var(--fb); font-size: 14px; line-height: 1.6; color: #7a3e00; background: #fcf3e6; border: 1px solid #f0c987; border-left: 4px solid #dba617; border-radius: 6px; padding: 12px 16px; margin: 8px 0; }
.nuo-notice strong { font-family: monospace; color: #5a2d00; }
.nuo-notice span { display: block; margin-top: 4px; font-size: 13px; opacity: .7; }

/* ── BASE ───────────────────────────────────────────────────────── */
.nuo *, .nuo *::before, .nuo *::after { box-sizing: border-box; }
/* Always auto. Smooth scrolling is JS controlled; the CSS property fights
   anchor navigation and the Fast App container scroll. */
html { scroll-behavior: auto; }

/* ── REVEAL ─────────────────────────────────────────────────────── */
.rv { opacity: 1; transition: opacity .4s ease, transform .4s ease; }
.js-reveal .rv { opacity: 0; transform: translateY(20px); will-change: opacity, transform; }
.js-reveal #snav .rv { opacity: 1 !important; transform: none !important; }
#snav, #snav * { visibility: visible !important; }
.rv.vis { opacity: 1; transform: none; }
.d1 { transition-delay: .08s; } .d2 { transition-delay: .16s; } .d3 { transition-delay: .24s; }
.d4 { transition-delay: .32s; } .d5 { transition-delay: .4s; }
@media (max-width: 768px) {
	.rv { transition: opacity .25s ease, transform .25s ease; }
	.js-reveal .rv { transform: translateY(10px); }
}

/* ── SHARED ─────────────────────────────────────────────────────── */
.ey { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; display: block; margin-bottom: 12px; }
.ey-g { color: var(--gold); }
.ey-r { color: var(--red); }
h1.h, h2.h, h3.h, .blade .h, .h { font-family: var(--fd) !important; font-size: clamp(28px, 3.8vw, 46px) !important; font-weight: 900 !important; line-height: 1.1 !important; margin-bottom: 18px; padding: 0; }
h1.h em, h2.h em, .h em { font-style: italic !important; font-family: var(--fd) !important; }
/* Italic phrases keep the heading colour. Red is opt-in, via .h-em-red, and
   only on resource pages: they sit on a light background where it reads well.
   Tools and hubs use no red in either an h1 or an h2. */
.h em { color: inherit !important; }
.h-em-red em { color: var(--red) !important; }
.lead { font-size: 15px; color: var(--gray-600); line-height: 1.8; max-width: 620px; }

.btn { font-family: var(--fd); font-weight: 700; font-size: 14px; padding: 13px 28px; border-radius: 7px; border: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: background .18s; white-space: nowrap; }
.btn-r { background: var(--red); color: #fff; }
.btn-r:hover { background: var(--red-dark); }
.btn-g, .btn-gold { background: var(--gold) !important; color: #fff !important; border: none; }
.btn-g:hover, .btn-gold:hover { background: var(--red-dark) !important; }
.btn-gh { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.3); }
.btn-gh:hover { background: rgba(255,255,255,.07); }
.btn-ol { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.2); }
.btn-ol:hover { border-color: rgba(255,255,255,.5); }
.btn-sm { font-size: 13px; padding: 10px 22px; }
.btn-outline-dark { font-family: var(--fd); font-weight: 700; font-size: 14px; padding: 13px 28px; border-radius: 7px; border: 1.5px solid var(--gray-200); background: transparent; color: var(--black); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: border-color .18s, background .18s; white-space: nowrap; text-decoration: none; }
.btn-outline-dark:hover { border-color: var(--black); background: var(--gray-100); }
.btn-subdued { font-family: var(--fd); font-weight: 700; font-size: 14px; padding: 11px 22px; border-radius: 7px; border: 1.5px solid var(--black); background: transparent; color: var(--black); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: background .18s, color .18s; text-decoration: none; }
.btn-subdued:hover { background: var(--black); color: #fff; }

.blade { padding: 72px 0; }
.ci { max-width: var(--ci-width); margin: 0 auto; padding: 0 var(--ci-pad); }
.bl { background: var(--off-white); }
.bd { background: var(--black); }
.bg { background: var(--gray-100); }
.bw { background: #fff; }
@media (max-width: 1024px) { .ci { max-width: 92%; padding: 0 40px; } }
@media (max-width: 768px) { .ci { max-width: 100%; padding: 0 20px; } .blade { padding: 52px 24px; } }

.has-tip { position: relative; cursor: default; }
.has-tip .tip { position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); background: var(--black); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; padding: 5px 10px; border-radius: 5px; pointer-events: none; opacity: 0; transition: opacity .15s; border: 1px solid rgba(255,255,255,.12); z-index: 999; }
.has-tip .tip::after { content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-top-color: var(--black); }
.has-tip:hover .tip { opacity: 1; }

/* Classes emitted by shortcodes that only need a default. Kept here, with the
   shared furniture, rather than inside a page region that gets rewritten. */
.fac-body-col { min-width: 0; }
.faq-hub { display: flex; flex-direction: column; gap: 10px; }

/* ── TAKE THE FIRST STEP (Slate form) ───────────────────────────── */
.rfi-grid { display: flex; flex-direction: column; align-items: center; gap: 28px; }
.rfi-left { text-align: center; }
.rfi-left p { font-size: 15px; color: var(--gray-400); line-height: 1.8; margin-bottom: 24px; }
.rfi-left p strong { color: #fff; }
.rfi-right { width: 100%; max-width: 580px; }
.rfi-form-wrap { background: var(--off-white); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 24px; overflow: visible; }

/* ── DEADLINE TABLES ────────────────────────────────────────────── */
/* Values taken from the built page rather than estimated. The structural
   difference: headers are transparent and cells carry a top border, where an
   earlier version used a filled header row and bottom borders, which read as
   tighter and heavier. */
.table-block { margin-bottom: 40px; }
.table-block:last-of-type { margin-bottom: 0; }
.table-header { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.table-badge { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; padding: 5px 12px; border-radius: 20px; white-space: nowrap; }
.table-badge.current { background: var(--red); color: #fff; }
.table-badge.future { background: var(--gray-100); color: var(--gray-600); }
.table-header-note { font-family: var(--fd); font-size: 19px; font-weight: 800; color: var(--black); }

.table-scroll { overflow-x: auto; border: 1px solid var(--gray-200); border-radius: var(--radius); background: #fff; }
.table-block:has(.table-badge.current) .table-scroll { border-top: 3px solid var(--red); }

.table-block .table-scroll .dl-table { width: 100% !important; border-collapse: collapse !important; min-width: 520px; margin: 0 !important; border: none !important; table-layout: fixed !important; }
.table-block .table-scroll .dl-table thead { background: var(--off-white) !important; border-bottom: 1px solid var(--gray-200) !important; }
.table-block .table-scroll .dl-table thead tr { background: var(--off-white) !important; }
.table-block .table-scroll .dl-table th:first-child, .table-block .table-scroll .dl-table td:first-child { width: 28% !important; }
.table-block .table-scroll .dl-table th:not(:first-child), .table-block .table-scroll .dl-table td:not(:first-child) { width: 24% !important; }
.table-block .table-scroll .dl-table th { padding: 15px 22px !important; text-align: left !important; font-family: var(--fb) !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: var(--gray-600) !important; white-space: nowrap !important; border: none !important; background: transparent !important; }
.table-block .table-scroll .dl-table td { padding: 18px 22px !important; text-align: left !important; border-top: 1px solid var(--gray-200) !important; border-left: none !important; border-right: none !important; border-bottom: none !important; font-size: 15px; color: var(--black) !important; vertical-align: middle !important; background: #fff !important; white-space: nowrap; }
.table-block .table-scroll .dl-table tbody tr:first-child td { border-top: none !important; }
.table-block .table-scroll .dl-table td.term { font-family: var(--fd) !important; font-weight: 800 !important; font-size: 18px !important; color: var(--black) !important; white-space: nowrap !important; }
.table-block .table-scroll .dl-table tr.dl-row-ext td { background: var(--tint-red-04) !important; }
.dl-ext-badge { display: inline-block; font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; background: var(--red); color: #fff; padding: 3px 9px; border-radius: 20px; margin-left: 8px; vertical-align: middle; }
.table-note { margin-top: 14px; margin-bottom: 0; font-size: 14px; color: var(--gray-600); line-height: 1.55; }
.table-note strong { color: var(--black); font-weight: 700; }

/* Note callout above the tables */
.dl-callout { background: var(--off-white); border-left: 4px solid #dba617; border-radius: 0 8px 8px 0; padding: 16px 20px; font-size: 14px; color: var(--gray-600); line-height: 1.7; margin-top: 20px; }
.dl-callout strong { color: var(--black); font-weight: 700; }

/* Programs on each calendar */
.programs-block { margin-top: 52px; padding-top: 36px; border-top: 1px solid var(--gray-200); }
.programs-heading { font-family: var(--fd); font-size: 21px; font-weight: 900; color: var(--black); margin-bottom: 6px; }
.programs-intro { font-size: 14.5px; color: var(--gray-600); line-height: 1.7; margin-bottom: 20px; max-width: 640px; }
.programs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.programs-col { min-width: 0; background: #fff; border: 1px solid var(--gray-200); border-radius: 12px; padding: 20px 22px; }
.programs-sub { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; color: var(--red); padding-bottom: 12px; border-bottom: 1px solid var(--gray-200); margin-bottom: 4px; }
.program-list { list-style: none !important; display: flex; flex-direction: column; margin: 0 !important; padding: 0 !important; }
.program-list li { list-style: none !important; margin: 0; padding: 0; border-bottom: 1px solid var(--gray-100); }
.program-list li:last-child { border-bottom: none; }
.program-list li::marker { content: none; }
.program-list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 0; font-size: 14.5px; color: var(--black); text-decoration: none; transition: color .15s; }
.program-list a:hover { color: var(--red); }
.program-list-plain { display: block; padding: 13px 0; font-size: 14.5px; color: var(--gray-600); }
.program-list .arrow { color: var(--red); flex-shrink: 0; transition: transform .15s; }
.program-list a:hover .arrow { transform: translateX(3px); }

.dl-tables { margin-top: 28px; }

@media (max-width: 900px) { .programs-grid { grid-template-columns: 1fr; } }

/* ── TAKE THE FIRST STEP (Slate form) ───────────────────────────── */
.rfi-grid { display: flex; flex-direction: column; align-items: center; gap: 28px; }
.rfi-left { text-align: center; }
.rfi-left p { font-size: 15px; color: var(--gray-400); line-height: 1.8; margin-bottom: 24px; }
.rfi-left p strong { color: #fff; }
.rfi-right { width: 100%; max-width: 580px; }
.rfi-form-wrap { background: var(--off-white); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 24px; overflow: visible; }

/* ── BODY COPY ON DARK BLADES ───────────────────────────────────── */
/* --gray-400 is meant for a light background; on black it sits at 7.6:1 and
   reads as murky. --on-dark is 12.2:1. Flagged because the pages carry the
   old colour inline, which nothing else can override. */
.bd p, .bd li, .bd .lead, .bd .osplit-lead, .bd .slist li, .bd .gstep p,
.bd .pcard-info p, .bd .table-note, .bd .st-meter-cap { color: var(--on-dark) !important; }
.bd .ey-g { color: var(--red) !important; }
.bd strong, .bd .sl-title, .bd .osplit-kicker { color: #fff !important; }
.bd a:not(.btn):not(.aud-btn) { color: #fff; text-decoration: underline; }

/* ── HUB PAGE HERO AND VIDEO ────────────────────────────────────── */
/* The hero image sits behind its blade rather than in the flow, so the copy
   stays in the page markup and the image comes from Global Content. */
.blade.has-hero.bd { background: #000 !important; }
.blade.has-hero { position: relative; overflow: hidden; padding-top: 128px !important; padding-bottom: 128px !important; min-height: 540px; display: flex; align-items: center; }
.page-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center right; z-index: 0; }
/* Solid at the left where the copy sits, clear at the right where the picture
   does. Two stops rather than three, so the middle does not go muddy. */
.blade.has-hero.bd .page-hero-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, #000 0%, #000 36%, rgba(0,0,0,.62) 54%, rgba(0,0,0,.14) 76%, rgba(0,0,0,0) 100%); }
.blade.has-hero.bw .page-hero-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, #fff 0%, #fff 36%, rgba(255,255,255,.72) 54%, rgba(255,255,255,.18) 76%, rgba(255,255,255,0) 100%); }
.blade.has-hero > .ci { position: relative; z-index: 1; width: 100%; }
/* The copy must stay inside the solid part of the gradient, headline
   included. Without a cap on the h1 it ran into the picture. */
.blade.has-hero .h { max-width: 620px; }
.blade.has-hero .lead, .blade.has-hero p { max-width: 520px; }
.blade.has-hero .hero-facts { max-width: 560px; }

/* Between these widths there is less room before the picture starts, so the
   copy narrows rather than the gradient growing. */
@media (max-width: 1240px) {
	.blade.has-hero .h { max-width: 520px; font-size: clamp(30px, 3.6vw, 42px) !important; }
	.blade.has-hero .lead, .blade.has-hero p { max-width: 460px; }
}
@media (max-width: 1040px) {
	.blade.has-hero .h { max-width: 440px; }
	.blade.has-hero .lead, .blade.has-hero p { max-width: 400px; }
	.blade.has-hero.bd .page-hero-bg::after { background: linear-gradient(100deg, #000 0%, #000 46%, rgba(0,0,0,.7) 64%, rgba(0,0,0,.18) 86%, rgba(0,0,0,0) 100%); }
	.blade.has-hero.bw .page-hero-bg::after { background: linear-gradient(100deg, #fff 0%, #fff 46%, rgba(255,255,255,.8) 64%, rgba(255,255,255,.2) 86%, rgba(255,255,255,0) 100%); }
}

@media (max-width: 900px) {
	.blade.has-hero { padding-top: 88px !important; padding-bottom: 88px !important; min-height: 0; }
	/* The same diagonal the program hero uses, rather than a vertical wash.
	   Some words sit over the picture, which is how the program pages read. */
	.blade.has-hero.bd .page-hero-bg::after { background: linear-gradient(100deg, #000 0%, #000 35%, rgba(0,0,0,.70) 55%, rgba(0,0,0,.25) 75%, rgba(0,0,0,.05) 100%); }
	.blade.has-hero.bw .page-hero-bg::after { background: linear-gradient(100deg, #fff 0%, #fff 35%, rgba(255,255,255,.78) 55%, rgba(255,255,255,.35) 75%, rgba(255,255,255,.1) 100%); }
	.blade.has-hero .h, .blade.has-hero .lead, .blade.has-hero p { max-width: 100%; }
}

.pvid { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: var(--black); aspect-ratio: 16 / 9; cursor: pointer; }
.pvid-thumb { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .82; transition: opacity .2s; }
.pvid:hover .pvid-thumb { opacity: .7; }
.pvid-title { position: absolute; left: 0; right: 0; top: 0; padding: 18px 24px 34px; font-family: var(--fd); font-size: 18px; font-weight: 800; color: #fff; line-height: 1.3; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.35) 60%, transparent 100%); }
.pvid-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 68px; height: 48px; border: none; border-radius: 12px; background: var(--red); cursor: pointer; transition: transform .15s, background .15s; }
.pvid-play::after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-42%,-50%); border-style: solid; border-width: 10px 0 10px 17px; border-color: transparent transparent transparent #fff; }
.pvid:hover .pvid-play { transform: translate(-50%,-50%) scale(1.06); background: #e00; }
.pvid iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ── OVERVIEW SPLIT ─────────────────────────────────────────────── */
/* Copy and list in one column beside the video, both aligned to the top.
   With the list below the whole grid it left a hole under the short column. */
.osplit { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.osplit-lead { font-size: 16px; color: var(--gray-600); line-height: 1.8; margin-bottom: 26px; }
/* A standalone list under a lead paragraph needs the same separation the
   split layout gives it. */
.lead + .slist, .osplit-lead + .slist { margin-top: 28px !important; }
.slist-icons + p, .slist + p { margin-top: 28px; }
.osplit-lead strong { color: var(--black); font-weight: 700; }
.osplit-kicker { font-size: 15px; font-weight: 700; color: var(--black); margin-bottom: 16px; }
@media (max-width: 900px) { .osplit { grid-template-columns: 1fr; gap: 32px; } }

/* ── STYLED BULLET LIST ─────────────────────────────────────────── */
/* A red rule marker and a bold lead-in, which is what the built overview
   uses instead of cards. */
.slist { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.slist li { list-style: none !important; position: relative; padding: 0 0 0 26px; margin-bottom: 14px; font-size: 15px; line-height: 1.75; color: var(--gray-600); }
.slist li::before { content: ''; position: absolute; left: 0; top: 11px; width: 14px; height: 2px; background: var(--red); }

/* Icon variant: a tinted square with an icon instead of the rule marker. */
.slist-icons li { padding-left: 52px; padding-top: 2px; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--gray-100); }
.slist-icons li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.slist-icons li::before { display: none; }
.slist-icons .sl-ico { position: absolute; left: 0; top: 2px; width: 34px; height: 34px; border-radius: 9px; background: var(--tint-red-08); color: var(--red); display: flex; align-items: center; justify-content: center; }
.slist-icons .sl-ico svg { width: 17px; height: 17px; }
.slist-icons .sl-title { display: block; font-family: var(--fd); font-size: 17px; font-weight: 800; color: var(--black); line-height: 1.3; margin-bottom: 5px; }
.bd .slist-icons .sl-title { color: #fff; }
.bd .slist-icons li { border-bottom-color: rgba(255,255,255,.12); }
.slist li:last-child { margin-bottom: 0; }
.slist strong { color: var(--black); font-weight: 700; }
.slist a { color: var(--red); font-weight: 600; }
.bd .slist li { color: var(--gray-400); }
.bd .slist strong { color: #fff; }

/* ── GHOST NUMBER STEPS ─────────────────────────────────────────── */
.gsteps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
.gstep { position: relative; background: #fff; border: 1px solid var(--gray-200); border-top: 3px solid var(--red); border-radius: var(--radius); padding: 24px 26px 26px; overflow: hidden; }
.gstep-num { position: absolute; right: 14px; bottom: 2px; font-family: var(--fd); font-size: 78px; font-weight: 900; line-height: 1; color: var(--tint-red-08); pointer-events: none; user-select: none; }
.gstep h3 { font-family: var(--fd); font-size: 18px; font-weight: 800; color: var(--black); line-height: 1.3; margin-bottom: 10px; position: relative; }
.gstep p { font-size: 14px; color: var(--gray-600); line-height: 1.7; position: relative; margin: 0; }
.gstep p + p { margin-top: 10px; }
.bd .gstep, .bg .gstep { background: #fff; }

@media (max-width: 700px) { .gstep-num { font-size: 60px; } }

/* ── STACK TRACK EXPLORER ───────────────────────────────────────── */
/* Values from the built page. */
.st { max-width: 100%; margin: 0 auto; background: var(--off-white); border-radius: 16px; overflow: hidden; color: var(--gray-600); box-shadow: 0 18px 50px rgba(26,24,22,.12); }
.st-body { display: grid; grid-template-columns: 340px 1fr; }
.st-rail { background: var(--gray-100); padding: 22px 18px; border-right: 1px solid var(--gray-200); }
.st-rail-label { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; color: var(--black); padding: 0 8px 14px; }
.st-item { width: 100%; text-align: left; display: block; background: #fff; border: 1px solid var(--gray-200); border-left: 3px solid var(--gray-200); border-radius: 9px; padding: 13px 15px; margin-bottom: 9px; cursor: pointer; font-family: var(--fb); transition: border-color .15s, transform .15s, box-shadow .15s; }
.st-item:hover { border-color: var(--gray-400); transform: translateY(-1px); }
.st-item[aria-pressed="true"] { border-color: var(--gray-200); border-left-color: var(--red); box-shadow: 0 6px 20px rgba(26,24,22,.09); }
.st-item-name { font-family: var(--fd); font-weight: 800; font-size: 16.5px; color: var(--black); line-height: 1.3; display: block; }
.st-item-meta { font-size: 13px; color: var(--gray-600); margin-top: 5px; display: block; }

.st-panel { padding: 30px 36px 36px; min-width: 0; }
.st-panel h3 { font-family: var(--fd); font-weight: 900; font-size: 24px; color: var(--black); line-height: 1.2; margin-bottom: 16px; }
.st-facts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.st-fact { font-family: var(--fb); font-size: 13px; font-weight: 700; color: var(--gray-600); background: var(--gray-100); border-radius: 20px; padding: 6px 13px; }
/* Facts sit on their own row above the button, so the two do not compete. */
.hero-facts { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.hero-facts .st-fact { padding: 8px 16px; border-radius: 20px; font-size: 13px; background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.18); }
.bw .hero-facts .st-fact { background: var(--gray-100); color: var(--gray-600); border-color: var(--gray-200); }
.st-fact.cost { color: var(--black); }
.st-panel-eyebrow { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; color: var(--red); display: block; margin-bottom: 10px; }
.st-stacks-head { font-size: 14.5px; font-weight: 700; color: var(--black); margin: 0 0 14px; }
.st-stacks-head span { font-weight: 400; color: var(--gray-600); }

.st-degree { border: 1px solid var(--gray-200); border-radius: 11px; padding: 16px 18px; margin-bottom: 12px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.st-degree-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.st-degree-name { font-family: var(--fd); font-weight: 800; font-size: 17.5px; color: var(--black); line-height: 1.3; text-decoration: none; }
a.st-degree-name:hover { color: var(--red); }
.st-save { text-align: right; white-space: nowrap; flex-shrink: 0; }
.st-save-pct { display: block; font-family: var(--fd); font-weight: 900; font-size: 24px; color: var(--red); line-height: 1; letter-spacing: -.01em; }
.st-save-lbl { display: block; font-size: 13px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--gray-400); margin-top: 4px; }

.st-meter { margin-top: 14px; }
.st-meter-track { height: 9px; background: var(--gray-200); border-radius: 5px; overflow: hidden; }
.st-meter-fill { height: 100%; background: var(--red); border-radius: 5px; width: 0; transition: width .6s cubic-bezier(.22,.61,.36,1); }
.st-meter-cap { font-size: 13.5px; color: var(--gray-600); margin-top: 8px; }
.st-legend { display: flex; gap: 16px; margin-top: 7px; font-size: 13px; font-weight: 600; color: var(--gray-600); }
.st-legend i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; margin-right: 5px; }
.st-legend .dot-stack { background: var(--red); }
.st-legend .dot-remain { background: var(--gray-200); }
.st-note { margin-top: 13px; font-size: 13px; line-height: 1.5; color: var(--gray-600); background: var(--gray-100); border-left: 3px solid var(--red); border-radius: 0 6px 6px 0; padding: 9px 12px; }
.st-note strong { color: var(--black); }

.st-cta-row { margin-top: 24px; }
.st-btn { display: inline-block; font-family: var(--fd); font-weight: 700; font-size: 15px; color: #fff; background: var(--red); text-decoration: none; padding: 13px 28px; border-radius: 7px; transition: background .15s, transform .15s; }
.st-btn:hover { background: var(--black); color: #fff; }

@media (max-width: 860px) {
	.st-body { grid-template-columns: 1fr; }
	.st-rail { border-right: none; border-bottom: 1px solid var(--gray-200); }
	.st-panel { padding: 24px 20px 28px; }
}

/* ── PROGRAM CARDS ──────────────────────────────────────────────── */
/* Values taken from the built certificate hub. */
/* stretch, not start: aligning to the top left a hole under any card
   shorter than its neighbours. */
.cert-grid { display: grid; gap: 20px; align-items: stretch; }
.cert-grid-1 { grid-template-columns: minmax(0, 1fr); max-width: 640px; }
.cert-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cert-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cert-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.cert-card { background: #fff; border: 1px solid var(--gray-200); border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; transition: border-color .15s, box-shadow .15s, transform .15s; }
.cert-card:hover { border-color: var(--gray-400); box-shadow: 0 8px 28px rgba(26,24,22,.08); transform: translateY(-2px); }
.cert-img-wrap { position: relative; width: 100%; padding-top: 56.25%; background: var(--black); overflow: hidden; }
.cert-img-wrap img { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover !important; object-position: center; display: block; }
.cert-body { padding: 24px 28px 28px; display: flex; flex-direction: column; flex: 1; }

.cert-card-top { display: flex; align-items: flex-start; margin-bottom: 12px; }
.cert-college { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; color: var(--red); line-height: 1.4; }
.cert-name { font-family: var(--fd); font-weight: 800; font-size: 23px; line-height: 1.2; color: var(--black); margin: 0 0 10px; }
.cert-desc { font-size: 14px; color: var(--gray-600); line-height: 1.6; margin: 0 0 18px; }


/* A real minimum, not zero: with a zero minimum auto-fit never wraps, so four
   cells stayed in one row at any width and the tuition figure was cut off. */
.cert-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 0 12px; border-top: 1px solid var(--gray-100); border-bottom: 1px solid var(--gray-100); margin-bottom: 18px; }
.cm { padding: 14px 0; }
.cm-label { display: block; font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: var(--gray-400); margin-bottom: 6px; }
.cm-val { display: block; font-family: var(--fd); font-weight: 800; font-size: 20px; color: var(--black); line-height: 1.15; white-space: nowrap; }
.cm:nth-child(4) .cm-val { font-size: 18px; }

.cert-stack { margin-bottom: 22px; }
.cs-label { display: block; font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: var(--gray-400); margin-bottom: 8px; }
.cert-stack ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.cert-stack li { list-style: none !important; padding-left: 18px !important; position: relative; font-size: 14px; color: var(--gray-600); line-height: 1.5; margin-bottom: 5px; }
.cert-stack li::before { content: '\2191'; position: absolute; left: 0; top: 0; color: var(--red); font-weight: 700; }
.cert-tracks li::before { content: ''; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: var(--red); }

.cert-cta { margin-top: auto; display: flex; gap: 10px; flex-wrap: wrap; }
.aud-btn { font-family: var(--fb); font-size: 13px; font-weight: 800; padding: 12px 22px; border-radius: 20px; border: 2px solid transparent; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; transition: background .15s, color .15s, border-color .15s; white-space: nowrap; letter-spacing: .02em; }
.aud-btn-red { background: var(--red); color: #fff; border-color: var(--red); }
.aud-btn-red:hover { background: var(--black); border-color: var(--black); color: #fff; }
.aud-btn-outline { background: transparent; color: var(--black); border-color: var(--black); }
.aud-btn-outline-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.45); }
.aud-btn-outline-light:hover { background: #fff; color: var(--black); border-color: #fff; }
/* Outline button for dark blades, where the dark version disappears. */
.btn-outline-light { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.4); }
.btn-outline-light:hover { background: #fff; color: var(--black); border-color: #fff; }
.aud-btn-outline:hover { background: var(--black); color: #fff; }
.cert-btn-full { width: 100%; justify-content: center; }

@media (max-width: 1100px) { .cert-grid-3, .cert-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .cert-grid-2, .cert-grid-3, .cert-grid-4 { grid-template-columns: minmax(0, 1fr); } .cert-body { padding: 20px 22px 24px; } }

/* ── FAQ HUB ────────────────────────────────────────────────────── */
.nufaq-search-wrap { position: relative; margin-bottom: 16px; }
.nufaq-search-icon { position: absolute; left: 17px; z-index: 1; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--gray-400); pointer-events: none; display: flex; }
.nufaq-search-icon svg { width: 16px; height: 16px; }
.nufaq .nufaq-search-wrap input.nufaq-search-input { width: 100% !important; padding: 15px 16px 15px 48px !important; font-family: var(--fb) !important; font-size: 15px !important; font-weight: 500 !important; line-height: 1.4 !important; border: 1.5px solid var(--gray-200) !important; border-radius: 8px !important; background: var(--off-white) !important; color: var(--black) !important; outline: none !important; box-shadow: none !important; transition: border-color .15s, background .15s; }
.nufaq .nufaq-search-wrap input.nufaq-search-input:focus { border-color: var(--red) !important; background: #fff !important; }
.nufaq-search-input::placeholder { color: var(--gray-400); }

.nufaq-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.nufaq-pill { font-family: var(--fb); font-size: 13px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; padding: 7px 16px; border-radius: 100px; border: 1.5px solid var(--gray-200); background: #fff; color: var(--gray-600); cursor: pointer; transition: border-color .15s, color .15s, background .15s; white-space: nowrap; line-height: 1; }
.nufaq-pill:hover { border-color: var(--red); color: var(--red); }
.nufaq-pill.act { background: var(--red); border-color: var(--red); color: #fff; }

.nufaq-count { font-family: var(--fb); font-size: 13px; font-weight: 700; color: var(--gray-400); letter-spacing: .4px; text-transform: uppercase; margin-bottom: 12px; min-height: 1em; }

.nufaq-list { display: block; }
.nufaq-q { flex: 1; min-width: 0; }
.nufaq-item { border-bottom: 1px solid var(--gray-200); }
.nufaq-item:first-child { border-top: 1px solid var(--gray-200); }
.nufaq-btn { width: 100%; background: none; border: none; text-align: left; padding: 18px 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; cursor: pointer; font-family: var(--fb); font-size: 15px; font-weight: 600; color: var(--black); line-height: 1.4; transition: color .15s; }
.nufaq-btn:hover, .nufaq-btn.open { color: var(--red); }
.nufaq-icon { flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--gray-200); display: flex; align-items: center; justify-content: center; margin-top: 2px; background: #fff; color: var(--black); transition: background .2s, border-color .2s, color .2s; }
.nufaq-icon svg { width: 10px; height: 10px; transition: transform .2s; }
.nufaq-btn.open .nufaq-icon { background: var(--red); border-color: var(--red); color: #fff; }
.nufaq-btn.open .nufaq-icon svg { transform: rotate(45deg); }

.nufaq-answer { display: none; padding: 0 0 20px; font-size: 14px; line-height: 1.8; color: var(--gray-600); max-width: 760px; }
.nufaq-answer.open { display: block; }
.nufaq-answer p { margin-bottom: 12px; }
.nufaq-answer p:last-child { margin-bottom: 0; }
.nufaq-answer a { color: var(--red); font-weight: 600; }
.nufaq-answer ul, .nufaq-answer ol { padding-left: 20px; margin: 8px 0 12px; }
.nufaq-answer li { margin-bottom: 6px; }
.nufaq-answer strong { color: var(--black); font-weight: 700; }

.nufaq-none { padding: 40px 0; font-size: 14px; color: var(--gray-400); }
.nufaq-none strong { display: block; font-size: 15px; font-weight: 600; color: var(--gray-600); margin-bottom: 5px; }
@media (min-width: 1025px) { .nufaq-btn { font-size: 16px; } .nufaq-answer { font-size: 15px; } }

/* ── PAGE SUB-NAVIGATION PILLS ──────────────────────────────────── */
/* One rule for both pages. The tuition page carried this as an inline style
   and the deadlines page as a class, which is how the two backgrounds drifted
   apart in the first place. */
.pillnav-bar { background: var(--off-white); border-bottom: 1px solid var(--gray-200); }
.pillnav { display: flex; gap: 8px; flex-wrap: wrap; padding: 16px 0; }
.pillnav a { font-family: var(--fb); font-size: 13px; font-weight: 600; color: var(--gray-600); background: #fff; border: 1px solid var(--gray-200); border-radius: 20px; padding: 8px 18px; text-decoration: none; transition: border-color .15s, color .15s; }
.pillnav a:hover { border-color: var(--black); color: var(--black); }
.pillnav a.act { background: var(--black); border-color: var(--black); color: #fff; }

/* ── STICKY SECTION NAV ─────────────────────────────────────────── */
#snav { position: sticky; top: 0; z-index: 99999; background: #fff; border-bottom: 1px solid var(--red); overflow: visible; isolation: isolate; }
.snav-in { display: flex; align-items: center; padding: 0 40px; height: 52px; position: relative; overflow: visible; max-width: 90%; margin: 0 auto; }
.snav-logo { font-family: var(--fd); font-weight: 800; font-size: 13px; color: var(--black); padding: 0 18px 0 0; border-right: 1px solid var(--gray-200); margin-right: 4px; white-space: nowrap; flex-shrink: 0; }
.snav-logo-short { display: none; }
.snav-links { display: flex; align-items: stretch; overflow: hidden; flex: 1; }
.snav-links a { font-family: var(--fb); font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--gray-600); padding: 0 12px; height: 52px; display: flex; align-items: center; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: color .15s, border-color .15s; flex-shrink: 0; }
.snav-links a:hover { color: var(--black); }
.snav-links a.act { color: var(--black); border-bottom-color: var(--red); }
.snav-wide { display: none !important; }
@media (min-width: 1400px) { .snav-wide { display: flex !important; } }
.snav-dropdown .snav-wide { display: block !important; }
.snav-deadline { font-size: 13px; font-weight: 800; letter-spacing: .06em; padding: 6px 14px; border-radius: 20px; white-space: nowrap; background: transparent; color: var(--gray-600); border: 1px solid var(--gray-200); }
.snav-cta { padding-left: 12px; flex-shrink: 0; display: flex; align-items: center; gap: 20px; }
.snav-cta .btn { font-size: 13px; padding: 8px 16px; white-space: nowrap; }
.snav-burger { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 40px; height: 52px; background: none; border: none; cursor: pointer; padding: 0; margin-left: auto; flex-shrink: 0; }
.snav-burger span { display: block; height: 2px; background: var(--black); border-radius: 2px; transition: transform .25s, opacity .25s; }
.snav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.snav-burger.open span:nth-child(2) { opacity: 0; }
.snav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.snav-dropdown { display: none; position: absolute; top: 52px; left: 0; right: 0; background: #fff; border-top: 1px solid var(--gray-200); border-bottom: 1px solid var(--gray-200); z-index: 299; flex-direction: column; padding: 8px 0 12px; box-shadow: 0 8px 24px rgba(0,0,0,.08); }
.snav-dropdown.open { display: flex; }
.snav-dropdown a { font-family: var(--fb); font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gray-600); padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; transition: color .15s, background .15s; }
.snav-dropdown a:hover, .snav-dropdown a.act { color: var(--black); background: var(--gray-100); }
.snav-dropdown a.act::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--red); flex-shrink: 0; }
.snav-dropdown-cta { padding: 12px 24px 4px; border-top: 1px solid var(--gray-200); margin-top: 4px; }
.snav-dropdown-cta .btn { width: 100%; justify-content: center; padding: 12px 24px !important; text-transform: none !important; letter-spacing: 0 !important; }
@media (max-width: 1024px) {
	.snav-in { padding: 0 20px; overflow: hidden; max-width: 100%; }
	.snav-links, .snav-cta { display: none !important; }
	.snav-deadline { display: inline-block; margin-left: auto; margin-right: 8px; }
	.snav-burger { display: flex !important; }
	.snav-dropdown { overflow: hidden; }
}

/* ── HERO ───────────────────────────────────────────────────────── */
.hero { background-color: var(--black); padding: 88px 0 72px; position: relative; overflow: hidden; }
.hero-ci { max-width: var(--ci-width); margin: 0 auto; padding: 0 var(--ci-pad); }
.hero-grid { display: grid; grid-template-columns: 1fr; gap: 36px; align-items: center; position: relative; z-index: 1; max-width: 700px; }
.hero-prog-name { font-family: var(--fd); font-size: clamp(36px, 5.5vw, 72px); font-weight: 900; color: #fff; line-height: 1; margin-bottom: 16px; letter-spacing: -.01em; }
.hero h1 { font-family: var(--fd); font-size: clamp(14px, 1.6vw, 20px); font-weight: 700; color: var(--gray-light); line-height: 1.5; margin-bottom: 20px; letter-spacing: .01em; }
.hero h1 em { font-style: italic; }
.hero-sub { font-size: 16px; color: var(--gray-400); line-height: 1.72; max-width: 480px; margin-bottom: 28px; }
.hero-acts { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px; }
.hero-proof { display: flex; gap: 22px; flex-wrap: wrap; border-top: 1px solid rgba(255,255,255,.07); padding-top: 22px; }
.hp-v { font-family: var(--fd); font-size: 20px; font-weight: 900; color: #fff; }
.hp-l { font-size: 13px; font-weight: 600; color: var(--gray-400); letter-spacing: .05em; text-transform: uppercase; }
@media (max-width: 1024px) { .hero-ci { max-width: 92%; padding: 0 40px; } }
@media (max-width: 768px) {
	.hero { padding: 80px 0 48px; }
	.hero-ci { max-width: 100%; padding: 0 20px; }
	.hero-acts { flex-direction: column; }
	.hero-acts .btn { width: 100%; justify-content: center; }
}

/* ── PAGE FOOTER ────────────────────────────────────────────────── */
.pg-ft { background: var(--footer); padding: 26px 0; }
.pg-ft-ci { max-width: var(--ci-width); margin: 0 auto; padding: 0 var(--ci-pad); display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; }
.ft-info { font-size: 13px; color: var(--gray-400); line-height: 1.6; }
.ft-info a { color: var(--gray-400); }
.ft-links { display: flex; gap: 16px; flex-wrap: wrap; }
.ft-links a { font-size: 13px; color: var(--gray-400); font-weight: 600; transition: color .15s; }
.ft-links a:hover { color: #fff; }
@media (max-width: 1024px) { .pg-ft-ci { max-width: 92%; padding: 0 40px; } }
@media (max-width: 768px) { .pg-ft-ci { max-width: 100%; padding: 0 20px; } }

/* ── BLADE HEADER ───────────────────────────────────────────────── */
/* Eyebrow, headline and intro, rendered from the program record. The gap
   below used to be an inline margin on each intro paragraph in the markup. */
.blade-header { margin-bottom: 30px; }
.blade-header h2.h:last-child { margin-bottom: 0; }
.blade-header .blade-intro { max-width: 680px; margin-bottom: 0; }
.blade-header .blade-intro-dark { font-size: 16px; color: var(--gray-400); line-height: 1.8; }
@media (min-width: 1025px) { .blade-header .blade-intro-dark { font-size: 18px; } }
@media (max-width: 768px) { .blade-header { margin-bottom: 22px; } }

/* ── STATS BAR ──────────────────────────────────────────────────── */
.sbar { background: var(--footer); border-bottom: 1px solid rgba(255,255,255,.05); }
.sbar-in { display: flex; align-items: stretch; max-width: var(--ci-width); margin: 0 auto; }
/* justify-content centres each cell's content in whatever height the tallest
   one sets, so a value that wraps does not leave the others bottom-heavy. */
.sbar-it { flex: 1; padding: 22px 12px; text-align: center; border-right: 1px solid rgba(255,255,255,.06); display: flex; flex-direction: column; justify-content: center; gap: 3px; transition: background .2s; }
.sbar-it .sv { text-wrap: balance; }
.sbar-it:last-child { border-right: none; }
.sbar-it:hover { background: rgba(255,255,255,.03); }
.sv { font-family: var(--fd); font-size: 24px; font-weight: 900; color: #fff; line-height: 1; }
.sl { font-size: 13px; font-weight: 600; color: var(--gray-light); letter-spacing: .05em; text-transform: uppercase; margin-top: 2px; }
@media (max-width: 1024px) { .sbar .sbar-in { max-width: 92%; padding: 0 40px; } }
@media (max-width: 768px) {
	.sbar .sbar-in { max-width: 100%; padding: 0 20px; flex-wrap: wrap; }
	.sbar-it { flex: 0 0 33.33%; border-bottom: 1px solid rgba(255,255,255,.06); }
	.sbar-it:nth-child(3n) { border-right: none; }
}

/* ── TABS ───────────────────────────────────────────────────────── */
.tabs-bar { display: flex; border-bottom: 1px solid var(--gray-200); margin-bottom: 32px; overflow-x: scroll; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.tabs-bar::-webkit-scrollbar { display: none; }
.tab-btn { font-family: var(--fb); font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-400); padding: 14px 20px; border: none; background: none; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; flex-shrink: 0; transition: color .15s, border-color .15s; }
.tab-btn:hover { color: var(--black); }
.tab-btn.act { color: var(--red); border-bottom-color: var(--red); }
.tab-pane { display: none; }
.tab-pane.act { display: block; }
.ov-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: start; }
.ov-cols p { font-size: 15px; color: var(--gray-600); line-height: 1.8; margin-bottom: 14px; }
.ov-cols p strong { color: var(--black); font-weight: 700; }
@media (max-width: 900px) { .ov-cols { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 600px) {
	.tabs-bar { flex-direction: column; overflow-x: visible; border-bottom: none; gap: 2px; margin-bottom: 24px; }
	.tab-btn { border-bottom: none; border-left: 2px solid transparent; margin-bottom: 0; padding: 11px 16px; text-align: left; background: var(--gray-100); border-radius: 7px; white-space: normal; }
	.tab-btn.act { border-left-color: var(--red); background: #fff; color: var(--red); }
}

/* Credential card, certificate About tab */
.cred-card { background: var(--black); border-radius: var(--radius-lg); padding: 26px 24px; color: #fff; }
.cc-ey { font-size: 13px; font-weight: 800; letter-spacing: .25em; text-transform: uppercase; color: var(--gold); display: block; margin-bottom: 10px; }
.cc-title { font-family: var(--fd); font-size: 17px; font-weight: 900; line-height: 1.3; margin-bottom: 18px; }
.cc-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.cc-list li { display: flex; gap: 10px; align-items: flex-start; }
.cc-list .lb { font-size: 13px; font-weight: 700; color: var(--gray-light); letter-spacing: .05em; text-transform: uppercase; flex: 0 0 95px; padding-top: 2px; }
.cc-list .vl { font-size: 14px; color: var(--gray-400); line-height: 1.5; }
.cc-list .vl strong { color: #fff; font-weight: 700; }
.cred-note { background: var(--gray-100); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 18px 22px; margin-top: 14px; font-size: 13px; color: var(--gray-600); line-height: 1.65; }
.cred-note p + p { margin-top: 10px; }

/* Format list */
.fmt-list { display: flex; flex-direction: column; }
.fmt-it { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--gray-200); align-items: flex-start; }
.fmt-it:last-child { border-bottom: none; }
.fmt-ic { width: 36px; height: 36px; background: var(--tint-red-08); border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; }
.fmt-t { font-family: var(--fd); font-size: 17px; font-weight: 800; color: var(--black); margin-bottom: 3px; }
.fmt-d { font-size: 14px; color: var(--gray-600); line-height: 1.6; }
.fmt-d a { color: var(--red); font-weight: 700; }

/* Tuition cards */
.t-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.t-card { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 20px 18px; background: #fff; position: relative; overflow: hidden; }
.t-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--red); }
.t-lbl { font-size: 14px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 7px; }
.t-price { font-family: var(--fd); font-size: 30px; font-weight: 900; color: var(--black); line-height: 1; margin-bottom: 5px; }
.t-note, .t-fine { font-size: 13px; color: var(--gray-600); line-height: 1.6; }
.t-note a, .t-fine a { color: var(--red); font-weight: 700; }
.t-boxes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 20px 0 16px; }
.t-box { background: var(--gray-100); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 20px 18px; }
.t-box-v { font-family: var(--fd); font-size: 26px; font-weight: 900; color: var(--black); line-height: 1; margin-bottom: 6px; }
.t-box-l { font-size: 13px; font-weight: 600; color: var(--gray-600); line-height: 1.5; }
.t-box.featured { background: #fff; border-color: var(--red); border-top: 3px solid var(--red); }
.t-box.featured .t-box-v { color: var(--red); }
@media (max-width: 900px) { .t-cards, .t-boxes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .t-cards, .t-boxes { grid-template-columns: 1fr; } }

/* At a Glance, light striped table */
.atg-card { max-width: 760px; margin: 0 auto; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; background: #fff; }
.atg-row { display: grid; grid-template-columns: 1fr 1.4fr; gap: 24px; padding: 18px 28px; align-items: center; border-bottom: 1px solid var(--gray-200); }
.atg-row:last-child { border-bottom: none; }
.atg-row:nth-child(even) { background: var(--off-white); }
.atg-lbl { font-size: 14px; color: var(--gray-600); font-weight: 500; }
.atg-val { font-family: var(--fd); font-size: 15px; font-weight: 800; color: var(--black); text-align: right; line-height: 1.4; }
@media (max-width: 600px) { .atg-row { grid-template-columns: 1fr; gap: 4px; padding: 14px 18px; } .atg-val { text-align: left; } }

/* ── BLADE BACKGROUNDS ──────────────────────────────────────────── */
/* Images come from the Global Content screen as custom properties, so a page
   never carries an inline background rule. Falls back to flat colour. */
.blade.bd.has-bg { background-color: var(--black); background-size: cover; background-position: center; background-repeat: no-repeat; }
#career-outcomes.has-bg { background-image: linear-gradient(100deg, var(--black) 0%, var(--black) 40%, rgba(26,24,22,.88) 65%, rgba(26,24,22,.72) 100%), var(--bg-career, none); }
#why.has-bg { background-image: linear-gradient(180deg, rgba(14,13,12,.94) 0%, rgba(14,13,12,.86) 100%), var(--bg-why, none); }
#faculty.has-bg { background-image: linear-gradient(100deg, var(--black) 0%, rgba(26,24,22,.85) 100%), var(--bg-faculty, none); }
#next-steps.has-bg { background-image: linear-gradient(180deg, rgba(14,13,12,.94) 0%, rgba(14,13,12,.9) 100%), var(--bg-next-steps, none); }

/* ── ADMISSIONS, COMPACT (About tab) ────────────────────────────── */
.adm-compact { max-width: 680px; }
.adm-compact-title { font-family: var(--fd); font-size: 19px; font-weight: 800; color: var(--black); margin-bottom: 22px; line-height: 1.2; }
.adm-compact-card { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 20px 22px; margin-bottom: 16px; }
.adm-compact-featured { border-top: 3px solid var(--red); }
.adm-compact-label { font-family: var(--fb); font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); margin-bottom: 10px; }
.adm-compact-label-dark { color: var(--black); }
.adm-compact-body { font-size: 14px; color: var(--gray-600); line-height: 1.75; margin-bottom: 14px; }
.adm-compact-more { font-family: var(--fd); font-size: 14px; font-weight: 700; color: var(--red); text-decoration: none; display: inline-block; margin-top: 6px; }
@media (min-width: 1025px) { .adm-compact-title { font-size: 21px; } .adm-compact-body { font-size: 16px; } }

/* ── TUITION AND AID TAB ────────────────────────────────────────── */
.t-card-sub { font-family: var(--fb); font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); margin: 6px 0 10px; }
.t-aid-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 18px 20px; }
.t-aid-card .ey { margin-bottom: 10px; }
.t-aid-card p { font-size: 13.5px; color: var(--gray-600); line-height: 1.7; }
.t-aid-card p strong { color: var(--black); font-weight: 700; }
.t-aid-card a { color: var(--red); font-weight: 700; }
@media (min-width: 1025px) { .t-aid-card p { font-size: 15px; } }

/* ── SKILLS ─────────────────────────────────────────────────────── */
.sk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sk-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 20px 18px; display: flex; flex-direction: column; gap: 8px; transition: box-shadow .2s, transform .2s; }
.sk-card:hover { box-shadow: 0 8px 26px rgba(0,0,0,.08); }
.sk-ic { width: 36px; height: 36px; background: var(--red); border-radius: 7px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sk-ic svg { width: 17px; height: 17px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sk-card h3 { font-family: var(--fd); font-size: 15px; font-weight: 800; color: var(--black); line-height: 1.3; }
.sk-card p { font-size: 14px; color: var(--gray-600); line-height: 1.65; flex: 1; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; }
.chip { background: var(--black); color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .04em; padding: 3px 9px; border-radius: 20px; }
@media (max-width: 900px) { .sk-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sk-grid { grid-template-columns: 1fr; } }

.cpe-cta { margin-top: 24px; background: linear-gradient(135deg, var(--tint-red-06) 0%, var(--tint-red-04) 100%); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.cpe-cta h3 { font-family: var(--fd); font-size: 19px; font-weight: 900; margin-bottom: 4px; }
.cpe-cta h3 em { font-style: italic; color: var(--red); }
.cpe-cta p { font-size: 14px; color: var(--gray-600); line-height: 1.6; }

/* ── TRACKS ─────────────────────────────────────────────────────── */
.tr-sel { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--gray-200); border-radius: var(--radius-lg) var(--radius-lg) 0 0; overflow: hidden; }
.tr-btn { background: #fff; border: none; cursor: pointer; padding: 16px 14px; text-align: left; border-right: 1px solid var(--gray-200); transition: background .18s; display: flex; flex-direction: column; gap: 4px; position: relative; }
.tr-btn:last-child { border-right: none; }
.tr-btn::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: var(--red); opacity: 0; transition: opacity .2s; }
.tr-btn.act::after, .tr-btn:hover::after { opacity: 1; }
.tr-btn.act { background: var(--gray-100); }
.tr-num { font-size: 13px; font-weight: 800; color: var(--gray-400); letter-spacing: .15em; }
.tr-name { font-family: var(--fd); font-size: 13px; font-weight: 800; color: var(--black); line-height: 1.3; }
.tr-arr { font-size: 13px; color: var(--gray-400); transition: transform .2s, color .2s; }
.tr-btn.act .tr-arr { transform: rotate(90deg); color: var(--red); }
.tr-panels { border: 1px solid var(--gray-200); border-top: none; border-radius: 0 0 var(--radius-lg) var(--radius-lg); overflow: hidden; }
.tr-panel { display: none; }
.tr-panel.act { display: grid; grid-template-columns: 1fr 1.3fr; }
.tr-main { padding: 32px 28px; background: #fff; }
.tr-main h3 { font-family: var(--fd); font-size: 21px; font-weight: 900; color: var(--black); margin-bottom: 10px; }
.tr-main p { font-size: 14px; color: var(--gray-600); line-height: 1.75; margin-bottom: 16px; }
.tr-roles { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.r-chip { font-size: 13px; font-weight: 600; color: var(--gray-600); background: var(--gray-100); border: 1px solid var(--gray-200); padding: 4px 11px; border-radius: 20px; }
/* MSIS variant: light stats panel. */
.tr-stats { padding: 32px 28px; background: var(--off-white); display: flex; flex-direction: column; border-left: 1px solid var(--gray-200); }
.ts-val { font-family: var(--fd); font-size: 28px; font-weight: 900; color: var(--black); line-height: 1; margin-bottom: 4px; }
.ts-lbl { font-size: 14px; color: var(--gray-600); line-height: 1.5; }
.ts-lbl strong { color: var(--black); font-weight: 800; }
.tr-gbar { height: 3px; background: var(--gray-200); border-radius: 2px; margin-top: 6px; overflow: hidden; }
.tr-gfill { height: 100%; background: var(--red); border-radius: 2px; width: 0; transition: width 1s ease; }
.tr-seq-eyebrow { font-family: var(--fd); font-size: 17px; font-weight: 900; color: var(--black); margin-bottom: 2px; line-height: 1.2; }
.tr-seq-eyebrow-sub { font-family: var(--fb); font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 16px; display: block; }
.tr-seq-note { font-size: 13px; color: var(--gray-400); font-style: italic; line-height: 1.6; margin-top: 10px; }
.tr-seq-sal-heading { font-family: var(--fd); font-size: 17px; font-weight: 900; color: var(--red); margin-bottom: 12px; flex-basis: 100%; line-height: 1.2; }
.tr-seq-sal { display: flex; gap: 20px; flex-wrap: wrap; padding: 16px 18px; background: rgba(204,0,0,.07); border: 1px solid rgba(204,0,0,.15); border-radius: 8px; margin-top: 14px; }
.tr-seq-sal-item { min-width: 90px; }
.tr-seq-sal-val { font-family: var(--fd); font-size: 22px; font-weight: 900; color: var(--black); line-height: 1; margin-bottom: 2px; }
.tr-seq-sal-lbl { font-size: 14px; color: var(--gray-600); line-height: 1.4; }
.tr-seq-sal-disc { font-size: 13px; color: var(--gray-400); font-style: italic; margin-top: 4px; line-height: 1.5; flex-basis: 100%; }
@media (max-width: 900px) { .tr-sel { grid-template-columns: 1fr 1fr; } .tr-panel.act { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .tr-sel { grid-template-columns: 1fr; } }

.tr-link { font-family: var(--fd); font-size: 15px; font-weight: 700; color: var(--red); display: inline-flex; align-items: center; gap: 5px; margin-top: 14px; text-decoration: none; }
.tr-link:hover { gap: 9px; }

/* Career outcomes call to action */
.career-cta { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius-lg); padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-top: 16px; }
.career-cta-main { flex: 1; min-width: 260px; }
.career-cta-title { font-family: var(--fd); font-size: 19px; font-weight: 900; color: #fff; margin-bottom: 4px; line-height: 1.2; }
.career-cta-title em { font-style: italic; color: var(--red); }
.career-cta-body { font-size: 15px; color: var(--gray-light); line-height: 1.6; max-width: 460px; }
@media (max-width: 768px) { .career-cta { flex-direction: column; align-items: flex-start; } .career-cta .btn { width: 100%; justify-content: center; } }

/* Sample term paths */
.track-paths { margin-top: 32px; }
.path-acc { border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; margin-bottom: 8px; }
.path-acc-top { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; cursor: pointer; background: #fff; transition: background .15s; user-select: none; }
.path-acc-top:hover { background: var(--gray-100); }
.path-acc-name { font-family: var(--fd); font-size: 15px; font-weight: 800; color: var(--black); }
.path-acc-body { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.path-acc.open .path-acc-body { max-height: 400px; }
.path-terms { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }
.term-col { background: #fff; border: 1px solid var(--gray-200); border-radius: 8px; padding: 14px; }
.term-lbl { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); margin-bottom: 10px; }
.term-course { font-size: 14px; font-weight: 800; color: var(--black); padding: 5px 0; border-bottom: 1px solid var(--gray-100); line-height: 1.35; }
.term-course:last-child { border-bottom: none; }
.term-course span { display: block; font-size: 13px; font-weight: 400; color: var(--gray-600); margin-top: 1px; }
.path-note { font-size: 13px; color: var(--gray-400); line-height: 1.6; font-style: italic; }
@media (max-width: 768px) { .path-terms { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .path-terms { grid-template-columns: 1fr; } }

/* ── FACULTY (MSIS two-column, third box wraps at 1400px) ───────── */
.fac-row { display: grid; grid-template-columns: 180px 1fr; gap: 36px; align-items: start; margin-top: 28px; }
.fac-spotlight-label { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #fff; background: rgba(204,0,0,.22); border: 1px solid rgba(204,0,0,.4); border-radius: 20px; padding: 5px 14px; display: inline-block; margin-bottom: 12px; white-space: nowrap; line-height: 1.4; }
.fac-img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top; border-radius: var(--radius); }
.fac-nm { font-family: var(--fd); font-size: 24px; font-weight: 900; color: #fff; margin-bottom: 4px; }
.fac-tt { font-size: 14px; color: var(--gray-400); line-height: 1.5; margin-bottom: 14px; }
.fac-p { font-size: 14px; color: var(--gray-400); line-height: 1.8; margin-bottom: 16px; }
.fac-quote { border-left: 3px solid var(--gold); padding: 14px 18px; margin-bottom: 18px; background: var(--tint-red-04); border-radius: 0 8px 8px 0; }
.fac-quote .fac-p { margin-bottom: 0; font-style: italic; color: var(--gray-light); }
.fac-quote .fac-p::before { content: '\201C'; }
.fac-quote .fac-p::after { content: '\201D'; }
.fac-crs { display: flex; flex-direction: column; gap: 9px; margin-bottom: 16px; }
.fac-cr { display: flex; gap: 9px; align-items: flex-start; }
.fac-dot { width: 5px; height: 5px; background: var(--gold); border-radius: 50%; margin-top: 6px; flex-shrink: 0; }
.fac-cr span { font-size: 14px; color: var(--gray-400); line-height: 1.5; }
.fac-cr span strong { color: #fff; }
.fac-link { font-family: var(--fd); font-size: 16px; font-weight: 700; color: var(--gold); display: inline-flex; align-items: center; gap: 5px; }
@media (max-width: 1400px) {
	.fac-row { grid-template-columns: 140px 1fr; grid-template-rows: auto auto; }
}
@media (max-width: 680px) {
	.fac-row { grid-template-columns: 1fr; }
	.fac-photo-col { display: flex; flex-direction: column; align-items: center; gap: 8px; }
	.fac-img { width: 140px; aspect-ratio: 1/1; border-radius: 50%; }
	.fac-spotlight-label { margin-bottom: 0; order: -1; }
}

/* ── TESTIMONIALS ───────────────────────────────────────────────── */
.te-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 32px; }
.te-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 26px 24px; position: relative; overflow: hidden; transition: box-shadow .2s; }
.te-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,.07); }
.te-card::before { content: '"'; font-family: var(--fd); font-size: 90px; font-weight: 900; color: var(--red); opacity: .06; position: absolute; top: -10px; right: 14px; line-height: 1; pointer-events: none; }
.te-q { font-family: var(--fd); font-size: 16px; font-weight: 800; color: var(--black); line-height: 1.45; margin-bottom: 18px; }
.te-q em { font-style: italic; color: var(--red); }
.te-meta { display: flex; gap: 12px; align-items: center; }
.te-av { width: 42px; height: 42px; border-radius: 50%; background: var(--gray-100); display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; border: 2px solid var(--gray-200); }
.te-name { font-weight: 800; font-size: 14px; color: var(--black); }
.te-role { font-size: 13px; color: var(--gray-400); }
.te-video-wrap { background: var(--gray-100); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); overflow: hidden; }
.te-video-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
.te-video-frame { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background: var(--black); }
.te-video-meta { padding: 28px 32px; }
@media (max-width: 768px) { .te-video-inner { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .te-grid { grid-template-columns: 1fr; } }

/* Student story: the video block under the quote cards */
.te-video-wrap { background: var(--gray-100); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); overflow: hidden; margin-top: 24px; }
.te-video-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
.te-video-frame { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background: var(--black); }
.te-video-meta { padding: 28px 32px; }
.te-video-meta .ey { margin-bottom: 6px; }
.te-video-title { font-family: var(--fd); font-size: 18px; font-weight: 800; color: var(--black); line-height: 1.3; margin-bottom: 8px; }
.te-video-desc { font-size: 13.5px; color: var(--gray-600); line-height: 1.7; }
@media (min-width: 1025px) { .te-video-title { font-size: 20px; } .te-video-desc { font-size: 15px; } }
@media (max-width: 768px) { .te-video-inner { grid-template-columns: 1fr; } }

/* ── OUTCOMES ───────────────────────────────────────────────────── */
.os-strip { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.06); }
.os-it { padding: 26px 22px; border-right: 1px solid var(--line-mid); display: flex; flex-direction: column; gap: 4px; }
.os-it:last-child { border-right: none; }
.os-v { font-family: var(--fd); font-size: 30px; font-weight: 900; color: #fff; line-height: 1; }
.os-r { font-size: 13px; font-weight: 700; color: #D8D5D0; }
.os-s { font-size: 13px; color: var(--gray-light); }
.sal-disclaimer { font-family: var(--fb); font-size: 13px; color: rgba(255,255,255,.35); line-height: 1.6; margin-top: 10px; font-style: italic; }
.os-strip-lt { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; background: #fff; }
.os-strip-lt .os-it { border-right: 1px solid var(--gray-200); }
.os-strip-lt .os-v { color: var(--black); }
.os-strip-lt .os-r { color: var(--black); }
.os-strip-lt .os-s { color: var(--gray-600); }
@media (max-width: 768px) {
	.os-strip, .os-strip-lt { grid-template-columns: 1fr 1fr; }
	.os-it { padding: 16px 12px !important; }
	.os-strip .os-it:nth-child(2n), .os-strip-lt .os-it:nth-child(2n) { border-right: none !important; }
	.os-it:nth-child(n+3) { border-top: 1px solid var(--gray-200); }
}

/* ── CURRICULUM ─────────────────────────────────────────────────── */
.curr-filter { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.curr-fbtn { font-family: var(--fb); font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 8px 16px; border-radius: 20px; border: 1.5px solid var(--gray-200); background: #fff; color: var(--gray-600); cursor: pointer; transition: all .15s; }
.curr-fbtn:hover { border-color: var(--black); color: var(--black); }
.curr-fbtn.act { background: var(--black); color: #fff; border-color: var(--black); }
.curr-summary { font-size: 14px; color: var(--gray-600); margin-bottom: 16px; min-height: 20px; transition: opacity .2s; }
.curr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; align-items: start; grid-auto-flow: dense; }
.curr-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; cursor: pointer; transition: box-shadow .18s; order: 0; }
.curr-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.curr-card.hidden { display: none; }
.curr-required-for { border-left: 3px solid var(--red); order: 1; }
.curr-elective { border-left: 3px solid var(--gold); order: 2; }
.curr-card-top { display: flex; align-items: center; gap: 12px; padding: 14px; user-select: none; }
.curr-num-pill { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; background: var(--gray-100); color: var(--gray-600); border: 1px solid var(--gray-200); padding: 4px 9px; border-radius: 5px; white-space: nowrap; flex-shrink: 0; }
.curr-card-name { flex: 1; font-family: var(--fd); font-size: 14px; font-weight: 800; color: var(--black); line-height: 1.25; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.curr-prereq-badge { font-size: 13px; font-weight: 700; color: var(--gray-400); background: var(--gray-100); border: 1px solid var(--gray-200); padding: 2px 7px; border-radius: 4px; }
.curr-pathway-badge { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 2px 8px; border-radius: 20px; background: var(--tint-red-08); color: var(--red); border: 1px solid rgba(204,0,0,.2); flex-shrink: 0; white-space: nowrap; }
.curr-req-label, .curr-elec-label { display: none; font-size: 13px; font-weight: 700; letter-spacing: .02em; padding: 3px 9px; border-radius: 20px; flex-shrink: 0; margin-left: auto; background: transparent; }
.curr-req-label { border: 1.5px solid var(--red); color: var(--red); background: var(--tint-red-06); }
.curr-elec-label { border: 1.5px solid var(--gray-400); color: var(--gray-600); }
.curr-card.curr-required-for .curr-req-label, .curr-card.curr-elective .curr-elec-label { display: inline-block; }
.curr-chevron { flex-shrink: 0; width: 22px; height: 22px; background: var(--gray-100); border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: transform .22s, background .18s; }
.curr-chevron svg { width: 11px; height: 11px; stroke: var(--gray-400); stroke-width: 2.5; fill: none; }
.curr-card.open .curr-chevron { transform: rotate(180deg); background: var(--black); }
.curr-card.open .curr-chevron svg { stroke: #fff; }
.curr-detail { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.curr-card.open .curr-detail { max-height: 1200px; }
.curr-detail-inner { padding: 2px 14px 14px; border-top: 1px solid var(--gray-100); }
.curr-desc { font-size: 13px; color: var(--gray-600); line-height: 1.65; margin: 10px 0; }
.curr-meta { display: flex; flex-direction: column; gap: 6px; }
.curr-sem { font-size: 13px; font-weight: 700; color: var(--gray-400); letter-spacing: .05em; }
.curr-tracks-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.ctrack-chip { font-size: 13px; font-weight: 700; color: var(--gray-600); background: var(--gray-100); border: 1px solid var(--gray-200); padding: 2px 7px; border-radius: 20px; }
.curr-note { display: flex; gap: 9px; align-items: flex-start; font-size: 14px; color: var(--gray-600); line-height: 1.6; max-width: 640px; }
@media (max-width: 1100px) { .curr-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .curr-grid { grid-template-columns: 1fr; } .curr-filter { gap: 6px; } .curr-fbtn { padding: 7px 12px; font-size: 13px; } }

/* Featured gateway course card */
.feat-card { background: #fff; border: 1px solid var(--gray-200); border-top: 3px solid var(--gold); border-radius: var(--radius); overflow: hidden; margin-bottom: 10px; }
.feat-card-top { display: flex; align-items: center; gap: 12px; padding: 14px 16px; cursor: pointer; transition: background .15s; user-select: none; }
.feat-card-top:hover { background: var(--off-white); }
.feat-name { font-family: var(--fd); font-size: 15px; font-weight: 800; color: var(--black); line-height: 1.25; flex: 1; }
.feat-badge-req { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 3px 11px; border-radius: 20px; background: var(--gray-100); color: var(--gray-600); border: 1px solid var(--gray-200); flex-shrink: 0; white-space: nowrap; }
.feat-chev { width: 22px; height: 22px; background: var(--gray-100); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: transform .25s, background .18s; }
.feat-chev svg { width: 10px; height: 10px; stroke: var(--gray-400); stroke-width: 2.5; fill: none; }
.feat-card.open .feat-chev { transform: rotate(180deg); background: var(--black); }
.feat-card.open .feat-chev svg { stroke: #fff; }
.feat-detail { max-height: 0; overflow: hidden; transition: max-height .42s ease; }
.feat-card.open .feat-detail { max-height: 900px; }
.feat-detail-inner { border-top: 1px solid var(--gray-200); }
.feat-strip { background: var(--black); padding: 18px 22px; display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.feat-strip-main { flex: 1; min-width: 240px; }
.feat-strip-eyebrow { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .25em; text-transform: uppercase; color: #fff; margin-bottom: 6px; }
.feat-strip-desc { font-size: 14px; color: var(--gray-400); line-height: 1.75; max-width: 620px; margin-bottom: 10px; }
.feat-strip-tools { display: flex; gap: 6px; flex-wrap: wrap; }
.feat-tool { font-family: var(--fb); font-size: 13px; font-weight: 700; padding: 2px 10px; border-radius: 20px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.2); color: #fff; }
.feat-body { padding: 20px 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; background: #fff; }
.feat-col-label { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--red); margin-bottom: 10px; }
.feat-outcome { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; color: var(--gray-600); line-height: 1.55; padding: 7px 0; border-bottom: 1px solid var(--gray-100); }
.feat-outcome:last-child { border-bottom: none; }
.feat-outcome::before { content: ''; width: 4px; height: 4px; background: var(--red); border-radius: 50%; flex-shrink: 0; margin-top: 5px; }
.feat-struct-row { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 2px 12px; padding: 7px 0; border-bottom: 1px solid var(--gray-100); font-size: 14px; }
.feat-struct-row:last-child { border-bottom: none; }
.feat-struct-label { color: var(--gray-400); flex-shrink: 0; }
.feat-struct-val { font-weight: 700; color: var(--black); text-align: right; flex: 1; }
@media (max-width: 600px) { .feat-body { grid-template-columns: 1fr; } }

/* ── WHY BLADE ──────────────────────────────────────────────────── */
.why-wrap { display: grid; grid-template-columns: 240px 1fr; margin-top: 36px; border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius-lg); overflow: hidden; }
.why-list { border-right: 1px solid var(--line-light); }
.why-item { display: flex; align-items: center; gap: 12px; padding: 15px 20px; cursor: pointer; border-bottom: 1px solid rgba(255,255,255,.07); border-left: 3px solid transparent; transition: background .18s, border-color .18s; user-select: none; }
.why-item:last-child { border-bottom: none; }
.why-item:hover { background: rgba(255,255,255,.04); }
.why-item.act { background: rgba(255,255,255,.05); border-left-color: var(--red); }
.why-item-num { font-family: var(--fd); font-size: 13px; font-weight: 900; color: rgba(255,255,255,.18); flex-shrink: 0; width: 22px; }
.why-item.act .why-item-num { color: rgba(204,0,0,.7); }
.why-item-label { font-family: var(--fb); font-size: 13px; font-weight: 700; color: var(--gray-400); line-height: 1.3; transition: color .18s; }
.why-item.act .why-item-label { color: #fff; }
/* The rail holds this column open at ten items, so a short panel used to sit
   at the top with a lot of empty space beneath it. Centring the content shares
   that space instead of pooling it at the bottom. */
.why-panel { padding: 32px 30px; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.why-item { padding: 13px 20px; }
.why-panel-ic { width: 42px; height: 42px; background: var(--tint-red-15); border-radius: 9px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.why-panel-ic svg { width: 18px; height: 18px; fill: none; stroke: var(--red); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.why-panel-title { font-family: var(--fd); font-size: 24px; font-weight: 900; color: #fff; line-height: 1.2; }
.why-panel-desc, .why-panel-desc p, .why-panel-desc li { font-size: 14px; color: var(--gray-light); line-height: 1.8; }
.why-panel-desc p { margin-bottom: 10px; }
.why-panel-desc p:last-child { margin-bottom: 0; }
.why-panel-desc a { color: var(--gold); font-weight: 700; }
@media (max-width: 768px) {
	.why-wrap { grid-template-columns: 1fr; }
	.why-list { border-right: none; border-bottom: 1px solid var(--line-light); display: grid; grid-template-columns: 1fr 1fr; }
	.why-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.07); }
	.why-panel { padding: 24px 20px; }
}

/* Studio thumbnails */
.why-vids { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.studio-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16/9; background: #2A2724; border: 0; padding: 0; cursor: pointer; overflow: hidden; border-radius: 8px; transition: transform .2s, box-shadow .2s; font-family: inherit; }
.studio-thumb:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.35); }
.studio-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.studio-thumb:hover img { transform: scale(1.04); }
.studio-thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.7) 100%); pointer-events: none; z-index: 1; }
.studio-thumb .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 48px; height: 48px; border-radius: 50%; background: rgba(204,0,0,.95); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(0,0,0,.4); transition: transform .2s, background .15s; z-index: 3; pointer-events: none; }
.studio-thumb .play-btn svg { width: 18px; height: 18px; }
.studio-thumb:hover .play-btn { transform: translate(-50%,-50%) scale(1.1); background: var(--red); }
.studio-thumb-meta { position: absolute; left: 11px; right: 11px; bottom: 9px; z-index: 2; color: #fff; text-align: left; pointer-events: none; }
/* The one documented gold exception on the site. Intentionally not tokenised. */
.studio-thumb-meta .se { display: block; font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #F5A623; margin-bottom: 2px; }
.studio-thumb-meta strong { display: block; font-family: var(--fd); font-size: 14px; font-weight: 800; line-height: 1.2; text-shadow: 0 1px 3px rgba(0,0,0,.6); }
@media (max-width: 520px) { .why-vids { grid-template-columns: 1fr; } .studio-thumb .play-btn { width: 42px; height: 42px; } }

/* Lightbox */
.lb-modal { position: fixed; inset: 0; background: rgba(10,8,6,.94); z-index: 9999; display: none; align-items: center; justify-content: center; padding: 24px; }
.lb-modal.open { display: flex; }
.lb-inner { position: relative; width: 100%; max-width: 1100px; }
.lb-frame { position: relative; width: 100%; aspect-ratio: 16/9; background: #000; border-radius: 4px; overflow: hidden; }
.lb-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.lb-close { position: absolute; top: -52px; right: 0; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.2); color: #fff; cursor: pointer; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; line-height: 1; padding: 0; transition: background .15s; }
.lb-close:hover { background: rgba(255,255,255,.18); }
@media (max-width: 600px) { .lb-close { top: -48px; } }

/* ── VIDEO BLADE ────────────────────────────────────────────────── */
.vid-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.vid-card { border-radius: var(--radius-lg); overflow: hidden; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); }
.vid-frame { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background: #0a0908; }
.vid-meta { padding: 18px 20px; display: flex; flex-direction: column; gap: 5px; }
.vid-tag { font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.vid-title { font-family: var(--fd); font-size: 16px; font-weight: 800; color: #fff; line-height: 1.3; }
.vid-desc { font-size: 14px; color: var(--gray-light); line-height: 1.5; }
.vid-note { display: flex; gap: 9px; align-items: flex-start; margin-top: 24px; font-size: 14px; color: var(--gray-400); line-height: 1.6; max-width: 560px; }
/* The About tab video sits on a light background, so its caption inverts. */
.vid-meta-light { background: var(--black); }
@media (max-width: 768px) { .vid-grid { grid-template-columns: 1fr; } }

/* ── VIDEO FACADE ───────────────────────────────────────────────── */
.nuo-facade { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: #0a0908; cursor: pointer; overflow: hidden; }
.nuo-facade img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nuo-facade .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 60px; height: 60px; border-radius: 50%; background: rgba(204,0,0,.9); color: #fff; display: flex; align-items: center; justify-content: center; transition: transform .2s, background .15s; }
.nuo-facade .play-btn svg { width: 22px; height: 22px; }
.nuo-facade:hover .play-btn { transform: translate(-50%,-50%) scale(1.1); background: var(--red); }
.vid-frame iframe, .te-video-frame iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; z-index: 2; }

/* Editor output on dark blades. The theme sets a dark paragraph colour, so
   these have to name the child element or the text renders black on black. */
.bd .adm-intro p, .bd .fac-p, .bd .te-q { color: inherit; }
.fac-quote .fac-p, .fac-quote .fac-p p { color: var(--gray-light); }

/* ── ADMISSIONS ─────────────────────────────────────────────────── */
.adm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.adm-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 28px 26px; display: flex; flex-direction: column; gap: 14px; position: relative; overflow: hidden; }
.adm-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--gray-200); }
.adm-featured::before { background: var(--red); }
.adm-card-top { display: flex; align-items: center; justify-content: space-between; }
.adm-badge { font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); background: var(--tint-red-08); padding: 3px 10px; border-radius: 20px; }
.adm-icon { width: 40px; height: 40px; background: var(--gray-100); border-radius: 9px; display: flex; align-items: center; justify-content: center; }
.adm-icon svg { width: 18px; height: 18px; stroke: var(--gray-600); }
.adm-featured .adm-icon { background: var(--tint-red-08); }
.adm-featured .adm-icon svg { stroke: var(--red); }
.adm-name { font-family: var(--fd); font-size: 24px; font-weight: 900; color: var(--black); line-height: 1.1; }
.adm-tagline { font-size: 14px; color: var(--gray-600); line-height: 1.6; border-bottom: 1px solid var(--gray-200); padding-bottom: 14px; }
.adm-intro { font-size: 14px; color: var(--gray-600); line-height: 1.7; }
.adm-intro p { margin-bottom: 8px; }
.te-thumb { margin-top: 16px; aspect-ratio: 16/9; }
.adm-for-label, .adm-how-label { font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 6px; }
.adm-featured .adm-for-label, .adm-featured .adm-how-label { color: var(--red); }
.adm-steps { display: flex; flex-direction: column; gap: 8px; }
.adm-step { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--gray-600); line-height: 1.5; }
.adm-step-n { font-family: var(--fd); font-weight: 900; font-size: 14px; color: var(--red); flex-shrink: 0; width: 16px; text-align: center; margin-top: 1px; }
.adm-note { font-size: 13px; color: var(--gray-600); line-height: 1.6; background: var(--gray-100); border-radius: 7px; padding: 10px 13px; border-left: 3px solid var(--gray-200); }
.adm-footer { margin-top: 28px; font-size: 13.5px; color: var(--gray-600); line-height: 1.7; display: flex; flex-direction: column; gap: 8px; }
.adm-links { display: flex; gap: 20px; flex-wrap: wrap; }
.adm-links a { color: var(--gray-400); font-weight: 600; font-size: 14px; }
.adm-links a:hover { color: var(--black); }
/* Certificate single-card variant */
.adm-steps-row { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; flex-wrap: wrap; }
.adm-step-inline { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--gray-600); line-height: 1.4; }
.adm-step-inline .n { width: 24px; height: 24px; border-radius: 50%; background: var(--black); color: #fff; font-family: var(--fd); font-weight: 800; font-size: 13px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.adm-step-line { width: 18px; height: 1px; background: var(--gray-200); flex-shrink: 0; }
.adm-check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin-bottom: 26px; }
.adm-check-it { display: flex; gap: 9px; align-items: flex-start; font-size: 14px; color: var(--gray-600); line-height: 1.5; }
.adm-check-it .c { color: var(--red); font-weight: 800; flex-shrink: 0; }
.adm-disclaimer { background: var(--gray-100); border-radius: var(--radius-lg); padding: 16px 20px; font-size: 13px; color: var(--gray-600); line-height: 1.7; margin-top: 20px; }
@media (max-width: 768px) { .adm-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .adm-check-grid { grid-template-columns: 1fr; } .adm-step-line { display: none; } .adm-step-inline { flex-basis: 100%; } }

/* ── PREP BOX (curriculum blade) ────────────────────────────────── */
.prep-box { background: var(--tint-red-04); border: 1px solid rgba(204,0,0,.14); border-radius: var(--radius); padding: 22px 26px; margin-top: 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.prep-box-main { flex: 1; min-width: 280px; }
.prep-box-title { font-family: var(--fd); font-size: 17px; font-weight: 900; color: var(--red); margin-bottom: 4px; }
.prep-box-sub { font-family: var(--fd); font-size: 15px; font-weight: 800; color: var(--black); margin-bottom: 8px; }
.prep-box-body { font-size: 14px; color: var(--gray-600); line-height: 1.7; }
.prep-box-actions { display: flex; gap: 8px; flex-wrap: wrap; flex-shrink: 0; }
@media (min-width: 1025px) { .prep-box-title { font-size: 19px; } .prep-box-sub { font-size: 17px; } }
@media (max-width: 768px) { .prep-box { flex-direction: column; align-items: flex-start; } .prep-box-actions .btn { width: 100%; justify-content: center; } }

/* ── PREP COURSES BOX ───────────────────────────────────────────── */
.coursera-box { background: linear-gradient(135deg, var(--tint-red-04) 0%, var(--tint-red-06) 100%); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 22px 26px; }
.coursera-title { font-family: var(--fd); font-size: 18px; font-weight: 900; color: var(--black); margin-bottom: 5px; }
.coursera-desc { font-size: 13.5px; color: var(--gray-600); line-height: 1.7; max-width: 580px; }
.adm-list { list-style: none; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.adm-list li { font-size: 13.5px; color: var(--gray-600); line-height: 1.6; display: flex; gap: 10px; align-items: flex-start; }
.adm-list li::before { content: '\2713'; color: var(--red); font-weight: 800; flex-shrink: 0; margin-top: 1px; }
.adm-footer a { color: var(--red); font-weight: 600; }
.hero h1 em { font-style: italic; color: inherit; }

/* ── WHY A CERTIFICATE ──────────────────────────────────────────── */
.wc-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 64px; align-items: start; }
.wc-left p { font-size: 15px; color: var(--gray-600); line-height: 1.8; margin-top: 14px; }
.wc-left p strong { color: var(--black); font-weight: 700; }
.wc-reasons { display: flex; flex-direction: column; border-top: 1px solid var(--gray-200); }
.wc-row { display: grid; grid-template-columns: 56px 1fr; gap: 22px; padding: 24px 0; border-bottom: 1px solid var(--gray-200); align-items: start; }
.wc-mark { width: 38px; height: 38px; background: var(--tint-red-08); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 4px; }
.wc-mark svg { width: 18px; height: 18px; stroke: var(--red); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.wc-row h3 { font-family: var(--fd); font-size: 18px; font-weight: 800; color: var(--black); margin-bottom: 7px; line-height: 1.3; }
.wc-row p { font-size: 14.5px; color: var(--gray-600); line-height: 1.7; }
.wc-row p a { color: var(--red); font-weight: 700; }
@media (max-width: 900px) { .wc-grid { grid-template-columns: 1fr; gap: 36px; } }
@media (max-width: 600px) { .wc-row { grid-template-columns: 46px 1fr; gap: 14px; padding: 20px 0; } .wc-mark { width: 32px; height: 32px; } }

/* ── FOR ME ─────────────────────────────────────────────────────── */
.for-me-qa-grid { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); overflow: hidden; background: #fff; }
.for-me-item { position: relative; overflow: hidden; padding: 26px 26px 22px; border-right: 1px solid var(--gray-200); border-bottom: 1px solid var(--gray-200); display: flex; flex-direction: column; gap: 12px; }
.for-me-item:nth-child(2n) { border-right: none; }
.for-me-item:nth-child(3), .for-me-item:nth-child(4) { border-bottom: none; }
.for-me-num { font-family: var(--fb); font-size: 14px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.for-me-item h3 { font-family: var(--fd); font-size: 20px; font-weight: 800; color: var(--black); line-height: 1.3; }
.for-me-answer-lbl { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gray-400); }
.for-me-item p { font-size: 15px; color: var(--gray-600); line-height: 1.7; }
.for-me-overlay { position: absolute; bottom: 0; left: 0; right: 0; height: 30%; background: var(--red); padding: 0 26px; display: flex; align-items: center; justify-content: space-between; gap: 12px; transform: translateY(101%); transition: transform .34s cubic-bezier(.4,0,.2,1); }
.for-me-item:hover .for-me-overlay, .for-me-item.active .for-me-overlay { transform: translateY(0); }
.for-me-overlay-link { font-family: var(--fd); font-size: 15px; font-weight: 800; color: #fff; text-decoration: none; line-height: 1.3; }
.for-me-overlay-arrow { width: 32px; height: 32px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.5); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.for-me-overlay-arrow svg { width: 14px; height: 14px; stroke: #fff; stroke-width: 2.5; fill: none; }
.for-me-hover-hint { position: absolute; bottom: 14px; right: 16px; display: flex; align-items: center; gap: 5px; font-family: var(--fb); font-size: 13px; font-weight: 700; color: var(--gray-400); letter-spacing: .06em; transition: opacity .2s; pointer-events: none; }
.for-me-hover-hint svg { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--gray-200); padding: 6px; stroke: var(--gray-400); stroke-width: 2; fill: none; flex-shrink: 0; }
.for-me-item:hover .for-me-hover-hint, .for-me-item.active .for-me-hover-hint { opacity: 0; }
.for-me-header { margin-bottom: 28px; }
@media (max-width: 700px) {
	.for-me-qa-grid { grid-template-columns: 1fr; }
	.for-me-item:nth-child(2n) { border-right: none; }
	.for-me-item:nth-child(3) { border-bottom: 1px solid var(--gray-200); }
	.for-me-item:nth-child(4) { border-bottom: none; }
	.for-me-overlay { position: static; height: auto; background: transparent; padding: 0; transform: none; transition: none; }
	.for-me-overlay-link { color: var(--red); font-size: 13px; }
	.for-me-overlay-arrow, .for-me-hover-hint { display: none; }
}

/* ── RESOURCES ──────────────────────────────────────────────────── */
.res-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.res-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.res-thumb { display: block; aspect-ratio: 16/9; overflow: hidden; background: var(--gray-100); }
.res-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.res-card:hover .res-thumb img { transform: scale(1.04); }
.res-body { padding: 18px 20px; display: flex; flex-direction: column; flex: 1; gap: 8px; }
.res-kicker { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.res-title { font-family: var(--fd); font-size: 16px; font-weight: 800; color: var(--black); line-height: 1.3; }
.res-title a { color: inherit; text-decoration: none; }
.res-title a:hover { color: var(--red); }
.res-ex { font-size: 14px; color: var(--gray-600); line-height: 1.65; flex: 1; }
.res-more { font-family: var(--fd); font-size: 14px; font-weight: 700; color: var(--red); text-decoration: none; margin-top: 4px; }
.res-all { margin-top: 28px; text-align: center; }
@media (max-width: 900px) { .res-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .res-grid { grid-template-columns: 1fr; } }

/* ── FAQ (MSIS variant: columns, grouped accordions) ────────────── */
.faq-list { margin-top: 32px; columns: 1; }
.faq-group { border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; margin-bottom: 10px; }
.faq-group-btn { width: 100%; text-align: left; background: var(--gray-100); border: none; font-family: var(--fd); font-size: 19px; font-weight: 800; color: var(--black); padding: 16px 20px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; transition: background .15s; }
.faq-group-btn:hover { background: var(--gray-200); }
.faq-group-btn.open { color: var(--red); background: #fff; }
.faq-group-btn.open .faq-ic { background: var(--red); color: #fff; transform: rotate(45deg); }
.faq-group-body { display: none; background: #fff; }
.faq-group-body.open { display: block; }
.faq-group-body .faq-item { border-bottom: 1px solid var(--gray-100); margin: 0 16px; }
.faq-group-body .faq-item:last-child { border-bottom: none; }
.faq-group-body .faq-q { font-size: 16px; padding: 13px 4px; }
.faq-group-body .faq-a p { font-size: 14px; }
.faq-item { border-bottom: 1px solid var(--gray-200); break-inside: avoid; display: block; }
.faq-q { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 18px 0; cursor: pointer; font-family: var(--fd); font-size: 16px; font-weight: 800; color: var(--black); line-height: 1.3; background: none; border: none; width: 100%; text-align: left; transition: color .15s; }
.faq-q:hover, .faq-q.op { color: var(--red); }
.faq-ic { width: 26px; height: 26px; background: var(--gray-100); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; transition: background .15s, transform .25s; color: var(--gray-600); }
.faq-q.op .faq-ic { background: var(--red); color: #fff; transform: rotate(45deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .35s ease, padding .3s ease; font-size: 14px; color: var(--gray-600); line-height: 1.8; }
.faq-a.op { max-height: 500px; padding-bottom: 18px; }
.faq-a p + p { margin-top: 8px; }
.faq-a strong { color: var(--black); font-weight: 700; }
.faq-a a { color: var(--red); font-weight: 700; }

/* ── TUITION FINDER ─────────────────────────────────────────────── */
.sel-wrap { margin-bottom: 24px; }
.sel-wrap .det-lbl { display: block; margin-bottom: 8px; }
.nuo-tuition-select { width: 100%; font-family: var(--fb); font-size: 15px; font-weight: 600; color: var(--black); padding: 15px 18px; border: 1px solid var(--gray-200); border-left: 4px solid var(--red); border-radius: var(--radius); background: #fff; cursor: pointer; }
.nuo-tuition-select:focus { outline: none; border-color: var(--red); }

.pcard { border: 1px solid var(--gray-200); border-radius: var(--radius-lg); overflow: hidden; background: #fff; }

/* Header */
.pcard-head { background: var(--black); padding: 22px 26px 0; }
.badge-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.bdg { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 6px 14px; border-radius: 20px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); color: #fff; }
.bdg-degree { background: rgba(204,0,0,.35); border-color: rgba(204,0,0,.55); }
.bdg-cert { background: rgba(255,255,255,.08); }
.bdg-new { background: var(--red); border-color: var(--red); }
.pcard-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-bottom: 18px; }
.pcard-name { font-family: var(--fd); font-size: 30px; font-weight: 900; color: #fff; line-height: 1.15; margin: 0 0 6px; }
.pcard-meta { font-size: 13px; color: var(--gray-400); line-height: 1.5; margin: 0; }
.pcard-link { font-family: var(--fb); font-size: 13px; font-weight: 700; color: #fff; opacity: .8; text-decoration: none; white-space: nowrap; }
.pcard-link:hover { opacity: 1; }
.hero-price-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 18px 0 22px; border-top: 1px solid rgba(255,255,255,.12); }
.hero-price-left { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); }
.hero-price-amt { font-family: var(--fd); font-size: 40px; font-weight: 900; color: #fff; line-height: 1; }
.hero-price-sub { font-size: 13px; color: var(--gray-400); margin-top: 5px; }

/* Employer band, certificates */
.csec { padding: 20px 26px; border-bottom: 1px solid var(--gray-200); }
.csec-lbl { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 12px; }
.info-note { background: var(--tint-red-04); border: 1px solid rgba(204,0,0,.14); border-radius: 8px; padding: 13px 16px; font-size: 13.5px; color: var(--gray-600); line-height: 1.65; margin-top: 12px; }
.info-note strong { color: var(--black); font-weight: 700; }

/* Path selection */
.cstrip-wrap { background: var(--off-white); border-bottom: 1px solid var(--gray-200); padding: 20px 26px 22px; }
.cstrip-eyebrow { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 14px; }
.cstrip { display: grid; grid-template-columns: 1fr 1fr; }
.ccol { background: #fff; border: 1px solid var(--gray-200); padding: 22px 24px; display: flex; flex-direction: column; gap: 6px; transition: background .2s, color .2s; }
.ccol:first-child { border-radius: var(--radius) 0 0 var(--radius); }
.ccol:last-child { border-left: none; border-radius: 0 var(--radius) var(--radius) 0; }
.ccol-lbl { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--gray-400); }
.ccol-total { font-family: var(--fd); font-size: 32px; font-weight: 900; color: var(--black); line-height: 1; }
.ccol-save { font-size: 13px; color: var(--gray-600); line-height: 1.5; }
.ccol-btn { align-self: flex-start; margin-top: 12px; font-family: var(--fb); font-size: 13px; font-weight: 700; color: #fff; background: var(--black); border: none; border-radius: 20px; padding: 10px 20px; cursor: pointer; transition: background .15s; }
.ccol-btn:hover { background: var(--red); }
.ccol-btn-active { display: none; }
/* Selected column inverts. */
.ccol.sel { background: var(--red); border-color: var(--red); }
.ccol.sel .ccol-lbl, .ccol.sel .ccol-save { color: rgba(255,255,255,.85); }
.ccol.sel .ccol-total { color: #fff; }
.ccol.sel .ccol-btn { background: rgba(255,255,255,.2); cursor: default; }
.ccol.sel .ccol-btn:hover { background: rgba(255,255,255,.2); }
.ccol.sel .ccol-btn-idle { display: none; }
.ccol.sel .ccol-btn-active { display: inline; }

/* Accordions */
.wp-acc { border-bottom: 1px solid var(--gray-200); }
.wp-acc-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: none; border: none; cursor: pointer; padding: 16px 26px; font-family: var(--fb); font-size: 14px; font-weight: 600; color: var(--black); text-align: left; transition: background .15s; }
.wp-acc-toggle:hover { background: var(--off-white); }
.wp-acc-icon { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; color: var(--gray-400); transition: transform .22s; flex-shrink: 0; }
.wp-acc-icon svg { width: 12px; height: 12px; }
.wp-acc.open .wp-acc-icon { transform: rotate(180deg); color: var(--red); }
.wp-acc-body { max-height: 0; overflow: hidden; transition: max-height .35s ease; padding: 0 26px; }
.wp-acc.open .wp-acc-body { max-height: 1200px; padding-bottom: 24px; }
.wp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.wp-col { background: var(--gray-100); border-radius: var(--radius); padding: 20px 22px; }
.wp-col-title { font-family: var(--fb); font-size: 13px; font-weight: 800; color: var(--black); margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--gray-200); }
.wp-line { display: grid; grid-template-columns: 14px 1fr; gap: 10px; padding: 6px 0; align-items: start; font-size: 13.5px; color: var(--gray-600); line-height: 1.6; }
.wp-bullet { width: 6px; height: 6px; border-radius: 50%; background: var(--gray-400); margin-top: 7px; }
.wp-btn { display: inline-block; margin-top: 14px; font-family: var(--fb); font-size: 13px; font-weight: 700; padding: 9px 18px; border-radius: 20px; text-decoration: none; }
.wp-btn-red { background: var(--red); color: #fff; }
.wp-btn-dark { background: var(--black); color: #fff; }

/* Scholarship tag, shown once a path is chosen */
.schol-confirmed-sec { padding: 18px 26px; border-bottom: 1px solid var(--gray-200); }
.schol-confirmed-ey { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 12px; }
.schol-row { display: flex; gap: 10px; flex-wrap: wrap; }
.schol-tag { display: inline-flex; align-items: center; gap: 10px; border: 1px solid rgba(204,0,0,.25); border-radius: 8px; padding: 10px 14px; }
.schol-tag-pct { font-family: var(--fd); font-size: 17px; font-weight: 900; color: var(--red); }
.schol-tag-txt { font-size: 13px; color: var(--gray-600); line-height: 1.4; }

/* Rate and credits */
.details { padding: 18px 26px; background: var(--off-white); border-bottom: 1px solid var(--gray-200); }
.det-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; background: #fff; }
.det-cell { padding: 18px 22px; border-right: 1px solid var(--gray-200); }
.det-cell:last-child { border-right: none; }
.det-lbl { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 6px; }
.det-val { font-family: var(--fd); font-size: 24px; font-weight: 900; color: var(--black); line-height: 1.1; }
.det-sub { font-size: 13px; color: var(--gray-600); margin-top: 4px; }

/* Per-term tiles */
.pt-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.pt-tile { background: #fff; border: 1px solid var(--gray-200); border-radius: 8px; padding: 14px 16px; }
.pt-lbl { font-family: var(--fb); font-size: 13px; font-weight: 700; color: var(--gray-600); letter-spacing: .04em; text-transform: uppercase; margin-bottom: 6px; }
.pt-price { font-family: var(--fd); font-size: 24px; font-weight: 900; color: var(--black); line-height: 1; }
.pt-note { font-size: 13px; color: var(--gray-400); font-style: italic; margin-top: 12px; }

/* University-wide scholarships */
.uschol { padding: 20px 26px; }
.uschol-ey { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); margin-bottom: 14px; }
.uschol-row { display: grid; grid-template-columns: 22px 1fr; gap: 12px; padding: 9px 0; align-items: start; }
.uschol-tick { width: 20px; height: 20px; border-radius: 50%; background: rgba(26,122,58,.1); color: #1A7A3A; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; }
.uschol-name { font-size: 14.5px; font-weight: 700; color: var(--black); line-height: 1.4; }
.uschol-desc { font-size: 13px; color: var(--gray-600); line-height: 1.6; margin-top: 2px; }
.uschol-note { font-size: 13px; color: var(--gray-400); font-style: italic; line-height: 1.7; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--gray-200); }

/* Disclaimer, outside the card */
.tuition-disclaimer { display: flex; gap: 12px; align-items: flex-start; background: var(--tint-red-04); border: 1px solid rgba(204,0,0,.14); border-radius: var(--radius); padding: 14px 20px; font-size: 13px; color: var(--gray-600); line-height: 1.6; margin-top: 16px; }
.tuition-disclaimer-icon { color: var(--red); flex-shrink: 0; }
.tuition-disclaimer strong { color: var(--black); font-weight: 700; }

@media (max-width: 800px) {
	.cstrip, .wp-grid, .det-grid { grid-template-columns: 1fr; }
	.ccol:last-child { border-left: 1px solid var(--gray-200); border-top: none; }
	.det-cell { border-right: none; border-bottom: 1px solid var(--gray-200); }
	.det-cell:last-child { border-bottom: none; }
}
@media (max-width: 600px) {
	.pcard-head, .csec, .cstrip-wrap, .schol-confirmed-sec, .details, .uschol { padding-left: 18px; padding-right: 18px; }
	.wp-acc-toggle, .wp-acc-body { padding-left: 18px; padding-right: 18px; }
	.pcard-name { font-size: 24px; }
	.hero-price-amt { font-size: 32px; }
}

/* ── FUNDING CARDS AND BILLING (tuition page) ───────────────────── */
.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
.pcard-info { background: #fff; border: 1px solid var(--gray-200); border-top: 3px solid var(--red); border-radius: var(--radius-lg); padding: 28px; }
.pcard-icon { width: 40px; height: 40px; background: var(--gray-100); border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; font-size: 20px; }
.pcard-info .card-title { font-family: var(--fb); font-size: 17px; font-weight: 800; color: var(--black); margin: 0 0 10px; line-height: 1.3; }
.pcard-info p { font-size: 15px; color: var(--gray-600); line-height: 1.7; margin-top: 10px; }
.pcard-info p:first-of-type { margin-top: 0; }

.wp-wrap { display: flex; flex-direction: column; }
.wp-row { display: grid; grid-template-columns: 20px 1fr; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--gray-200); align-items: start; }
.wp-row:last-child { border-bottom: none; }
.wp-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--red); margin-top: 7px; }
.wp-col-title { font-family: var(--fd); font-size: 17px; font-weight: 800; color: var(--black); margin-bottom: 5px; line-height: 1.3; }
.wp-row p { font-size: 14.5px; color: var(--gray-600); line-height: 1.7; }
@media (min-width: 1025px) { .wp-col-title { font-size: 19px; } .wp-row p { font-size: 16px; } }
@media (max-width: 600px) { .pcard-info { padding: 22px; } }

/* ── SCHOLARSHIP CARDS ──────────────────────────────────────────── */
.schol-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.schol-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 24px; position: relative; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .18s, transform .18s; }
.schol-card:hover { box-shadow: 0 8px 32px rgba(26,24,22,.12); transform: translateY(-2px); }
.schol-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--red); }
.schol-pct { font-family: var(--fd); font-size: 46px; font-weight: 900; line-height: 1; color: var(--red); margin-bottom: 8px; }
.schol-name { font-size: 15px; font-weight: 800; line-height: 1.35; color: var(--black); margin-bottom: 8px; }
.schol-applies { font-size: 13px; font-weight: 700; letter-spacing: .05em; line-height: 1.5; text-transform: uppercase; color: var(--gray-400); margin-bottom: 12px; }
.schol-desc { font-size: 14px; color: var(--gray-600); line-height: 1.6; }
@media (max-width: 1080px) { .schol-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (max-width: 560px) { .schol-grid { grid-template-columns: 1fr; } .schol-name, .schol-applies { min-height: 0; } }

/* ── TUITION TABLE (shortcode) ──────────────────────────────────── */
.nuo-tuition-table-wrap { overflow-x: auto; }
.nuo-tuition-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; }
.nuo-tuition-table caption { font-family: var(--fb); font-size: 13px; color: var(--gray-600); text-align: left; padding: 0 0 12px; }
.nuo-tuition-table th, .nuo-tuition-table td { padding: 14px 18px; text-align: left; border-bottom: 1px solid var(--gray-200); font-size: 15px; }
.nuo-tuition-table thead th { font-family: var(--fb); font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--gray-400); background: var(--off-white); border-bottom: 2px solid var(--gray-200); }
.nuo-tuition-table tbody th { font-family: var(--fd); font-weight: 800; color: var(--black); }
.nuo-tuition-table tbody th a { color: var(--black); text-decoration: none; }
.nuo-tuition-table tbody th a:hover { color: var(--red); }
.nuo-tuition-table tbody td { font-family: var(--fd); font-weight: 700; color: var(--gray-600); }
.nuo-tuition-table tbody tr:last-child th, .nuo-tuition-table tbody tr:last-child td { border-bottom: none; }
.nuo-tuition-table tbody tr:nth-child(even) { background: var(--off-white); }

/* ── DEADLINE STRIP (shortcode) ─────────────────────────────────── */
.nuo-deadlines { background: var(--black); border-radius: var(--radius-lg); padding: 22px 20px; }
.nuo-deadlines-term { font-family: var(--fd); font-size: 15px; font-weight: 900; color: #fff; margin-bottom: 14px; }
.nuo-deadline-row { display: flex; justify-content: space-between; align-items: center; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.06); font-size: 13px; color: var(--gray-light); }
.nuo-deadline-row:last-child { border-bottom: none; }
.nuo-deadline-row span:last-child { font-family: var(--fd); font-weight: 900; color: #fff; }
.nuo-deadline-ext span:first-child { color: #fff; }

/* ── RATINGS (shortcode) ────────────────────────────────────────── */
.nuo-ratings { display: flex; gap: 32px; flex-wrap: wrap; align-items: flex-start; }
.nuo-rating-v { font-family: var(--fd); font-size: 34px; font-weight: 900; color: var(--red); line-height: 1; }
.nuo-rating-l { font-size: 13px; font-weight: 600; color: var(--gray-600); margin-top: 4px; }
.nuo-rating-note { flex-basis: 100%; font-size: 13px; color: var(--gray-400); font-style: italic; margin-top: 4px; }

/* ── DEADLINE EXTENSION STATES ──────────────────────────────────── */
/* Retained for pages still using the .nu-fa-probe switch. New pages use the
   [nu_if_extension] shortcode, which resolves this server side. */
.nu-fa-probe { display: none; }
.dl-ext-only { display: none !important; }
body:has(.nu-fa-probe:not(:empty)) .dl-std { display: none !important; }
body:has(.nu-fa-probe:not(:empty)) span.dl-ext-only { display: inline !important; }
body:has(.nu-fa-probe:not(:empty)) p.dl-ext-only { display: block !important; }
body:has(.nu-fa-probe:not(:empty)) div.dl-ext-only { display: flex !important; }
body:has(.nu-fa-probe:not(:empty)) .snav-deadline { border-color: var(--red); color: var(--red); }
/* .dl-ext-badge is defined once, with the deadline table rules. */
.adm-ext-note, .adm-closed-note { display: block !important; padding: 11px 14px !important; margin: 0 !important; font-size: 14px !important; line-height: 1.5 !important; border-radius: 0 7px 7px 0; color: var(--gray-600); }
.adm-ext-note { background: rgba(204,0,0,.07); border-left: 3px solid var(--red); }
.adm-ext-note strong { color: var(--black); font-weight: 800; }
.adm-closed-note { background: var(--gray-100); border-left: 3px solid var(--gray-400); }
.adm-closed-note a { color: var(--red); font-weight: 700; }

/* ── DESKTOP LEGIBILITY ─────────────────────────────────────────── */
@media (min-width: 1025px) {
	.ey, .cc-ey, .hero-card-t { font-size: 14px; }
	.lead { font-size: 19px; }
	.ov-cols p { font-size: 18px; }
	.fmt-d, .sk-card p, .cpe-cta p, .vid-desc { font-size: 16px; line-height: 1.7; }
	.sk-card h3, .feat-name { font-size: 19px; }
	.tr-main p { font-size: 17px; }
	.tr-name, .curr-card-name, .path-acc-name { font-size: 17px; }
	.fac-p, .fac-link { font-size: 17px; }
	.fac-cr span { font-size: 16px; }
	.te-q { font-size: 19px; }
	.why-panel-desc, .why-item-label { font-size: 16px; }
	.faq-a { font-size: 15px; }
	.adm-tagline { font-size: 17px; }
	.adm-step, .adm-check-it { font-size: 16px; line-height: 1.6; }
	.curr-desc, .feat-outcome, .feat-struct-row { font-size: 15px; }
	.feat-strip-desc { font-size: 16px; }
	.atg-lbl { font-size: 16px; }
	.atg-val { font-size: 17px; }
	.wc-row h3 { font-size: 21px; }
	.wc-row p { font-size: 16px; }
	.for-me-item h3 { font-size: 22px; }
	.for-me-item p { font-size: 16px; }
	.os-r { font-size: 15px; }
	.os-s { font-size: 14px; }
	.sv { font-size: 24px; }
	.sl { font-size: 14px; }
	.t-box-v { font-size: 30px; }
	.t-note { font-size: 16px; }
	h1.h, h2.h, h3.h, .h { font-size: clamp(34px, 3.5vw, 52px) !important; }
}

/* ── GLOBAL MOBILE ──────────────────────────────────────────────── */
@media (max-width: 768px) {
	.cpe-cta { flex-direction: column; }
	.cpe-cta .btn { width: 100%; justify-content: center; }
	.adm-grid { grid-template-columns: 1fr; }
}

/* The cost blade: copy beside the figure, stacking on a phone. It was an
   inline grid, which had no way to collapse. */
.cost-split { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: center; }
@media (max-width: 860px) { .cost-split { grid-template-columns: 1fr; gap: 28px; } }

/* ── MOBILE, COMPONENTS ADDED SINCE THE LAST PASS ───────────────── */
@media (max-width: 600px) {

	/* Cards */
	.cert-body { padding: 20px 20px 22px; }
	.cert-name { font-size: 20px; }
	.cm { padding: 12px 0; }
	.cm-val, .cm:nth-child(4) .cm-val { font-size: 18px; }
	.cert-cta { flex-direction: column; align-items: stretch; }
	.cert-cta .aud-btn { width: 100%; justify-content: center; }

	/* Ghost number steps */
	.gsteps { grid-template-columns: 1fr; }
	.gstep { padding: 20px 20px 22px; }

	/* Icon list */
	.slist-icons li { padding-left: 44px; }
	.slist-icons .sl-ico { width: 30px; height: 30px; }

	/* Hero */
	.hero-facts { gap: 6px; }
	.hero-facts .st-fact { padding: 7px 13px; }

	/* Video */
	.pvid-title { font-size: 15px; padding: 14px 16px 28px; }
	.pvid-play { width: 58px; height: 41px; }

	/* Stack Track explorer: the saving sits under the name rather than
	   beside it, where there is no room for both. */
	.st-degree-top { flex-direction: column; gap: 6px; }
	.st-save { text-align: left; }
	.st-degree { padding: 14px 15px; }
	.st-panel h3 { font-size: 20px; }

	/* FAQ */
	.nufaq-pills { gap: 6px; }
	.nufaq-pill { padding: 7px 13px; }

	/* Callout */
	.dl-callout { flex-direction: column; align-items: flex-start; gap: 12px; }

	/* Tables keep their own scroll container, but the wrapper must not
	   push the page sideways. */
	.table-scroll { max-width: 100%; }
}

/* ── PROGRAM PAGES ON MOBILE ────────────────────────────────────── */
@media (max-width: 768px) {

	/* A blade gets 24px from .blade plus 20px from .ci. The hero had only
	   the 20px, which is why the program pages read tighter to the edge
	   than the hub and tool pages. */
	.hero { padding: 80px 24px 48px; }

	/* Buttons sit at their own width, as they do on the hub and tool pages,
	   rather than stretching the full width of the screen. */
	.hero-acts { flex-direction: row; flex-wrap: wrap; gap: 10px; }
	.hero-acts .btn,
	.career-cta .btn,
	.prep-box-actions .btn,
	.cpe-cta .btn { width: auto; justify-content: center; }
}

/* ── SITE NAV ───────────────────────────────────────────────────── */
/* [nu_nav]. One component in place of the six nav Code modules.
   Each scheme only sets the custom properties below; the rules after it
   are shared. Selectors start at .nuo-nav-root so they outrank Divi's
   element-plus-class rules on ul, li, a and button inside a header
   template. */

.nuo-nav-root {
	--nav-bg: #000;
	--nav-fg: #fff;
	--nav-hover: rgba(255, 255, 255, .1);
	--nav-edge: 0 1px 0 rgba(255, 255, 255, .1), 0 -1px 0 rgba(255, 255, 255, .1);
	--nav-logo: brightness(0) invert(1);
	--nav-chev: .5;
	--nav-divider: rgba(255, 255, 255, .2);
	--panel-bg: var(--black);
	--panel-edge: rgba(255, 255, 255, .12);
	--panel-fg: #fff;
	--panel-hover: rgba(255, 255, 255, .08);
	--panel-muted: rgba(255, 255, 255, .4);
	--panel-shadow: 0 8px 32px rgba(0, 0, 0, .4);
	--drawer-bg: #000;
	--drawer-fg: #fff;
	--drawer-line: rgba(255, 255, 255, .12);
	--drawer-link: .75;
}

.nuo-nav-root.nuo-nav--white,
.nuo-nav-root.nuo-nav--transparent-dark,
.nuo-nav-root.nuo-nav--transparent-light.is-static {
	--panel-bg: #fff;
	--panel-edge: var(--gray-200);
	--panel-fg: var(--black);
	--panel-hover: var(--gray-100);
	--panel-muted: var(--gray-400);
	--panel-shadow: 0 8px 32px rgba(0, 0, 0, .12);
	--drawer-bg: #fff;
	--drawer-fg: var(--black);
	--drawer-line: var(--gray-200);
	--drawer-link: .85;
}

.nuo-nav-root.nuo-nav--white {
	--nav-bg: #fff;
	--nav-fg: var(--black);
	--nav-hover: var(--gray-100);
	--nav-edge: 0 1px 0 var(--gray-200);
	--nav-logo: none;
	--nav-divider: var(--gray-200);
}

.nuo-nav-root.nuo-nav--transparent-light {
	--nav-bg: transparent;
	--nav-hover: rgba(255, 255, 255, .12);
	--nav-edge: none;
	--nav-chev: .6;
}

/* Sticky transparent-light keeps a dark drawer, as the old sticky file did. */
.nuo-nav-root.nuo-nav--transparent-light.is-sticky {
	--drawer-bg: var(--black);
}

.nuo-nav-root.nuo-nav--transparent-dark {
	--nav-bg: transparent;
	--nav-fg: var(--black);
	--nav-hover: rgba(26, 24, 22, .08);
	--nav-edge: none;
	--nav-logo: none;
	--nav-chev: .6;
	--nav-divider: rgba(26, 24, 22, .2);
}

/* Sticky transparent bars take a frosted background once scrolled. */
.nuo-nav-root.nuo-nav--transparent-light.is-scrolled {
	--nav-bg: rgba(0, 0, 0, .7);
	--nav-edge: 0 1px 0 rgba(255, 255, 255, .1), 0 -1px 0 rgba(255, 255, 255, .1);
}

.nuo-nav-root.nuo-nav--transparent-dark.is-scrolled {
	--nav-bg: rgba(255, 255, 255, .85);
	--nav-edge: 0 1px 0 var(--gray-200);
}

/* ── bar ── */

.nuo-nav-root .nuo-nav,
.nuo-nav-root .nuo-nav *,
.nuo-nav-root .nuo-nav__drawer,
.nuo-nav-root .nuo-nav__drawer * {
	box-sizing: border-box !important;
}

.nuo-nav-root .nuo-nav {
	position: relative;
	z-index: 9990;
	width: 100% !important;
	height: 72px !important;
	min-height: 72px !important;
	max-height: 72px !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
	font-family: var(--fb);
	background: var(--nav-bg) !important;
	box-shadow: var(--nav-edge) !important;
	transition: background .3s ease, box-shadow .3s ease, top .2s ease;
}

.nuo-nav-root.is-sticky .nuo-nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
}

.nuo-nav-root.nuo-nav--transparent-light.is-static .nuo-nav,
.nuo-nav-root.nuo-nav--transparent-dark.is-static .nuo-nav {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.nuo-nav-root.nuo-nav--transparent-light.is-scrolled .nuo-nav,
.nuo-nav-root.nuo-nav--transparent-dark.is-scrolled .nuo-nav {
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.nuo-nav-root .nuo-nav__inner {
	max-width: 90%;
	height: 72px !important;
	margin: 0 auto !important;
	padding: 0 32px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: nowrap !important;
}

.nuo-nav-root .nuo-nav__logo {
	flex-shrink: 0 !important;
	margin-right: auto !important;
	display: flex !important;
	align-items: center !important;
	line-height: 0 !important;
	text-decoration: none !important;
}

.nuo-nav-root .nuo-nav__logo img {
	display: inline-block !important;
	width: auto !important;
	height: 36px !important;
	max-width: 240px !important;
	max-height: 36px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	filter: var(--nav-logo) !important;
}

.nuo-nav-root .nuo-nav__main {
	display: block;
	margin: 0 !important;
	padding: 0 !important;
}

.nuo-nav-root ul.nuo-nav__links {
	display: flex !important;
	align-items: center !important;
	gap: 4px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.nuo-nav-root ul.nuo-nav__links > li {
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	background: none !important;
}

.nuo-nav-root ul.nuo-nav__links > li::before,
.nuo-nav-root ul.nuo-nav__links > li::after {
	display: none !important;
	content: none !important;
}

.nuo-nav-root ul.nuo-nav__links > li::marker {
	content: '' !important;
}

.nuo-nav-root ul.nuo-nav__links > li.nuo-nav__divider {
	width: 1px !important;
	height: 16px !important;
	margin: 0 6px !important;
	flex-shrink: 0;
	background: var(--nav-divider) !important;
}

.nuo-nav-root button.nuo-nav__trig,
.nuo-nav-root a.nuo-nav__direct {
	display: flex !important;
	align-items: center !important;
	gap: 5px;
	margin: 0 !important;
	padding: 8px 14px !important;
	font-family: var(--fb) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-decoration: none !important;
	color: var(--nav-fg) !important;
	background: none !important;
	border: none !important;
	border-radius: 6px;
	box-shadow: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background .15s;
}

.nuo-nav-root button.nuo-nav__trig:hover,
.nuo-nav-root button.nuo-nav__trig[aria-expanded="true"],
.nuo-nav-root a.nuo-nav__direct:hover {
	background: var(--nav-hover) !important;
}

.nuo-nav-root button.nuo-nav__trig:focus-visible,
.nuo-nav-root a.nuo-nav__direct:focus-visible,
.nuo-nav-root .nuo-nav__logo:focus-visible,
.nuo-nav-root button.nuo-nav__ham:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.nuo-nav-root .nuo-nav__chev {
	display: inline-flex;
	flex-shrink: 0;
	width: 12px;
	height: 12px;
	opacity: var(--nav-chev);
	transition: transform .2s;
}

.nuo-nav-root .nuo-nav__chev svg {
	display: block;
	width: 12px;
	height: 12px;
}

.nuo-nav-root [aria-expanded="true"] > .nuo-nav__chev {
	transform: rotate(180deg);
}

/* ── desktop panels ── */
/* Fixed rather than absolute, positioned by the script from the trigger,
   because a Divi header section clips anything that overflows it. */

.nuo-nav-root .nuo-nav__drop {
	position: fixed !important;
	z-index: 10000;
	min-width: 240px;
	padding: 8px;
	background: var(--panel-bg);
	border: 1px solid var(--panel-edge);
	border-radius: 10px;
	box-shadow: var(--panel-shadow);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .1s, visibility .1s;
}

.nuo-nav-root .nuo-nav__drop.is-open {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	/* Visible at once on open, so a keyboard user's next Tab lands inside. */
	transition: opacity .1s, visibility 0s;
}

.nuo-nav-root .nuo-nav__drop a {
	display: block !important;
	padding: 9px 14px !important;
	font-family: var(--fb) !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 1.3 !important;
	color: var(--panel-fg) !important;
	text-decoration: none !important;
	border-radius: 6px;
	white-space: nowrap;
	transition: background .12s;
}

.nuo-nav-root .nuo-nav__drop a:hover,
.nuo-nav-root .nuo-nav__drop a:focus-visible {
	background: var(--panel-hover) !important;
	outline: none;
}

.nuo-nav-root .nuo-nav__drop a.nuo-nav__cta {
	display: flex !important;
	align-items: center;
	justify-content: center;
	margin: 8px 2px 2px !important;
	padding: 10px 16px !important;
	font-family: var(--fd) !important;
	font-weight: 700 !important;
	text-align: center;
	color: #fff !important;
	background: var(--red) !important;
	border-radius: 7px !important;
	transition: background .15s !important;
}

.nuo-nav-root .nuo-nav__drop a.nuo-nav__cta:hover,
.nuo-nav-root .nuo-nav__drop a.nuo-nav__cta:focus-visible {
	background: var(--red-dark) !important;
}

.nuo-nav-root .nuo-nav__drop--mega {
	display: flex;
	gap: 8px;
	min-width: 0;
	padding: 12px 8px;
}

.nuo-nav-root .nuo-nav__col {
	min-width: 180px;
}

.nuo-nav-root .nuo-nav__drop--mega a {
	padding: 8px 10px !important;
}

.nuo-nav-root .nuo-nav__col-label {
	display: block;
	padding: 6px 10px 4px;
	font-family: var(--fb);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--panel-muted);
}

/* ── hamburger ── */

.nuo-nav-root button.nuo-nav__ham {
	display: none;
	flex-direction: column;
	justify-content: center;
	flex-shrink: 0;
	gap: 5px;
	width: 36px;
	height: 36px;
	margin: 0 0 0 8px !important;
	padding: 4px !important;
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	cursor: pointer;
}

.nuo-nav-root .nuo-nav__ham span {
	display: block;
	width: 100%;
	height: 2px;
	background: var(--nav-fg);
	border-radius: 2px;
	transform-origin: center;
	transition: transform .25s, opacity .25s;
}

.nuo-nav-root .nuo-nav__ham[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nuo-nav-root .nuo-nav__ham[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nuo-nav-root .nuo-nav__ham[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── mobile drawer ── */

.nuo-nav-root .nuo-nav__drawer {
	position: fixed;
	top: 72px;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9989;
	overflow-y: auto;
	background: var(--drawer-bg);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .22s, visibility .22s;
}

.nuo-nav-root .nuo-nav__drawer.is-open {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

.nuo-nav-root .nuo-nav__ms {
	border-bottom: 1px solid var(--drawer-line);
}

.nuo-nav-root button.nuo-nav__mt,
.nuo-nav-root a.nuo-nav__mdirect {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between;
	width: 100%;
	margin: 0 !important;
	padding: 18px 24px !important;
	font-family: var(--fb) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	text-align: left;
	text-decoration: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: var(--drawer-fg) !important;
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	cursor: pointer;
}

.nuo-nav-root a.nuo-nav__mdirect {
	border-bottom: 1px solid var(--drawer-line) !important;
}

.nuo-nav-root .nuo-nav__mt .nuo-nav__chev,
.nuo-nav-root .nuo-nav__mt .nuo-nav__chev svg {
	width: 14px;
	height: 14px;
}

.nuo-nav-root .nuo-nav__mt .nuo-nav__chev {
	opacity: .5;
}

.nuo-nav-root .nuo-nav__marrow {
	display: inline-flex;
	width: 12px;
	height: 12px;
	opacity: .4;
}

.nuo-nav-root .nuo-nav__marrow svg {
	display: block;
	width: 12px;
	height: 12px;
}

.nuo-nav-root .nuo-nav__ml {
	max-height: 0;
	overflow: hidden;
	padding: 0 24px;
	transition: max-height .28s;
}

.nuo-nav-root .nuo-nav__ml.is-open {
	max-height: 800px;
	padding-bottom: 12px;
}

.nuo-nav-root .nuo-nav__ml a {
	display: block !important;
	padding: 11px 0 !important;
	font-family: var(--fb) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 1.3 !important;
	color: var(--drawer-fg) !important;
	text-decoration: none !important;
	border-bottom: 1px solid var(--drawer-line);
	opacity: var(--drawer-link);
	transition: opacity .12s;
}

.nuo-nav-root .nuo-nav__ml a:last-child {
	border-bottom: none;
}

.nuo-nav-root .nuo-nav__ml a:hover {
	opacity: 1;
}

.nuo-nav-root .nuo-nav__ml a.nuo-nav__cta {
	display: inline-flex !important;
	align-items: center;
	margin: 8px 0 4px !important;
	padding: 9px 16px !important;
	font-family: var(--fd) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	color: #fff !important;
	background: var(--red) !important;
	border-bottom: none !important;
	border-radius: 7px !important;
	opacity: 1 !important;
	transition: background .15s !important;
}

.nuo-nav-root .nuo-nav__msub {
	display: block;
	padding: 12px 0 2px;
	font-family: var(--fb);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--panel-muted);
}

.nuo-nav-root .nuo-nav__msub:first-child {
	padding-top: 2px;
}

@media (max-width: 900px) {

	.nuo-nav-root ul.nuo-nav__links { display: none !important; }
	.nuo-nav-root button.nuo-nav__ham { display: flex !important; }

	/* Static dark and white bars pin on mobile, as the old dark file did. */
	.nuo-nav-root.nuo-nav--dark.is-static .nuo-nav,
	.nuo-nav-root.nuo-nav--white.is-static .nuo-nav {
		position: fixed;
		left: 0;
		right: 0;
	}

	/* Static transparent bars turn white on mobile with dark text. */
	.nuo-nav-root.nuo-nav--transparent-light.is-static,
	.nuo-nav-root.nuo-nav--transparent-dark.is-static {
		--nav-bg: #fff;
		--nav-fg: var(--black);
		--nav-logo: none;
	}
}

@media (max-width: 540px) {
	.nuo-nav-root .nuo-nav__inner { padding: 0 20px !important; }
}
