/*! © 2026 UTM Big Data Centre (UTM BDC), Universiti Teknologi Malaysia. All rights reserved.
    Unauthorised copying, modification or redistribution of this file is prohibited. */
/* UTM BDC shared base styles — extracted verbatim from the front page (Design 19, v3.9.1), hero photo data removed. */
/* Brand tokens: UTM corporate system as used on people.utm.my (Design 19).
   Layout: utility bar + sticky white header with reading progress; light cream hero;
   alternating white / cream sections; gold reserved for highlights. */
:root {
  --utm-maroon: #5C001F;
  --utm-dark-maroon: #3A0F1E;
  --utm-gold: #F8BE17;
  --cream: #F7F2EA;
  --cream-light: #FCF9F4;
  --white: #ffffff;
  --text-dark: #201A18;
  --text-secondary: #6C6460;
  --border-soft: #E8DED3;
  --serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --container: 1200px;
  --pad: 24px;
  --radius: 12px;
  --radius-lg: 18px;
  --shadow: 0 4px 20px rgba(32,26,24,.06);
  --shadow-lg: 0 16px 44px rgba(32,26,24,.12);
  --ease: cubic-bezier(.22,1,.36,1);
  --header-h: 80px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--sans); color: var(--text-dark); background: var(--white);
  line-height: 1.65; overflow-x: hidden; font-size: 16px;
}
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
img { max-width: 100%; height: auto; display: block; }
button { font-family: inherit; }
h1, h2, h3 { text-wrap: balance; }
:focus-visible { outline: 3px solid rgba(248,190,23,.7); outline-offset: 3px; border-radius: 4px; }
.container { max-width: var(--container); margin: 0 auto; padding-inline: var(--pad); }
section[id] { scroll-margin-top: calc(var(--header-h) + 8px); }

/* ============ SKIP LINK ============ */
.skip-link {
  position: fixed; left: 1rem; top: .75rem; z-index: 1001;
  padding: .7rem 1rem; border-radius: 8px; background: var(--white);
  color: var(--utm-maroon); font-size: .8rem; font-weight: 700;
  box-shadow: 0 5px 20px rgba(0,0,0,.15);
  transform: translateY(-180%); transition: transform .18s;
}
.skip-link:focus { transform: translateY(0); }

/* ============ UTILITY BAR ============ */
.utility-bar {
  background: var(--utm-dark-maroon); color: rgba(255,255,255,.84);
  font-size: .72rem; padding-block: .55rem; letter-spacing: .02em;
}
.utility-bar .container { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.utility-left, .utility-right { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.utility-bar a { display: inline-flex; align-items: center; gap: .4rem; transition: color .2s; }
.utility-bar a:hover { color: var(--utm-gold); }
.utility-bar i { color: var(--utm-gold); font-size: .75rem; }

/* ============ MAIN HEADER ============ */
.main-header {
  position: sticky; top: 0; z-index: 100; background: var(--white);
  border-bottom: 1px solid var(--border-soft);
  transition: box-shadow .25s var(--ease);
}
.main-header.scrolled { box-shadow: 0 2px 18px rgba(32,26,24,.08); }
.main-header .container {
  display: flex; justify-content: space-between; align-items: center;
  height: var(--header-h); gap: 1.5rem;
}
.header-brand { display: flex; align-items: center; gap: 1rem; flex-shrink: 0; }
.header-brand__logo img { height: 52px; width: auto; }
.header-brand__divider { width: 1px; height: 36px; background: var(--border-soft); }
.header-brand__text { display: flex; flex-direction: column; line-height: 1.2; }
.header-brand__centre { font-size: 1rem; font-weight: 600; color: var(--utm-maroon); }
.header-brand__university {
  font-size: .56rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-secondary);
}
.header-nav { display: flex; align-items: center; gap: 1.8rem; }
.header-nav a {
  position: relative; padding: .25rem 0; color: var(--text-secondary);
  font-size: .82rem; font-weight: 500; white-space: nowrap; transition: color .2s;
}
.header-nav a::after {
  content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 2px;
  background: var(--utm-maroon); transition: width .25s var(--ease);
}
.header-nav a:hover, .header-nav a.active { color: var(--utm-maroon); }
.header-nav a:hover::after, .header-nav a.active::after { width: 100%; }
.header-nav .nav-cta {
  background: var(--utm-maroon); color: var(--white); padding: .55rem 1.2rem;
  border-radius: 999px; font-weight: 600;
}
.header-nav .nav-cta::after { display: none; }
.header-nav .nav-cta:hover, .header-nav .nav-cta.active { background: var(--utm-dark-maroon); color: var(--white); }

.hamburger {
  display: none; flex-direction: column; gap: 4px; padding: .6rem;
  background: none; border: 0; cursor: pointer;
}
.hamburger span {
  width: 22px; height: 2px; background: var(--text-dark); border-radius: 2px;
  display: block; transition: all .25s var(--ease);
}
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(4px, 4px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(4px, -4px); }

/* Reading-progress indicator (same treatment as people.utm.my) */
.reading-progress {
  position: absolute; left: 0; right: 0; bottom: -1px; height: 3px;
  background: rgba(92,0,31,.08); overflow: hidden; pointer-events: none;
}
.reading-progress__bar {
  display: block; width: 100%; height: 100%;
  background: linear-gradient(90deg, var(--utm-gold), var(--utm-maroon));
  transform: scaleX(0); transform-origin: left center; will-change: transform;
}

/* ============ BUTTONS ============ */
.btn {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .85rem 1.7rem; border-radius: 999px;
  font-weight: 600; font-size: .92rem; border: 2px solid transparent;
  transition: transform .25s var(--ease), background .2s, color .2s, border-color .2s, box-shadow .25s;
  cursor: pointer;
}
.btn-gold { background: var(--utm-gold); color: var(--utm-dark-maroon); }
.btn-gold:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(248,190,23,.35); }
.btn-ghost { color: var(--white); border-color: rgba(255,255,255,.35); }
.btn-ghost:hover { border-color: var(--utm-gold); color: var(--utm-gold); transform: translateY(-2px); }
.btn-primary { background: var(--utm-maroon); color: var(--white); }
.btn-primary:hover { background: #4D001A; transform: translateY(-2px); }
.btn-secondary { background: var(--white); color: var(--utm-maroon); border: 1.5px solid var(--utm-maroon); }
.btn-secondary:hover { background: var(--cream); transform: translateY(-2px); }
.btn-small {
  display: inline-flex; align-items: center; gap: .45rem; align-self: flex-start;
  padding: .6rem 1.15rem; border-radius: 999px; background: var(--utm-maroon);
  color: var(--white); font-weight: 600; font-size: .8rem; transition: background .2s, transform .25s var(--ease);
}
.btn-small:hover { background: var(--utm-dark-maroon); transform: translateY(-2px); }
.text-link {
  display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; font-size: .85rem;
  color: var(--utm-maroon); transition: gap .2s;
}
.text-link:hover { gap: .65rem; }

/* ============ HERO ============ */
/* Light hero, same treatment as people.utm.my: cream ground, photo fading in from the right */
.hero {
  position: relative; overflow: hidden; isolation: isolate; background: var(--cream-light);
  min-height: 560px; display: flex; align-items: center;
  padding-block: clamp(48px, 6vw, 72px);
}
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background-size: cover; background-position: 78% 40%;
  filter: saturate(.92) contrast(1.01);
}
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, #FCF9F4 0%, rgba(252,249,244,.995) 30%, rgba(252,249,244,.94) 44%,
      rgba(252,249,244,.72) 56%, rgba(252,249,244,.32) 68%, rgba(252,249,244,.06) 82%, rgba(252,249,244,0) 100%),
    linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(70,20,38,.05) 100%);
}
.hero .container { width: 100%; }
.hero-content { max-width: 600px; }
.hero-eyebrow {
  display: flex; align-items: center; gap: .62rem; font-size: .72rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--text-secondary); margin-bottom: 1rem;
}
.hero-eyebrow::before { content: ""; width: 24px; height: 2px; background: var(--utm-gold); }
.hero h1 {
  font-family: var(--serif); font-weight: 700; line-height: 1.08; color: var(--utm-maroon);
  font-size: clamp(2.2rem, 4vw, 3.4rem); letter-spacing: -.02em; margin-bottom: 1.1rem;
}
.hero h1 em {
  font-style: italic; font-weight: 600;
  text-decoration: underline; text-decoration-color: var(--utm-gold);
  text-decoration-thickness: 3px; text-underline-offset: 6px;
}
.hero-lead { font-size: 1rem; line-height: 1.7; color: var(--text-secondary); max-width: 34rem; margin-bottom: 1.3rem; }
.hero-card {
  display: flex; gap: .85rem; align-items: flex-start; max-width: 470px;
  background: rgba(255,255,255,.95); border: 1px solid rgba(232,222,211,.95); border-left: 4px solid var(--utm-gold);
  border-radius: 14px; padding: .9rem 1rem; margin-bottom: 1.6rem;
  box-shadow: 0 8px 24px rgba(62,34,42,.06); backdrop-filter: blur(7px);
}
.hero-card i { font-size: 1.3rem; color: var(--utm-maroon); margin-top: .15rem; }
.hero-card strong { display: block; font-size: .94rem; line-height: 1.3; color: var(--text-dark); }
.hero-card span { display: block; font-size: .78rem; color: var(--text-secondary); margin-top: .15rem; }
.hero-buttons { display: flex; gap: .8rem; flex-wrap: wrap; }
.hero-caption {
  position: absolute; right: var(--pad); bottom: 14px; z-index: 1;
  font-size: .72rem; color: var(--text-dark); background: rgba(255,255,255,.88);
  padding: .35rem .7rem; border-radius: 999px; display: inline-flex; gap: .45rem; align-items: center;
}
.hero-caption i { color: var(--utm-maroon); }

/* ============ TRUST STRIP ============ */
.trust-strip { background: var(--cream); border-bottom: 1px solid var(--border-soft); }
.trust-inner {
  display: flex; justify-content: center; align-items: center; flex-wrap: wrap;
  gap: .6rem 2.4rem; padding-block: 1.1rem;
}
.trust-inner span {
  display: inline-flex; align-items: center; gap: .55rem;
  font-size: .76rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-secondary);
}
.trust-inner i { color: var(--utm-maroon); }

/* ============ SECTIONS ============ */
.section { padding-block: clamp(64px, 8vw, 100px); }
.section--cream { background: var(--cream-light); border-block: 1px solid var(--border-soft); }
.section-label {
  font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: var(--utm-maroon); margin-bottom: .8rem; display: inline-flex; align-items: center; gap: .6rem;
}
.section-label::before { content: ""; width: 22px; height: 2px; background: var(--utm-gold); }
.section-title {
  font-family: var(--serif); font-weight: 700; color: var(--utm-maroon);
  font-size: clamp(1.8rem, 3.2vw, 2.5rem); line-height: 1.2; margin-bottom: 1rem;
}
.section-subtitle { color: var(--text-secondary); font-size: 1.04rem; max-width: 40rem; }
.section-header { margin-bottom: clamp(36px, 5vw, 52px); }
.section-header--split { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; flex-wrap: wrap; }

/* ============ ABOUT ============ */
.about-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(36px, 5vw, 64px); align-items: start; }
.about-text p { color: var(--text-secondary); font-size: 1.04rem; margin-bottom: 1.1rem; max-width: 38rem; }
.about-text strong { color: var(--text-dark); font-weight: 600; }
.about-photo {
  width: 100%; aspect-ratio: 2 / 1; object-fit: cover; border-radius: var(--radius);
  margin-top: 1.6rem; border: 1px solid var(--border-soft);
}
.about-photo-cap { font-size: .76rem; color: var(--text-secondary); margin-top: .55rem; }
.facts-wrap { position: sticky; top: calc(var(--header-h) + 24px); }
.facts { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--border-soft); border-radius: var(--radius-lg); overflow: hidden; background: var(--white); }
.fact { padding: 1.8rem 1.5rem; border-bottom: 1px solid var(--border-soft); }
.fact:nth-child(odd) { border-right: 1px solid var(--border-soft); }
.fact:nth-last-child(-n+2) { border-bottom: 0; }
.fact-num {
  font-family: var(--serif); font-size: clamp(2.2rem, 4vw, 2.9rem); font-weight: 700;
  color: var(--utm-maroon); line-height: 1; font-variant-numeric: tabular-nums;
}
.fact-lbl { font-size: .86rem; color: var(--text-dark); font-weight: 600; margin-top: .6rem; }
.fact-src { font-size: .74rem; color: var(--text-secondary); margin-top: .2rem; }
.facts-note { font-size: .76rem; color: var(--text-secondary); margin-top: .8rem; }

/* ============ RESEARCH ============ */
.research-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.research-card {
  background: var(--white); border: 1px solid var(--border-soft); border-radius: var(--radius);
  padding: 1.8rem 1.6rem; position: relative; overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.research-card::before {
  content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--utm-gold), var(--utm-maroon));
  transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease);
}
.research-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
.research-card:hover::before { transform: scaleX(1); }
.card-icon {
  width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center;
  background: rgba(92,0,31,.07); color: var(--utm-maroon); font-size: 1.15rem; margin-bottom: 1.1rem;
}
.research-card h3 { font-size: 1.04rem; font-weight: 700; color: var(--text-dark); margin-bottom: .5rem; line-height: 1.35; }
.research-card p { font-size: .9rem; color: var(--text-secondary); }

/* ============ TRAINING ============ */
.training-intro { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 5vw, 56px); align-items: center; margin-bottom: 3.5rem; }
.training-photo {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center 25%;
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
}
.training-photo-cap { font-size: .76rem; color: var(--text-secondary); margin-top: .55rem; }
.training-copy p { color: var(--text-secondary); font-size: 1.04rem; margin-bottom: 1.6rem; }
.cert-badge {
  display: flex; align-items: center; gap: 1.1rem; padding: 1.2rem 1.4rem;
  background: var(--cream); border-radius: var(--radius); border-left: 4px solid var(--utm-gold);
}
.cert-badge i { font-size: 2rem; color: var(--utm-maroon); }
.cert-badge h4 { font-size: 1rem; color: var(--utm-maroon); margin-bottom: .15rem; }
.cert-badge p { margin: 0; font-size: .86rem; }

.course-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin-bottom: 3rem; }
.course-card {
  display: flex; flex-direction: column; background: var(--white);
  border: 1px solid var(--border-soft); border-radius: var(--radius); overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.course-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: var(--utm-gold); }
.course-thumb { width: 100%; height: 180px; object-fit: cover; background: var(--cream); border-bottom: 1px solid var(--border-soft); }
.course-thumb--doc { object-fit: contain; padding: .6rem; }
.course-thumb--top { object-position: center top; }
.course-body { display: flex; flex-direction: column; flex: 1; padding: 1.5rem 1.4rem 1.6rem; }
.course-level {
  align-self: flex-start; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--utm-maroon); background: rgba(248,190,23,.22); padding: .3rem .75rem; border-radius: 999px; margin-bottom: .9rem;
}
.course-card h3 { font-size: 1.06rem; color: var(--text-dark); line-height: 1.35; margin-bottom: .55rem; }
.course-card p { font-size: .9rem; color: var(--text-secondary); flex: 1; margin-bottom: 1.1rem; }
.course-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.1rem; font-size: .78rem; color: var(--text-secondary); margin-bottom: 1.2rem; }
.course-meta i { color: var(--utm-maroon); margin-right: .3rem; }

.pathway { background: var(--cream); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); padding: clamp(28px, 4vw, 44px); }
.pathway h3 { font-family: var(--serif); color: var(--utm-maroon); font-size: 1.45rem; text-align: center; margin-bottom: 2rem; }
.pathway-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; counter-reset: step; position: relative; }
.pathway-step { text-align: center; position: relative; }
.pathway-step:not(:last-child)::after {
  content: ""; position: absolute; top: 22px; left: calc(50% + 30px); right: calc(-50% + 30px);
  border-top: 2px dashed rgba(92,0,31,.22);
}
.step-num {
  width: 46px; height: 46px; border-radius: 50%; margin: 0 auto .9rem; display: grid; place-items: center;
  background: var(--utm-maroon); color: var(--white); font-weight: 700; border: 3px solid var(--utm-gold);
}
.pathway-step h4 { color: var(--text-dark); font-size: .96rem; margin-bottom: .3rem; }
.pathway-step p { color: var(--text-secondary); font-size: .84rem; }

/* ============ BENEFITS ============ */
.benefits-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.benefit-item {
  background: var(--white); border: 1px solid var(--border-soft); border-radius: var(--radius);
  padding: 1.6rem 1.3rem; transition: border-color .3s, transform .3s var(--ease);
}
.benefit-item:hover { border-color: var(--utm-gold); transform: translateY(-4px); }
.benefit-item i { font-size: 1.5rem; color: var(--utm-maroon); margin-bottom: .9rem; }
.benefit-item h4 { font-size: .98rem; margin-bottom: .35rem; }
.benefit-item p { font-size: .88rem; color: var(--text-secondary); }

/* ============ DIRECTOR ============ */
.director-card {
  display: grid; grid-template-columns: 220px 1fr; gap: clamp(28px, 4vw, 52px); align-items: center;
  background: var(--cream); border: 1px solid var(--border-soft); border-radius: var(--radius-lg);
  padding: clamp(28px, 4vw, 48px);
}
.director-photo {
  width: 200px; height: 240px; object-fit: cover; object-position: center 15%; margin: 0 auto;
  border-radius: var(--radius-lg); border: 4px solid var(--white); box-shadow: var(--shadow-lg);
}
.director-text p { color: var(--text-secondary); font-size: 1.02rem; margin-bottom: 1.2rem; max-width: 40rem; }
.director-quote {
  font-family: var(--serif); font-style: italic; font-size: clamp(1.2rem, 2vw, 1.45rem); line-height: 1.5;
  color: var(--utm-maroon); padding-left: 1.2rem; border-left: 3px solid var(--utm-gold); margin-bottom: 1.4rem;
}
.director-name { font-weight: 700; color: var(--text-dark); }
.director-title { font-size: .88rem; color: var(--text-secondary); margin-bottom: 1rem; }

/* ============ NEWS ============ */
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.news-card {
  display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--border-soft);
  border-radius: var(--radius); overflow: hidden; transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.news-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.news-card-img { width: 100%; height: 200px; object-fit: cover; background: var(--cream); }
.news-card-body { display: flex; flex-direction: column; flex: 1; padding: 1.4rem 1.4rem 1.5rem; }
.news-date { font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--utm-maroon); margin-bottom: .55rem; font-variant-numeric: tabular-nums; }
.news-card h3 { font-size: 1.05rem; line-height: 1.4; margin-bottom: .5rem; }
.news-card p { font-size: .9rem; color: var(--text-secondary); flex: 1; margin-bottom: 1rem; }

/* ============ CTA ============ */
.cta-section {
  position: relative; overflow: hidden; color: var(--white); text-align: center;
  background: radial-gradient(800px 400px at 15% 120%, rgba(248,190,23,.18), transparent 60%),
              linear-gradient(135deg, var(--utm-maroon), var(--utm-dark-maroon));
  padding-block: clamp(64px, 8vw, 96px);
}
.cta-section h2 { font-family: var(--serif); font-size: clamp(1.8rem, 3.2vw, 2.4rem); margin-bottom: .9rem; }
.cta-section p { color: rgba(255,255,255,.82); max-width: 36rem; margin: 0 auto 2rem; }
.cta-buttons { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

/* ============ FOOTER ============ */
.footer { background: #1f0a12; color: rgba(255,255,255,.72); padding-block: 56px 28px; font-size: .9rem; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 2.5rem; margin-bottom: 2.5rem; }
.footer-brand img { height: 44px; width: auto; margin-bottom: 1rem; }
.footer-brand p { max-width: 22rem; line-height: 1.7; }
.footer-col h4 { color: var(--white); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 1rem; }
.footer-col li { margin-bottom: .6rem; line-height: 1.55; }
.footer-col a:hover { color: var(--utm-gold); }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.1); padding-top: 1.4rem;
  display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: .82rem;
}
.footer-social a {
  width: 36px; height: 36px; border-radius: 50%; display: inline-grid; place-items: center;
  background: rgba(255,255,255,.08); transition: background .2s, color .2s;
}
.footer-social a:hover { background: var(--utm-gold); color: var(--utm-dark-maroon); }

/* ============ REVEAL (only when JS runs) ============ */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.js .reveal.in { opacity: 1; transform: none; }

.img-fallback { background: linear-gradient(135deg, var(--utm-dark-maroon), var(--utm-maroon)); }

/* ============ RESPONSIVE ============ */
@media (max-width: 1080px) {
  .header-nav { gap: 1.15rem; }
  .main-header .container { gap: .8rem; }
}
@media (max-width: 980px) {
  .header-nav {
    position: absolute; left: 0; right: 0; top: var(--header-h); background: var(--white);
    border-bottom: 1px solid var(--border-soft); display: none; flex-direction: column;
    align-items: flex-start; gap: .95rem; padding: 1rem var(--pad) 1.4rem; box-shadow: var(--shadow-lg);
  }
  .header-nav.open { display: flex; }
  .hamburger { display: flex; }
  .hero .container, .about-grid, .training-intro { grid-template-columns: 1fr; }
  .facts-wrap { position: static; }
  .hero { min-height: 0; padding-block: 44px 280px; align-items: flex-start; }
  .hero::before { inset: auto 0 0 0; height: 340px; background-position: center 35%; }
  .hero::after { background: linear-gradient(180deg, #FCF9F4 calc(100% - 340px), rgba(252,249,244,.6) calc(100% - 260px), rgba(252,249,244,0) calc(100% - 170px)); }
  .hero-caption { right: 50%; transform: translateX(50%); white-space: nowrap; }
  .research-grid, .course-grid, .news-grid { grid-template-columns: repeat(2, 1fr); }
  .benefits-grid { grid-template-columns: repeat(2, 1fr); }
  .pathway-steps { grid-template-columns: repeat(2, 1fr); row-gap: 2rem; }
  .pathway-step::after { display: none; }
  .director-card { grid-template-columns: 1fr; text-align: left; }
  .director-photo { margin: 0; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  :root { --header-h: 68px; --pad: 18px; }
  .utility-bar { display: none; }
  .header-brand__logo img { height: 42px; }
  .header-brand__divider { height: 30px; }
  .header-brand__centre { font-size: .9rem; }
  .research-grid, .course-grid, .news-grid, .benefits-grid, .pathway-steps { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 1.8rem; }
  .footer-bottom { flex-direction: column; text-align: center; }
}
@media (max-width: 420px) {
  .header-brand { gap: .6rem; }
  .header-brand__logo img { height: 34px; }
  .header-brand__divider { height: 26px; }
  .header-brand__centre { font-size: .82rem; }
  .header-brand__university { display: none; }
  .facts { grid-template-columns: 1fr; }
  .fact:nth-child(odd) { border-right: 0; }
  .fact:nth-last-child(2) { border-bottom: 1px solid var(--border-soft); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .js .reveal { opacity: 1; transform: none; }
}


/* ============ USER-JOURNEY HUB (NN/g-inspired) ============ */
.journey-hub { background: var(--white); }
.journey-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.15rem; }
.journey-card { display:flex; flex-direction:column; min-height:260px; padding:1.55rem; border:1px solid var(--border-soft); border-radius:var(--radius-lg); background:var(--white); transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s; }
.journey-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:rgba(92,0,31,.25); }
.journey-card__icon { width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--cream);color:var(--utm-maroon);font-size:1.15rem;margin-bottom:1rem; }
.journey-card__actor { font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:.4rem; }
.journey-card h3 { color:var(--utm-maroon);font-size:1.08rem;line-height:1.35;margin-bottom:.55rem; }
.journey-card p { color:var(--text-secondary);font-size:.88rem;flex:1;margin-bottom:1rem; }
.journey-card .text-link { margin-top:auto; }
.journey-note { margin-top:1.25rem; padding:1rem 1.2rem; border-left:3px solid var(--utm-gold); background:var(--cream-light); color:var(--text-secondary); font-size:.86rem; }

/* ============ INDUSTRY / SERVICES ============ */
.service-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem; }
.service-card { padding:1.65rem;background:var(--white);border:1px solid var(--border-soft);border-radius:var(--radius); }
.service-card i { color:var(--utm-maroon);font-size:1.35rem;margin-bottom:.9rem; }
.service-card h3 { font-size:1.02rem;margin-bottom:.45rem; }
.service-card p { color:var(--text-secondary);font-size:.89rem;margin-bottom:1rem; }
.service-cta { margin-top:2rem;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.4rem 1.5rem;border-radius:var(--radius);background:var(--cream);border:1px solid var(--border-soft); }
.service-cta p { color:var(--text-secondary);font-size:.9rem; }

/* ============ EXPERTISE ============ */
.expertise-strip { display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center; }
.expertise-tags { display:flex;flex-wrap:wrap;gap:.65rem; }
.expertise-tags span { padding:.55rem .85rem;border:1px solid var(--border-soft);border-radius:999px;background:var(--white);font-size:.82rem;color:var(--utm-maroon);font-weight:600; }
.expertise-actions { display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.3rem; }

/* ============ BDC AI / RAG FRONT-PAGE ASSISTANT ============ */
.rag-launcher { position:fixed;right:22px;bottom:22px;z-index:300;width:58px;height:58px;border:0;border-radius:50%;background:var(--utm-maroon);color:#fff;box-shadow:0 12px 32px rgba(58,15,30,.28);cursor:pointer;font-size:1.25rem; }
.rag-launcher:hover { transform:translateY(-2px); }
.rag-panel { position:fixed;right:22px;bottom:92px;z-index:299;width:min(390px,calc(100vw - 28px));height:min(570px,calc(100vh - 130px));display:none;flex-direction:column;background:#fff;border:1px solid var(--border-soft);border-radius:18px;box-shadow:0 24px 70px rgba(32,26,24,.22);overflow:hidden; }
.rag-panel.open { display:flex; }
.rag-head { background:var(--utm-maroon);color:#fff;padding:1rem 1.1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem; }
.rag-head strong { display:block;font-size:.96rem; }
.rag-head span { display:block;font-size:.7rem;color:rgba(255,255,255,.72);margin-top:.1rem; }
.rag-close { border:0;background:transparent;color:#fff;font-size:1.1rem;cursor:pointer;padding:.3rem; }
.rag-messages { flex:1;overflow:auto;padding:1rem;background:var(--cream-light); }
.rag-msg { max-width:88%;padding:.72rem .85rem;border-radius:12px;margin-bottom:.7rem;font-size:.84rem;line-height:1.5; }
.rag-msg.bot { background:#fff;border:1px solid var(--border-soft); }
.rag-msg.user { margin-left:auto;background:var(--utm-maroon);color:#fff; }
.rag-suggestions { display:flex;gap:.45rem;overflow-x:auto;padding:.7rem .8rem;border-top:1px solid var(--border-soft);background:#fff; }
.rag-suggestions button { white-space:nowrap;border:1px solid var(--border-soft);background:var(--cream-light);color:var(--utm-maroon);border-radius:999px;padding:.45rem .7rem;font-size:.72rem;cursor:pointer; }
.rag-form { display:flex;gap:.5rem;padding:.75rem;border-top:1px solid var(--border-soft);background:#fff; }
.rag-form input { flex:1;border:1px solid var(--border-soft);border-radius:999px;padding:.7rem .9rem;font:inherit;font-size:.82rem;outline:none; }
.rag-form input:focus { border-color:var(--utm-maroon); }
.rag-form button { width:40px;height:40px;border:0;border-radius:50%;background:var(--utm-maroon);color:#fff;cursor:pointer; }
.rag-disclaimer { padding:.55rem .85rem;background:#fff;color:var(--text-secondary);font-size:.65rem;border-top:1px solid var(--border-soft); }
@media(max-width:980px){.journey-grid{grid-template-columns:repeat(2,1fr)}.service-grid{grid-template-columns:1fr 1fr}.expertise-strip{grid-template-columns:1fr}}
@media(max-width:700px){.journey-grid,.service-grid{grid-template-columns:1fr}.service-cta{align-items:flex-start;flex-direction:column}.rag-launcher{right:14px;bottom:14px}.rag-panel{right:14px;bottom:82px}}


/* v11 journey-map refinements */
.journey-card { position:relative; }
.journey-card::after { content:""; position:absolute; left:1.55rem; right:1.55rem; bottom:0; height:3px; background:linear-gradient(90deg,var(--utm-gold),var(--utm-maroon)); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.journey-card:hover::after { transform:scaleX(1); }
#impact .news-card { min-height:100%; }
#impact .news-date { color:var(--utm-maroon); }
@media (min-width:981px){ #impact .news-card-img{height:190px;} }

/* v12: institutional co-branding within the homepage hero banner */
.hero-cobrand{display:inline-flex;align-items:center;gap:18px;margin:0 0 24px;padding:10px 12px 10px 16px;border:1px solid var(--border-soft);border-radius:14px;background:rgba(255,255,255,.97);box-shadow:0 8px 28px rgba(32,26,24,.08);max-width:100%}
.hero-cobrand__utm{display:flex;align-items:center;justify-content:center;min-width:0}
.hero-cobrand__utm img{width:auto;height:44px;max-width:180px;object-fit:contain}
.hero-cobrand__separator{width:1px;height:42px;flex:none;background:#d9cec5}
.hero-cobrand__bdc{display:flex;align-items:center;justify-content:center;min-width:0;padding:8px 12px;background:#fff;border:1px solid var(--border-soft);border-radius:9px;min-height:56px}
.hero-cobrand__bdc img{width:auto;height:49px;max-width:180px;object-fit:contain}
.hero-cobrand__bdc.logo-unavailable::after{content:'BIG DATA CENTRE';color:var(--utm-maroon);font-size:12px;font-weight:700;letter-spacing:.05em}
@media(max-width:700px){.hero-cobrand{gap:10px;padding:8px;margin-bottom:20px}.hero-cobrand__utm img{height:32px;max-width:128px}.hero-cobrand__separator{height:32px}.hero-cobrand__bdc{padding:6px 8px;min-height:42px}.hero-cobrand__bdc img{height:38px;max-width:135px}}

/* v12.2 — exact UTM + BDC co-brand treatment */
.header-brand,
.brand-lockup,
.cobrand-lockup {
  display:flex;
  align-items:center;
}
.header-brand img,
.brand-lockup img,
.cobrand-lockup img {
  object-fit:contain;
}
.bdc-cobrand-logo,
img[alt*="Big Data Centre"],
img[alt*="BDC"] {
  width:auto;
  max-width:285px;
  max-height:82px;
  object-fit:contain;
}
@media (max-width: 980px) {
  .bdc-cobrand-logo,
  img[alt*="Big Data Centre"],
  img[alt*="BDC"] {
    max-width:205px;
    max-height:62px;
  }
}
@media (max-width: 640px) {
  .bdc-cobrand-logo,
  img[alt*="Big Data Centre"],
  img[alt*="BDC"] {
    max-width:155px;
    max-height:50px;
  }
}


/* v12.3 — corrected institutional co-brand placement
   UTM | actual BDC logo belongs in the white header, not inside the hero. */
.header-brand{
  display:flex;
  align-items:center;
  gap:18px;
  flex:0 0 auto;
  min-width:0;
}
.header-brand__logo{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}
.header-brand__logo--utm img{
  display:block;
  width:auto !important;
  height:58px !important;
  max-width:235px !important;
  object-fit:contain;
}
.header-brand__divider{
  width:1px;
  height:54px;
  background:#ddd2ca;
  flex:0 0 1px;
}
.header-brand__logo--bdc img{
  display:block;
  width:230px !important;
  height:64px !important;
  max-width:230px !important;
  object-fit:contain;
  object-position:left center;
}
.main-header .container{
  height:104px;
  gap:24px;
}
.header-nav{
  gap:1.15rem;
  margin-left:auto;
}
.header-nav a{
  font-size:.76rem;
}
.hero-cobrand{display:none !important;}

@media (max-width:1180px){
  .header-brand__logo--utm img{height:48px !important;max-width:195px !important;}
  .header-brand__divider{height:46px;}
  .header-brand__logo--bdc img{width:185px !important;height:54px !important;max-width:185px !important;}
  .header-nav{gap:.85rem;}
  .header-nav a{font-size:.72rem;}
}
@media (max-width:980px){
  .main-header .container{height:86px;}
  .header-brand{gap:12px;}
  .header-brand__logo--utm img{height:42px !important;max-width:170px !important;}
  .header-brand__divider{height:38px;}
  .header-brand__logo--bdc img{width:155px !important;height:46px !important;max-width:155px !important;}
}
@media (max-width:560px){
  .header-brand{gap:9px;}
  .header-brand__logo--utm img{height:34px !important;max-width:135px !important;}
  .header-brand__divider{height:31px;}
  .header-brand__logo--bdc img{width:112px !important;height:38px !important;max-width:112px !important;}
}


/* v12.6 — clean photographic hero correction.
   Important: hero uses the gate PHOTO only; no header/navigation artwork is embedded. */
.hero::before{
  background-size:cover !important;
  background-position:74% 52% !important;
  filter:saturate(.92) contrast(1.02) brightness(1.02);
}
.hero::after{
  background:
    linear-gradient(90deg,
      #FCF9F4 0%,
      rgba(252,249,244,.995) 31%,
      rgba(252,249,244,.96) 43%,
      rgba(252,249,244,.80) 54%,
      rgba(252,249,244,.42) 65%,
      rgba(252,249,244,.12) 77%,
      rgba(252,249,244,0) 91%),
    linear-gradient(180deg,rgba(255,255,255,.02),rgba(58,15,30,.04)) !important;
}
.hero-content{
  position:relative;
  z-index:2;
  max-width:600px;
}
@media(max-width:980px){
  .hero::before{
    background-position:center 50% !important;
  }
}


/* v12.6.1 — direct harmony refinement of v12.6 hero */
.hero{
  min-height: 590px !important;
  padding: 66px 0 54px !important;
  display:flex;
  align-items:center;
}
.hero::before{
  background-size:cover !important;
  background-position:76% 51% !important;
}
.hero::after{
  background:
    linear-gradient(90deg,
      #FCF9F4 0%,
      rgba(252,249,244,.995) 25%,
      rgba(252,249,244,.97) 35%,
      rgba(252,249,244,.88) 43%,
      rgba(252,249,244,.66) 51%,
      rgba(252,249,244,.34) 59%,
      rgba(252,249,244,.10) 68%,
      rgba(252,249,244,0) 78%) !important;
}
.hero-content{
  max-width:550px !important;
}
.hero-eyebrow{
  margin-bottom:22px !important;
  font-size:.74rem !important;
  letter-spacing:.115em !important;
}
.hero h1{
  font-size:clamp(3rem,4.15vw,4.45rem) !important;
  line-height:.98 !important;
  letter-spacing:-.038em !important;
  margin-bottom:20px !important;
}
.hero-lead{
  max-width:535px !important;
  font-size:1.04rem !important;
  line-height:1.62 !important;
  margin-bottom:22px !important;
}
.hero-proof{
  max-width:505px !important;
  padding:14px 17px !important;
  margin:0 0 24px !important;
  border-radius:13px !important;
  gap:12px !important;
  box-shadow:0 7px 20px rgba(58,15,30,.055) !important;
}
.hero-proof i{
  font-size:1.08rem !important;
}
.hero-proof strong{
  font-size:.91rem !important;
  line-height:1.25 !important;
}
.hero-proof span{
  font-size:.79rem !important;
  line-height:1.38 !important;
}
.hero-buttons{
  gap:12px !important;
}
.hero-buttons .btn{
  min-height:48px !important;
  padding:.78rem 1.28rem !important;
  font-size:.88rem !important;
}
.hero-caption{
  font-size:.68rem !important;
  bottom:14px !important;
  right:18px !important;
  opacity:.72;
}
@media (max-width:1100px){
  .hero{min-height:560px !important;padding:58px 0 48px !important;}
  .hero-content{max-width:520px !important;}
  .hero h1{font-size:clamp(2.85rem,4.6vw,4rem) !important;}
}
@media (max-width:980px){
  .hero{
    min-height:auto !important;
    padding:54px 0 320px !important;
    align-items:flex-start;
  }
  .hero-content{max-width:620px !important;}
  .hero::before{
    background-size:auto 330px !important;
    background-repeat:no-repeat !important;
    background-position:center bottom !important;
  }
  .hero::after{
    background:linear-gradient(180deg,
      #FCF9F4 0%,
      #FCF9F4 55%,
      rgba(252,249,244,.94) 63%,
      rgba(252,249,244,.48) 76%,
      rgba(252,249,244,0) 90%) !important;
  }
}
@media (max-width:640px){
  .hero{padding:42px 0 250px !important;}
  .hero h1{font-size:clamp(2.55rem,12vw,3.25rem) !important;}
  .hero-lead{font-size:.98rem !important;}
  .hero-proof{max-width:100% !important;}
  .hero-buttons .btn{width:100%;}
  .hero::before{background-size:auto 255px !important;}
}


/* v12.6.2 — compact desktop hero */
.hero{
  min-height: 455px !important;
  padding: 42px 0 38px !important;
}
.hero-content{
  max-width: 485px !important;
}
.hero-eyebrow{
  margin-bottom: 15px !important;
  font-size: .67rem !important;
}
.hero h1{
  font-size: clamp(2.45rem,3.25vw,3.45rem) !important;
  line-height: .98 !important;
  margin-bottom: 14px !important;
}
.hero-lead{
  max-width: 475px !important;
  font-size: .92rem !important;
  line-height: 1.52 !important;
  margin-bottom: 15px !important;
}
.hero-proof{
  max-width: 445px !important;
  padding: 10px 13px !important;
  margin-bottom: 16px !important;
  border-radius: 11px !important;
  gap: 10px !important;
}
.hero-proof strong{
  font-size: .82rem !important;
}
.hero-proof span{
  font-size: .72rem !important;
}
.hero-buttons .btn{
  min-height: 42px !important;
  padding: .62rem 1.05rem !important;
  font-size: .80rem !important;
}
.hero::before{
  background-position: 79% 52% !important;
}
.hero::after{
  background:
    linear-gradient(90deg,
      #FCF9F4 0%,
      rgba(252,249,244,.995) 22%,
      rgba(252,249,244,.96) 31%,
      rgba(252,249,244,.82) 40%,
      rgba(252,249,244,.53) 49%,
      rgba(252,249,244,.23) 57%,
      rgba(252,249,244,.06) 65%,
      rgba(252,249,244,0) 72%) !important;
}
@media (max-width:1100px){
  .hero{min-height:440px !important;padding:38px 0 34px !important;}
  .hero-content{max-width:465px !important;}
  .hero h1{font-size:clamp(2.35rem,3.7vw,3.2rem) !important;}
}
@media (max-width:980px){
  .hero{padding:44px 0 285px !important;}
  .hero-content{max-width:570px !important;}
  .hero h1{font-size:clamp(2.45rem,7vw,3.25rem) !important;}
  .hero::before{background-size:auto 295px !important;}
}
@media (max-width:640px){
  .hero{padding:36px 0 220px !important;}
  .hero h1{font-size:clamp(2.15rem,10.5vw,2.8rem) !important;}
  .hero::before{background-size:auto 225px !important;}
}


/* v12.6.3 — fold-optimised desktop hero
   Goal: header + compact hero + visible start of "Start with what you need" at 900px viewport. */
@media (min-width:981px){
  .topbar{height:34px !important;}
  .topbar .container{height:34px !important;}
  .main-header .container{height:78px !important;}

  .header-brand{gap:13px !important;}
  .header-brand__logo--utm img{
    height:44px !important;
    max-width:178px !important;
  }
  .header-brand__divider{height:39px !important;}
  .header-brand__logo--bdc img{
    width:170px !important;
    height:48px !important;
    max-width:170px !important;
  }

  .hero{
    min-height:0 !important;
    height:420px !important;
    padding:34px 0 30px !important;
    align-items:center !important;
  }
  .hero .container{
    min-height:0 !important;
  }
  .hero-content{
    max-width:470px !important;
  }
  .hero-eyebrow{
    margin-bottom:13px !important;
    font-size:.64rem !important;
    line-height:1.25 !important;
  }
  .hero h1{
    font-size:clamp(2.35rem,3vw,3.15rem) !important;
    line-height:.97 !important;
    margin-bottom:12px !important;
    letter-spacing:-.04em !important;
  }
  .hero-lead{
    max-width:455px !important;
    font-size:.86rem !important;
    line-height:1.48 !important;
    margin-bottom:13px !important;
  }
  .hero-proof{
    max-width:420px !important;
    padding:8px 11px !important;
    margin-bottom:13px !important;
    border-radius:9px !important;
    gap:9px !important;
  }
  .hero-proof i{font-size:.95rem !important;}
  .hero-proof strong{
    font-size:.76rem !important;
    line-height:1.18 !important;
  }
  .hero-proof span{
    font-size:.66rem !important;
    line-height:1.28 !important;
  }
  .hero-buttons{gap:10px !important;}
  .hero-buttons .btn{
    min-height:39px !important;
    padding:.54rem .92rem !important;
    font-size:.75rem !important;
  }
  .hero::before{
    background-position:80% 51% !important;
  }
  .hero::after{
    background:
      linear-gradient(90deg,
        #FCF9F4 0%,
        rgba(252,249,244,.995) 21%,
        rgba(252,249,244,.96) 29%,
        rgba(252,249,244,.80) 38%,
        rgba(252,249,244,.49) 47%,
        rgba(252,249,244,.19) 55%,
        rgba(252,249,244,.04) 63%,
        rgba(252,249,244,0) 70%) !important;
  }
  .hero-caption{
    font-size:.62rem !important;
    bottom:10px !important;
  }

  /* Let the next NN/g journey section visibly enter the first screen. */
  #journeys{
    padding-top:30px !important;
    padding-bottom:54px !important;
  }
  #journeys .section-header{
    margin-bottom:22px !important;
  }
  #journeys .section-label{
    margin-bottom:6px !important;
  }
  #journeys .section-title{
    margin-bottom:7px !important;
  }
  #journeys .section-subtitle{
    max-width:720px !important;
  }
}
@media (min-width:981px) and (max-height:820px){
  .hero{height:380px !important;padding:27px 0 24px !important;}
  .hero h1{font-size:clamp(2.2rem,2.8vw,2.9rem) !important;}
  .hero-lead{font-size:.82rem !important;}
  #journeys{padding-top:24px !important;}
}


/* v12.6.4 — smaller gate image + guaranteed CTA clearance */
@media (min-width:981px){
  .hero{
    height:430px !important;
    min-height:430px !important;
    padding:28px 0 26px !important;
    overflow:hidden !important;
  }

  /* Keep all hero content, including CTAs, inside the hero bounds */
  .hero-content{
    max-width:455px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
  }
  .hero-eyebrow{margin-bottom:10px !important;}
  .hero h1{
    font-size:clamp(2.15rem,2.7vw,2.85rem) !important;
    margin-bottom:10px !important;
  }
  .hero-lead{
    font-size:.82rem !important;
    line-height:1.42 !important;
    margin-bottom:10px !important;
  }
  .hero-proof{
    max-width:405px !important;
    padding:7px 10px !important;
    margin-bottom:10px !important;
  }
  .hero-proof strong{font-size:.73rem !important;}
  .hero-proof span{font-size:.63rem !important;}
  .hero-buttons{
    position:relative !important;
    z-index:4 !important;
    margin:0 !important;
    padding:0 !important;
  }
  .hero-buttons .btn{
    min-height:36px !important;
    padding:.48rem .82rem !important;
    font-size:.72rem !important;
  }

  /* Show the gate as a smaller contained visual on the right,
     rather than an oversized full-bleed crop. */
  .hero::before{
    left:auto !important;
    right:0 !important;
    width:59% !important;
    height:100% !important;
    background-size:cover !important;
    background-position:center 52% !important;
    background-repeat:no-repeat !important;
  }
  .hero::after{
    background:
      linear-gradient(90deg,
        #FCF9F4 0%,
        #FCF9F4 31%,
        rgba(252,249,244,.98) 38%,
        rgba(252,249,244,.88) 45%,
        rgba(252,249,244,.55) 52%,
        rgba(252,249,244,.18) 59%,
        rgba(252,249,244,0) 66%) !important;
  }

  /* Ensure trust strip starts after hero, never over its buttons */
  .trust-strip{
    position:relative !important;
    z-index:5 !important;
    margin-top:0 !important;
  }
}

@media (min-width:981px) and (max-height:820px){
  .hero{
    height:405px !important;
    min-height:405px !important;
    padding:23px 0 22px !important;
  }
  .hero h1{font-size:clamp(2.05rem,2.55vw,2.65rem) !important;}
  .hero-lead{font-size:.78rem !important;}
  .hero-proof{margin-bottom:8px !important;}
}


/* v12.6.6 — text co-brand + smoother hero/photo transition */
.header-brand__text--bdc{display:flex;flex-direction:column;justify-content:center;line-height:1.12;white-space:nowrap}
.header-brand__text--bdc .header-brand__centre{font-size:1.08rem;font-weight:700;color:var(--utm-maroon);letter-spacing:-.015em}
.header-brand__text--bdc .header-brand__university{font-size:.56rem;letter-spacing:.085em;margin-top:.22rem}
@media (min-width:981px){
  .hero::before{
    left:auto !important;right:0 !important;width:62% !important;height:100% !important;
    background-size:cover !important;background-position:center 52% !important;background-repeat:no-repeat !important;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 7%,rgba(0,0,0,.38) 18%,rgba(0,0,0,.78) 31%,#000 45%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 7%,rgba(0,0,0,.38) 18%,rgba(0,0,0,.78) 31%,#000 45%);
    filter:saturate(.90) contrast(.99) brightness(1.035) !important;
  }
  .hero::after{
    background:linear-gradient(90deg,#FCF9F4 0%,#FCF9F4 32%,rgba(252,249,244,.99) 39%,rgba(252,249,244,.90) 47%,rgba(252,249,244,.62) 55%,rgba(252,249,244,.28) 63%,rgba(252,249,244,.07) 72%,rgba(252,249,244,0) 82%) !important;
  }
}
@media (max-width:980px){
  .header-brand__text--bdc .header-brand__centre{font-size:.92rem}
  .hero::before{-webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.2) 12%,#000 30%);mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.2) 12%,#000 30%)}
}
@media (max-width:560px){.header-brand__text--bdc .header-brand__centre{font-size:.8rem}.header-brand__text--bdc .header-brand__university{display:none}}

/* v12.6.6 — restrained hero typographic emphasis */
.hero h1 em{
  display:inline-block;
  padding-inline:.04em;
  font-style:italic;
  font-weight:inherit;
  text-decoration:none;
  position:relative;
}
.hero h1 em::after{
  content:"";
  position:absolute;
  left:.03em;
  right:.03em;
  bottom:-.055em;
  height:3px;
  background:var(--utm-gold);
  border-radius:2px;
}


/* Baseline v2 — journey-led mega navigation */
.nav-mega{position:relative;display:flex;align-items:center;height:100%}
.nav-mega__trigger{
  border:0;background:transparent;color:var(--text-secondary);font:inherit;
  font-size:.76rem;font-weight:500;white-space:nowrap;cursor:pointer;
  display:flex;align-items:center;gap:.35rem;padding:.7rem 0;
}
.nav-mega__trigger i{font-size:.58rem;transition:transform .2s var(--ease)}
.nav-mega:hover .nav-mega__trigger,.nav-mega:focus-within .nav-mega__trigger{color:var(--utm-maroon)}
.nav-mega:hover .nav-mega__trigger i,.nav-mega:focus-within .nav-mega__trigger i,
.nav-mega.open .nav-mega__trigger i{transform:rotate(180deg)}
.mega-menu{
  position:fixed;left:50%;top:112px;transform:translate(-50%,10px);
  width:min(1120px,calc(100vw - 48px));display:grid;
  grid-template-columns:1.05fr 1.65fr .8fr;gap:0;
  background:#fff;border:1px solid var(--border-soft);border-radius:0 0 16px 16px;
  box-shadow:0 24px 60px rgba(32,26,24,.16);opacity:0;visibility:hidden;
  pointer-events:none;transition:opacity .18s ease,transform .22s var(--ease);
  overflow:hidden;z-index:120;
}
.nav-mega:focus-within .mega-menu,.nav-mega.open .mega-menu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)
}
.mega-menu__intro{padding:28px 30px;background:var(--cream-light);border-right:1px solid var(--border-soft)}
.mega-menu__eyebrow{display:block;color:var(--utm-maroon);font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.65rem}
.mega-menu__intro h3{font-family:var(--serif);color:var(--utm-maroon);font-size:1.35rem;line-height:1.2;margin-bottom:.65rem}
.mega-menu__intro p{font-size:.79rem;line-height:1.55;color:var(--text-secondary);margin-bottom:1rem}
.mega-menu__featured{display:inline-flex!important;align-items:center;gap:.45rem;color:var(--utm-maroon)!important;font-weight:700!important;font-size:.76rem!important}
.mega-menu__featured::after{display:none!important}
.mega-menu__links{display:grid;grid-template-columns:1fr 1fr;padding:14px}
.header-nav .mega-menu__links a{
  padding:15px 16px!important;border-radius:10px;white-space:normal!important;
  display:block;transition:background .18s ease!important
}
.header-nav .mega-menu__links a:hover{background:var(--cream-light)}
.header-nav .mega-menu__links a::after{display:none}
.mega-menu__links strong{display:block;color:var(--text-dark);font-size:.82rem;margin-bottom:.25rem}
.mega-menu__links span{display:block;color:var(--text-secondary);font-size:.7rem;line-height:1.42}
.mega-menu__aside{padding:25px 22px;background:#fff;border-left:1px solid var(--border-soft)}
.mega-menu__aside>span{display:block;font-size:.63rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:.75rem}
.header-nav .mega-menu__aside a{
  display:flex;align-items:center;gap:.55rem;padding:.55rem 0!important;
  white-space:normal!important;color:var(--utm-maroon);font-size:.73rem!important;font-weight:600
}
.header-nav .mega-menu__aside a::after{display:none}
.mega-menu__aside i{width:16px;color:var(--utm-gold)}

@media(max-width:980px){
  .nav-mega{display:block;width:100%;height:auto}
  .nav-mega__trigger{width:100%;justify-content:space-between;padding:.25rem 0;font-size:.82rem}
  .mega-menu{
    position:static;width:100%;transform:none!important;display:none;opacity:1;visibility:visible;
    pointer-events:auto;grid-template-columns:1fr;border:0;border-radius:0;box-shadow:none;
    margin:.4rem 0 .6rem;background:var(--cream-light)
  }
  .nav-mega.open .mega-menu,.nav-mega:focus-within .mega-menu{display:grid}
  .mega-menu__intro{padding:16px;border-right:0;border-bottom:1px solid var(--border-soft)}
  .mega-menu__intro h3{font-size:1.08rem}
  .mega-menu__links{grid-template-columns:1fr;padding:7px}
  .mega-menu__aside{padding:14px 16px;border-left:0;border-top:1px solid var(--border-soft)}
}


/* v2.1 — stable mega-menu interaction + content-reveal repair */
@media (min-width:981px){
  .nav-mega::after{
    content:"";
    position:absolute;
    left:-12px; right:-12px;
    top:100%;
    height:18px;
    background:transparent;
    pointer-events:none;
  }
  .nav-mega.open::after,
  .nav-mega:focus-within::after{pointer-events:auto;}
  .mega-menu{top:112px;}
}


/* v2.3 — compact journey hub: faster scanning, same four user objectives */
#journeys{
  padding-top:28px !important;
  padding-bottom:44px !important;
}
#journeys .section-header{
  margin-bottom:26px !important;
}
#journeys .section-label{
  margin-bottom:7px !important;
}
#journeys .section-title{
  margin-bottom:7px !important;
}
#journeys .section-subtitle{
  max-width:680px !important;
  font-size:.96rem !important;
  line-height:1.5 !important;
}
#journeys .journey-grid{
  gap:1rem !important;
  align-items:stretch;
}
#journeys .journey-card{
  min-height:0 !important;
  height:auto !important;
  padding:1.25rem 1.2rem 1.15rem !important;
  border-radius:15px !important;
}
#journeys .journey-card__icon{
  width:44px !important;
  height:44px !important;
  margin-bottom:.82rem !important;
  font-size:1.05rem !important;
}
#journeys .journey-card__actor{
  margin-bottom:.42rem !important;
  font-size:.62rem !important;
  line-height:1.35 !important;
  letter-spacing:.105em !important;
  min-height:1.35em;
}
#journeys .journey-card h3{
  font-size:1rem !important;
  line-height:1.3 !important;
  margin-bottom:.5rem !important;
}
#journeys .journey-card p{
  font-size:.82rem !important;
  line-height:1.52 !important;
  margin-bottom:.85rem !important;
}
#journeys .journey-card .text-link{
  font-size:.79rem !important;
  margin-top:auto !important;
}
#journeys .journey-card::after{
  left:1.2rem !important;
  right:1.2rem !important;
}
#journeys .journey-note{
  margin-top:1rem !important;
  padding:.8rem 1rem !important;
  font-size:.8rem !important;
}
@media(max-width:980px){
  #journeys{padding-top:34px !important;padding-bottom:48px !important;}
  #journeys .journey-card{padding:1.2rem !important;}
}


/* v2.4 — Gestalt, whitespace rhythm and interaction polish.
   Proximity: section heading and its content belong together.
   Similarity: equal card padding, aligned CTA baseline, consistent headings.
   Common region: subtle boundaries, no extra decorative boxes. */
:root{--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-5:48px;--space-6:72px;}
.section{padding-block:clamp(56px,6.2vw,84px);}
.section-header{margin-bottom:clamp(24px,3vw,40px);}
.section-title{line-height:1.16;}
.section-subtitle{line-height:1.58;}
/* A compact routing hub needs less vertical whitespace than editorial sections. */
#journeys{padding-block:clamp(34px,4vw,48px) !important;}
#journeys .section-header{margin-bottom:24px !important;}
#journeys .journey-card{padding:1.35rem 1.3rem 1.25rem !important;}
#journeys .journey-card__actor{min-height:0 !important;}
#journeys .journey-card p{max-width:34ch;}
#journeys .journey-card .text-link{padding-block:7px;align-self:flex-start;}
/* Visual focus must not rely on subtle hover color alone. */
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:3px solid #B06A00 !important;outline-offset:3px;
}
.nav-mega__trigger{min-height:44px;}
.header-nav .mega-menu__links a{min-height:70px;}
.header-nav .mega-menu__aside a{min-height:40px;}
.nav-mega__trigger[aria-expanded="true"]{color:var(--utm-maroon);}
/* Prevent menu and chatbot clipping on shorter screens. */
@media(min-width:981px){
  .mega-menu{max-height:calc(100dvh - 124px);overflow-y:auto;}
}
@media(max-width:980px){
  .header-nav{max-height:calc(100dvh - var(--header-h) - 8px);overflow-y:auto;overscroll-behavior:contain;}
  .mega-menu{max-height:none;overflow:visible;}
  .nav-mega__trigger{min-height:44px;}
}
@media(max-width:700px){
  .section{padding-block:52px;}
  #journeys{padding-block:36px 44px !important;}
  #journeys .journey-grid{gap:14px !important;}
  #journeys .journey-card{padding:1.25rem !important;}
  .hero-buttons .btn{justify-content:center;min-height:44px !important;}
}
@media(prefers-reduced-motion:reduce){
  .mega-menu{transition:none !important;}
}


/* =========================================================
   v2.5 — FINAL VERTICAL RHYTHM SYSTEM
   Purpose: consistent Gestalt proximity and section cadence.
   No typography, colour, card, hero, navigation or content changes.
   ========================================================= */

/* Default major-section rhythm */
main > section:not(.hero):not(#journeys){
  padding-top:72px;
  padding-bottom:72px;
}

/* Hero → journey remains deliberately compact */
#journeys{
  padding-top:34px !important;
  padding-bottom:48px !important;
}

/* Journey → Research: related discovery flow */
#journeys + section{
  padding-top:56px !important;
}

/* Remove accidental margin stacking at section boundaries */
main > section > .container > :first-child{
  margin-top:0;
}
main > section > .container > :last-child{
  margin-bottom:0;
}

/* Sections already separated by background/common region need less blank space */
main > section[style*="background"],
main > section.section-soft,
main > section.bg-soft{
  padding-top:68px;
  padding-bottom:68px;
}

/* Specific semantic anchors in this page:
   tighten large transitions visible in the full-page review */
#training{
  padding-top:64px !important;
}
#why-train{
  padding-top:56px !important;
  padding-bottom:58px !important;
}
#recent-work{
  padding-top:58px !important;
}
#about{
  padding-top:68px !important;
  padding-bottom:58px !important;
}
#director{
  padding-top:52px !important;
  padding-bottom:58px !important;
}
#people,
#expertise{
  padding-top:58px !important;
  padding-bottom:62px !important;
}
#news{
  padding-top:68px !important;
  padding-bottom:76px !important;
}

/* Keep final conversion panel visually distinct */
.final-cta,
#final-cta,
.cta-band{
  margin-top:0 !important;
}

/* Responsive rhythm: preserve grouping without oversized mobile gaps */
@media (max-width: 980px){
  main > section:not(.hero):not(#journeys){
    padding-top:56px;
    padding-bottom:56px;
  }
  #journeys{
    padding-top:30px !important;
    padding-bottom:40px !important;
  }
  #journeys + section,
  #training,
  #about,
  #news{
    padding-top:50px !important;
  }
  #why-train,
  #recent-work,
  #director,
  #people,
  #expertise{
    padding-top:46px !important;
    padding-bottom:50px !important;
  }
}
@media (max-width: 640px){
  main > section:not(.hero):not(#journeys){
    padding-top:44px;
    padding-bottom:44px;
  }
  #journeys{
    padding-top:26px !important;
    padding-bottom:34px !important;
  }
}


/* =========================================================
   v2.6 — ASK BDC AI DISCOVERABILITY + DIRECTOR PORTRAIT
   ========================================================= */
.nav-ai-trigger{
  display:inline-flex;align-items:center;gap:.42rem;
  border:1px solid rgba(92,0,31,.24);background:var(--cream-light);
  color:var(--utm-maroon);border-radius:999px;padding:.58rem .78rem;
  font:inherit;font-size:.72rem;font-weight:700;white-space:nowrap;cursor:pointer;
  transition:background .2s,border-color .2s,transform .2s;
}
.nav-ai-trigger:hover,.nav-ai-trigger:focus-visible{
  background:#fff;border-color:var(--utm-maroon);transform:translateY(-1px);
}
.nav-ai-trigger:focus-visible,.rag-launcher:focus-visible,.context-ai-trigger:focus-visible{
  outline:3px solid rgba(248,190,23,.75);outline-offset:3px;
}

/* Labelled persistent AI launcher: visible without becoming dominant */
.rag-launcher{
  width:auto !important;height:52px !important;min-width:52px;
  padding:0 18px !important;border-radius:999px !important;
  display:flex;align-items:center;justify-content:center;gap:.55rem;
  font-size:.9rem !important;font-weight:700;
}
.rag-launcher span{display:inline-block;}
.rag-panel{bottom:86px !important;}
.rag-head span{font-size:.72rem !important;}
.rag-disclaimer{line-height:1.45;}
.rag-disclaimer strong{color:var(--utm-maroon);}

/* Contextual AI entry points — same assistant, relevant starting context */
.context-ai-trigger{
  display:inline-flex;align-items:center;gap:.42rem;margin-top:1rem;
  padding:.52rem .78rem;border:1px solid rgba(92,0,31,.22);
  border-radius:999px;background:#fff;color:var(--utm-maroon);
  font:inherit;font-size:.76rem;font-weight:700;cursor:pointer;
  transition:border-color .2s,background .2s,transform .2s;
}
.context-ai-trigger:hover{border-color:var(--utm-maroon);background:var(--cream-light);transform:translateY(-1px);}
.context-ai-trigger i{font-size:.72rem;}

/* Director portrait: stronger leadership presence, still subordinate to the message */
.director-card{
  grid-template-columns:minmax(250px,280px) 1fr !important;
  gap:clamp(32px,4.5vw,60px) !important;
}
.director-photo{
  width:260px !important;height:310px !important;
  max-width:100%;object-fit:cover;object-position:center 15%;
}
@media(max-width:1120px){
  .header-nav{gap:.68rem !important;}
  .header-nav a,.nav-mega__trigger{font-size:.69rem !important;}
  .nav-ai-trigger{font-size:.68rem;padding:.52rem .68rem;}
}
@media(max-width:980px){
  .nav-ai-trigger{width:100%;justify-content:flex-start;border-radius:8px;padding:.72rem .8rem;}
  .director-card{grid-template-columns:220px 1fr !important;}
  .director-photo{width:220px !important;height:270px !important;margin:0 !important;}
}
@media(max-width:700px){
  .rag-launcher{width:52px !important;padding:0 !important;}
  .rag-launcher span{display:none;}
  .rag-panel{bottom:78px !important;}
  .director-card{grid-template-columns:1fr !important;}
  .director-photo{width:210px !important;height:255px !important;margin:0 auto 8px !important;}
}





/* v3.2 — Director portrait: direct official URL, isolated CSS, natural dimensions */
#director .director-card {
  display:grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 60px);
  align-items:center;
  padding:clamp(28px,3.5vw,48px);
}
#director .bdc-director-portrait-final {
  display:block;
  width:100%;
  max-width:360px;
  height:auto;
  min-height:0;
  aspect-ratio:auto;
  object-fit:contain;
  border:5px solid #fff;
  border-radius:18px;
  box-shadow:0 16px 36px rgba(54,25,31,.13);
  margin:0;
  box-sizing:border-box;
}
@media(max-width:980px){
  #director .director-card{grid-template-columns:minmax(0,270px) minmax(0,1fr);gap:28px;}
  #director .bdc-director-portrait-final{max-width:270px;}
}
@media(max-width:700px){
  #director .director-card{grid-template-columns:minmax(0,1fr);padding:24px;}
  #director .bdc-director-portrait-final{width:min(100%,320px);max-width:320px;margin-inline:auto;}
}


/* v3.3 — reset inherited portrait rules and use a controlled editorial portrait frame */
#director .director-card{
  display:grid !important;
  grid-template-columns:minmax(0,350px) minmax(0,1fr) !important;
  gap:clamp(32px,4.5vw,68px) !important;
  align-items:center !important;
  padding:clamp(28px,3.5vw,48px) !important;
  min-height:0 !important;
}
#director .bdc-director-visual{
  display:block !important;
  width:100% !important;
  max-width:350px !important;
  height:440px !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  background:#e9e5e0 !important;
  border:5px solid #fff !important;
  border-radius:18px !important;
  box-shadow:0 14px 34px rgba(54,25,31,.12) !important;
  box-sizing:border-box !important;
}
#director .bdc-director-visual > img.bdc-director-portrait-final{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  max-width:none !important;
  min-height:100% !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  margin:0 !important;
  padding:0 !important;
}
#director .director-text{min-width:0 !important;}
@media(max-width:980px){
  #director .director-card{grid-template-columns:minmax(0,280px) minmax(0,1fr) !important;gap:30px !important;}
  #director .bdc-director-visual{max-width:280px !important;height:365px !important;}
}
@media(max-width:700px){
  #director .director-card{grid-template-columns:minmax(0,1fr) !important;padding:24px !important;}
  #director .bdc-director-visual{width:min(100%,320px) !important;max-width:320px !important;height:400px !important;margin:0 auto !important;}
}


/* v3.4 — cleaner two-line desktop hero headline */
@media (min-width:1101px){
  .hero-content{
    max-width:650px !important;
  }
  .hero h1{
    font-size:clamp(2.7rem,3.05vw,3.35rem) !important;
    line-height:.98 !important;
    letter-spacing:-.025em !important;
    white-space:nowrap;
  }
  .hero-lead{
    max-width:560px !important;
  }
}
/* Allow natural wrapping again on smaller screens. */
@media (max-width:1100px){
  .hero h1{
    white-space:normal !important;
  }
}


/* v3.5 FINAL — supplied half-body portrait */
#director .director-card{
  display:grid !important;
  grid-template-columns:minmax(300px,360px) minmax(0,1fr) !important;
  gap:clamp(44px,5vw,76px) !important;
  align-items:center !important;
  padding:clamp(36px,4vw,54px) !important;
}
#director .bdc-director-visual{
  width:100% !important;
  max-width:340px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:20px !important;
  overflow:hidden !important;
  box-shadow:0 18px 44px rgba(54,25,31,.14) !important;
}
#director .bdc-director-portrait-final{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:none !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
@media(max-width:900px){
  #director .director-card{
    grid-template-columns:250px minmax(0,1fr) !important;
    gap:34px !important;
  }
  #director .bdc-director-visual{max-width:250px !important;}
}
@media(max-width:700px){
  #director .director-card{
    grid-template-columns:1fr !important;
    padding:28px !important;
  }
  #director .bdc-director-visual{
    width:min(300px,82vw) !important;
    max-width:100% !important;
    margin:0 auto 18px !important;
  }
}


/* v3.6 — Director's Welcome editorial split, matching supplied reference */
#director.director-welcome-section{
  padding:clamp(58px,6vw,88px) 0 !important;
  background:#f8f4ec !important;
}
#director .director-card-v36{
  display:grid !important;
  grid-template-columns:minmax(330px,400px) minmax(0,1fr) !important;
  gap:clamp(58px,6vw,92px) !important;
  align-items:center !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
}
#director .director-visual-v36{
  width:100% !important;
  max-width:400px !important;
  height:auto !important;
  aspect-ratio:auto !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:24px !important;
  background:transparent !important;
  box-shadow:none !important;
}
#director .director-portrait-v36{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center top !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:24px !important;
  box-shadow:0 18px 42px rgba(54,25,31,.10) !important;
}
#director .director-copy-v36{
  align-self:center !important;
  max-width:760px !important;
}
#director .director-kicker-v36{
  margin:0 0 20px !important;
  color:#4b202a !important;
  font-size:.92rem !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
}
#director .director-intro-v36{
  margin:0 0 26px !important;
  max-width:720px !important;
  font-size:clamp(1.08rem,1.35vw,1.32rem) !important;
  line-height:1.55 !important;
  color:#312d2c !important;
}
#director .director-quote-v36{
  margin:0 0 28px !important;
  padding:4px 0 4px 26px !important;
  border-left:4px solid #e9ad13 !important;
  max-width:720px !important;
  font-size:clamp(1.55rem,2.1vw,2.25rem) !important;
  line-height:1.25 !important;
}
#director .director-name{margin-top:0 !important;}
#director .director-link-v36{
  display:inline-flex !important;
  margin-top:24px !important;
  padding-bottom:4px !important;
  border-bottom:1px solid rgba(100,0,32,.35) !important;
}
@media(max-width:960px){
  #director .director-card-v36{
    grid-template-columns:minmax(270px,320px) minmax(0,1fr) !important;
    gap:40px !important;
  }
  #director .director-visual-v36{max-width:320px !important;}
}
@media(max-width:720px){
  #director.director-welcome-section{padding:48px 0 !important;}
  #director .director-card-v36{
    grid-template-columns:1fr !important;
    gap:30px !important;
  }
  #director .director-visual-v36{
    width:min(100%,340px) !important;
    max-width:340px !important;
    margin:0 auto !important;
  }
  #director .director-copy-v36{max-width:none !important;}
}


/* v3.7 — restore section title and make leadership section more compact */
#director.director-welcome-section{
  padding:clamp(44px,4.5vw,64px) 0 !important;
}
#director .director-section-header-v37{
  margin-bottom:clamp(26px,3vw,38px) !important;
}
#director .director-section-header-v37 .section-label{
  margin-bottom:10px !important;
}
#director .director-section-header-v37 .section-title{
  margin:0 !important;
}
#director .director-card-v36{
  grid-template-columns:minmax(250px,300px) minmax(0,1fr) !important;
  gap:clamp(38px,4.5vw,64px) !important;
  align-items:center !important;
}
#director .director-visual-v36{
  max-width:300px !important;
}
#director .director-intro-v36{
  margin-bottom:20px !important;
  font-size:clamp(1rem,1.15vw,1.16rem) !important;
  line-height:1.5 !important;
}
#director .director-quote-v36{
  margin-bottom:22px !important;
  padding-left:22px !important;
  font-size:clamp(1.35rem,1.75vw,1.85rem) !important;
  line-height:1.24 !important;
}
#director .director-link-v36{
  margin-top:18px !important;
}
@media(max-width:960px){
  #director .director-card-v36{
    grid-template-columns:230px minmax(0,1fr) !important;
    gap:32px !important;
  }
  #director .director-visual-v36{max-width:230px !important;}
}
@media(max-width:720px){
  #director.director-welcome-section{padding:40px 0 !important;}
  #director .director-section-header-v37{margin-bottom:24px !important;}
  #director .director-card-v36{grid-template-columns:1fr !important;gap:26px !important;}
  #director .director-visual-v36{width:min(100%,280px) !important;max-width:280px !important;}
}


/* v3.8 — narrative refinement; maintain Design 19 visual language */
.hero .hero-content{padding-bottom:clamp(14px,2.5vw,30px)}
.hero .hero-lead{margin-bottom:26px!important}
.hero .hero-buttons{margin-top:0!important}
.training-proof{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;margin:0 0 32px;padding:17px 22px;border:1px solid rgba(105,30,47,.12);border-radius:14px;background:#fbf8f3}
.training-proof span{display:inline-flex;align-items:center;gap:8px;color:#502833;font-size:.88rem;font-weight:650}
.training-proof i{color:#9a7528}
#impact{padding-top:clamp(55px,5.5vw,78px)!important;padding-bottom:clamp(55px,5.5vw,78px)!important}
#training{padding-top:clamp(55px,5.5vw,78px)!important;padding-bottom:clamp(55px,5.5vw,78px)!important}
.cta-ai{display:block;margin:22px auto 0;background:none;border:0;color:#fff;cursor:pointer;font:inherit;font-size:.94rem}
.cta-ai strong{color:#f5cf73;text-decoration:underline;text-underline-offset:4px}
.cta-ai:focus-visible{outline:3px solid #f5cf73;outline-offset:5px;border-radius:3px}
@media(max-width:720px){.training-proof{gap:12px;padding:16px}.training-proof span{width:calc(50% - 8px);font-size:.8rem}}
@media(max-width:430px){.training-proof span{width:100%}}


/* v3.9 — compact institutional credential: authority without competing with hero */
.hero .hero-status-card,
.hero .hero-credential,
.hero .hero-trust-card,
.hero .hero-proof,
.hero .hero-status{
  max-width:760px !important;
  margin-top:24px !important;
  padding:15px 20px 15px 22px !important;
  border-radius:14px !important;
  border:1px solid rgba(100,0,32,.12) !important;
  border-left:4px solid #e9ad13 !important;
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 8px 24px rgba(54,25,31,.055) !important;
}
.hero .hero-status-card h3,
.hero .hero-credential h3,
.hero .hero-trust-card h3,
.hero .hero-proof h3,
.hero .hero-status h3{
  margin:0 0 4px !important;
  font-size:clamp(1rem,1.15vw,1.12rem) !important;
  line-height:1.3 !important;
  font-weight:750 !important;
  letter-spacing:-.01em !important;
}
.hero .hero-status-card p,
.hero .hero-credential p,
.hero .hero-trust-card p,
.hero .hero-proof p,
.hero .hero-status p{
  margin:0 !important;
  font-size:.9rem !important;
  line-height:1.45 !important;
  color:#6d6663 !important;
}
@media(max-width:720px){
  .hero .hero-status-card,
  .hero .hero-credential,
  .hero .hero-trust-card,
  .hero .hero-proof,
  .hero .hero-status{
    margin-top:20px !important;
    padding:13px 16px 13px 18px !important;
    border-radius:12px !important;
  }
}


/* v3.9.1 — explicit visible BDC institutional status */
.hero .hero-credential{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
  visibility:visible !important;
  opacity:1 !important;
}
.hero .hero-credential-icon{
  flex:0 0 auto !important;
  width:34px !important;
  height:34px !important;
  display:grid !important;
  place-items:center !important;
  color:#640020 !important;
  font-size:1.25rem !important;
}
.hero .hero-credential > div:last-child{
  min-width:0 !important;
}