/* Self-hosted site fonts (latin / latin-ext). */
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 300;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggmxSuXd.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 300;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggexSg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggmxSuXd.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggexSg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggmxSuXd.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggexSg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggmxSuXd.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/manrope-v20-xn7gYHE41ni1AdIRggexSg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(/fonts/outfit-v15-QGYvz_MVcBeNP4NJuktqQ4E.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(/fonts/outfit-v15-QGYvz_MVcBeNP4NJtEtq.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/outfit-v15-QGYvz_MVcBeNP4NJuktqQ4E.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/outfit-v15-QGYvz_MVcBeNP4NJtEtq.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(/fonts/outfit-v15-QGYvz_MVcBeNP4NJuktqQ4E.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(/fonts/outfit-v15-QGYvz_MVcBeNP4NJtEtq.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpDtKy2OAdR1K-IwhWudF-R3woAa8opPOrG97lwqLlOxCcSmrfB.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpDtKy2OAdR1K-IwhWudF-R3woAa8opPOrG97lwqLlOxCkSmg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpStKy2OAdR1K-IwhWudF-R3wEaZfrc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpStKy2OAdR1K-IwhWudF-R3w8aZQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpStKy2OAdR1K-IwhWudF-R3wEaZfrc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpStKy2OAdR1K-IwhWudF-R3w8aZQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpStKy2OAdR1K-IwhWudF-R3wEaZfrc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url(/fonts/sourcesans3-v19-nwpStKy2OAdR1K-IwhWudF-R3w8aZQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif 4';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourceserif4-v14-vEFH2_tTDB4M7-auWDN0ahZJW1ge6NmXq2ZbF8zBfb98SUr0aX2AzA.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif 4';
  font-style: italic;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourceserif4-v14-vEFH2_tTDB4M7-auWDN0ahZJW1ge6NmXq2ZbF8zBfb98SUr6aX0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourceserif4-v14-vEFI2_tTDB4M7-auWDN0ahZJW1gV8tenXg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url(/fonts/sourceserif4-v14-vEFI2_tTDB4M7-auWDN0ahZJW1gb8tc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/sourceserif4-v14-vEFI2_tTDB4M7-auWDN0ahZJW1gV8tenXg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url(/fonts/sourceserif4-v14-vEFI2_tTDB4M7-auWDN0ahZJW1gb8tc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* Metric-matched local fallbacks — reduce CLS when webfonts miss the optional window. */
@font-face {
  font-family: "Manrope Fallback";
  src: local("Segoe UI"), local("Helvetica Neue"), local("Arial");
  size-adjust: 103%;
  ascent-override: 100%;
  descent-override: 28%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Outfit Fallback";
  src: local("Arial"), local("Helvetica Neue"), local("Helvetica");
  size-adjust: 105%;
  ascent-override: 92%;
  descent-override: 23%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Source Sans 3 Fallback";
  src: local("Arial"), local("Helvetica Neue"), local("Helvetica");
  size-adjust: 98%;
  ascent-override: 96%;
  descent-override: 26%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Source Serif 4 Fallback";
  src: local("Times New Roman"), local("Times"), local("Georgia");
  size-adjust: 106%;
  ascent-override: 90%;
  descent-override: 25%;
  line-gap-override: 0%;
}

:root {
  --color-navy-900: #0b1f3a;
  --color-navy-800: #123056;
  --color-navy-700: #1a3f6f;
  --color-gold-500: #e6b422;
  --color-gold-600: #c99a12;
  --color-white: #ffffff;
  --color-ink: #0f172a;
  --color-slate-600: #475569;
  --color-slate-400: #94a3b8;
  --color-surface: #f5f7fa;
  --color-surface-alt: #eef2f6;
  --color-border: #d8dee6;
  --color-success: #1f7a4d;
  --color-error: #b42318;

  --color-bg: var(--color-surface);
  --color-fg: var(--color-ink);
  --color-muted: var(--color-slate-600);
  --color-brand: var(--color-navy-900);
  --color-accent: var(--color-gold-500);
  --color-on-brand: var(--color-white);
  --color-on-accent: var(--color-navy-900);

  --font-display: "Outfit", "Outfit Fallback", Arial, sans-serif;
  --font-body: "Source Sans 3", "Source Sans 3 Fallback", Arial, sans-serif;
  --font-nav: "Manrope", "Manrope Fallback", "Segoe UI", system-ui, sans-serif;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;

  --radius-sm: 4px;
  --radius-md: 20px;
  --content-max: 72rem;
  --content-narrow: 42rem;

  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 8px 24px rgba(15, 23, 42, 0.08);
  --announce-h: 2.25rem;
  --header-bar-h: 3.85rem;
  --header-h: calc(var(--header-bar-h) + var(--announce-h));
  --float-radius: 15px;
  --float-inset: 1.75rem;
  --content-inset: 2.5rem;
  --page-hero-h: clamp(18rem, 42vw, 26rem);
  --page-hero-pad-top: calc(var(--header-h) + var(--space-7));
  --page-hero-pad-bottom: var(--space-7);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  background: var(--color-bg);
  color-scheme: light;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--color-fg);
  background: var(--color-bg);
}

/* Demo soft password gate (UI preview only — not real security).
   Only hide body when the gate is explicitly enabled via data-demo-gate="1". */
html[data-demo-gate="1"]:not(.gate-unlocked) body {
  visibility: hidden;
}

.demo-gate {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-5);
  visibility: visible;
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(230, 180, 34, 0.12), transparent 55%),
    linear-gradient(160deg, var(--color-navy-900) 0%, var(--color-navy-800) 55%, var(--color-navy-700) 100%);
  color: var(--color-on-brand);
}

.demo-gate__panel {
  width: min(100%, 22rem);
  text-align: center;
}

.demo-gate__eyebrow {
  margin: 0 0 var(--space-2);
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.demo-gate__title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 600;
  color: var(--color-on-brand);
}

.demo-gate__copy {
  margin: 0 0 var(--space-6);
  font-family: var(--font-body);
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.78);
}

.demo-gate__form {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-3);
  text-align: left;
}

.demo-gate__label {
  font-family: var(--font-nav);
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.9);
}

.demo-gate__input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.08);
  color: var(--color-on-brand);
  font-family: var(--font-body);
  font-size: 1rem;
}

.demo-gate__input:focus {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.demo-gate__error {
  margin: 0;
  font-size: 0.875rem;
  color: #f5c4c0;
}

.demo-gate__submit {
  margin-top: var(--space-2);
  padding: 0.8rem 1.25rem;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--color-accent);
  color: var(--color-on-accent);
  font-family: var(--font-nav);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
}

.demo-gate__submit:hover {
  background: var(--color-gold-600);
}

main {
  flex: 1 0 auto;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: var(--color-navy-800);
  text-underline-offset: 0.15em;
}

a:hover {
  color: var(--color-gold-600);
}

:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-display);
  line-height: 1.2;
  margin: 0 0 var(--space-4);
  color: var(--color-ink);
}

h1 {
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  font-weight: 700;
  line-height: 1.15;
}

h2 {
  font-size: clamp(1.5rem, 2.5vw, 1.75rem);
  font-weight: 700;
}

h3 {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.3;
}

p {
  margin: 0 0 var(--space-4);
}

p:last-child {
  margin-bottom: 0;
}

.lead {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  line-height: 1.5;
  color: var(--color-muted);
  max-width: 40rem;
}

.container {
  width: min(100% - var(--content-inset), var(--content-max));
  margin-inline: auto;
}

.container--narrow {
  width: min(100% - var(--content-inset), var(--content-narrow));
}

.section {
  padding: var(--space-8) 0;
}

.section--alt {
  background: var(--color-surface-alt);
}

.section--brand {
  background: var(--color-brand);
  color: var(--color-on-brand);
}

.section--brand h2,
.section--brand h3 {
  color: var(--color-on-brand);
}

.section__head {
  margin-bottom: var(--space-6);
  max-width: 40rem;
}

.section__head .rule {
  width: 3rem;
  height: 3px;
  background: var(--color-accent);
  border: 0;
  margin: 0 0 var(--space-4);
}

.skip-link {
  position: absolute;
  left: var(--space-4);
  top: -100%;
  z-index: 1000;
  padding: var(--space-3) var(--space-4);
  background: var(--color-accent);
  color: var(--color-on-accent);
  font-weight: 600;
  text-decoration: none;
}

.skip-link:focus {
  top: var(--space-4);
}

/* Full-width announcement ribbon — fixed height so the floating nav never jumps */
.announcement-ribbon {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 110;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: var(--announce-h);
  min-height: 0;
  padding: 0;
  background: var(--color-navy-900);
  color: var(--color-gold-500);
  border-bottom: 1px solid rgba(230, 180, 34, 0.35);
  box-sizing: border-box;
}

.announcement-ribbon__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem clamp(1rem, 3vw, 2rem);
  width: min(calc(100% - var(--float-inset)), var(--content-max));
  height: 100%;
  padding: 0 0.25rem;
  box-sizing: border-box;
}

.announcement-ribbon__contact {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-family: var(--font-nav);
  font-size: clamp(0.7rem, 1.6vw, 0.8125rem);
  font-weight: 600;
  letter-spacing: 0.015em;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s var(--ease-out), opacity 0.2s var(--ease-out);
}

.announcement-ribbon__contact:hover {
  color: var(--color-gold-500);
}

.announcement-ribbon__contact svg {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  opacity: 0.9;
}

.announcement-ribbon__phone {
  grid-column: 3;
  justify-self: end;
}

.announcement-ribbon__viewport {
  display: grid;
  grid-column: 2;
  width: 100%;
  max-width: 36rem;
  min-width: 0;
  height: 1.35em;
  text-align: center;
  justify-self: center;
  overflow: hidden;
}

.announcement-ribbon__msg {
  grid-area: 1 / 1;
  margin: 0;
  font-family: var(--font-nav);
  font-size: clamp(0.75rem, 2.4vw, 0.875rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.35;
  text-align: center;
  color: var(--color-gold-500);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.announcement-ribbon__msg[hidden] {
  display: none;
}

.announcement-ribbon__msg.is-enter,
.announcement-ribbon__msg.is-leave {
  /* Stacked in-flow (grid-area) — avoid absolute so the auto column does not collapse */
  display: block;
  text-align: center;
}

.announcement-ribbon__msg.is-enter {
  animation: announce-in 0.45s var(--ease-out) both;
}

.announcement-ribbon__msg.is-leave {
  animation: announce-out 0.35s var(--ease-out) both;
}

@keyframes announce-in {
  from {
    opacity: 0;
    transform: translateY(0.35rem);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes announce-out {
  from {
    opacity: 1;
    transform: none;
  }
  to {
    opacity: 0;
    transform: translateY(-0.35rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .announcement-ribbon__msg.is-enter,
  .announcement-ribbon__msg.is-leave {
    animation: none;
  }
}

@media (max-width: 720px) {
  .announcement-ribbon__inner {
    gap: 0.5rem;
  }

  .announcement-ribbon__contact {
    padding: 0.2rem;
  }

  .announcement-ribbon__contact span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .announcement-ribbon__viewport {
    max-width: none;
  }
}

/* Floating header */
.site-header {
  --float-pad: 0.45rem 1rem 0.55rem 0.85rem;
  position: fixed;
  top: var(--announce-h);
  left: 50%;
  z-index: 100;
  display: flex;
  flex-direction: column;
  width: min(calc(100% - var(--float-inset)), var(--content-max));
  transform: translateX(-50%);
  background: rgba(255, 252, 247, 0.94);
  color: var(--color-ink);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0 0 var(--float-radius) var(--float-radius);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.7) inset,
    0 14px 36px rgba(11, 31, 58, 0.14);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.site-header__inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1.25rem;
  min-height: 0;
  padding: var(--float-pad);
  max-width: none;
  width: 100%;
  margin-inline: 0;
  box-sizing: border-box;
}

.brand {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: var(--color-ink);
  flex-shrink: 0;
  min-width: 0;
  justify-self: start;
  padding-left: 0.15rem;
}

.brand img {
  height: 2.85rem;
  width: auto;
  flex-shrink: 0;
  border-radius: 4px;
}

.nav-toggle {
  display: none;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  padding: 0;
  background: var(--color-slate-600);
  border: 0;
  color: #fff;
  border-radius: 35%;
  cursor: pointer;
  transition: transform 0.18s var(--ease-out);
}

.nav-toggle:hover {
  transform: scale(1.06);
}

.nav-toggle:active {
  transform: scale(0.9);
  transition-duration: 0.08s;
}

.nav-toggle__icon {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  min-width: 0;
  gap: 1.35rem;
  font-family: var(--font-nav);
}

.site-nav__list {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0 1.15rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-nav__list a {
  color: var(--color-slate-600);
  text-decoration: none;
  font-family: var(--font-nav);
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: 0.005em;
  padding: 0.2rem 0;
  border-bottom: none;
  position: relative;
  transition: color 0.2s var(--ease-out);
}

.site-nav__list a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.15rem;
  height: 2px;
  border-radius: 2px;
  background: var(--color-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.2s var(--ease-out);
}

.site-nav__list a:hover {
  color: var(--color-ink);
}

.site-nav__list a:hover::after,
.site-nav__list a[aria-current="page"]::after {
  transform: scaleX(1);
}

.site-nav__list a[aria-current="page"] {
  color: var(--color-ink);
}

.site-nav__item--mega {
  position: relative;
}

.site-nav__trigger[aria-expanded="true"],
.site-nav__item--mega.is-mega-open > .site-nav__trigger {
  color: var(--color-ink);
}

.site-nav__trigger[aria-expanded="true"]::after,
.site-nav__item--mega.is-mega-open > .site-nav__trigger::after {
  transform: scaleX(1);
}

.mega-menu {
  display: none;
}

.mega-menu.is-open {
  display: block;
}

.mega-menu:not(.mega-menu--mobile) {
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  right: 0;
  z-index: 120;
  max-height: min(80vh, calc(100vh - var(--header-h) - 0.75rem));
  overflow: hidden;
  padding: 1.1rem 2.75rem 1.5rem 1.15rem;
  background: rgba(255, 252, 247, 0.98);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 0 0 var(--float-radius) var(--float-radius);
  box-shadow: 0 18px 36px rgba(11, 31, 58, 0.16);
}

.mega-menu:not(.mega-menu--mobile).is-open {
  display: flex;
  flex-direction: column;
}

.mega-menu__close {
  position: absolute;
  top: 0.7rem;
  right: 0.75rem;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-slate-600);
  cursor: pointer;
  transition:
    background 0.2s var(--ease-out),
    color 0.2s var(--ease-out),
    border-color 0.2s var(--ease-out);
}

.mega-menu__close:hover,
.mega-menu__close:focus-visible {
  color: var(--color-ink);
  background: var(--color-white);
  border-color: rgba(15, 23, 42, 0.2);
}

.mega-menu__close:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.site-header.mega-open {
  border-radius: 0 0 0 0;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.7) inset,
    0 14px 36px rgba(11, 31, 58, 0.14);
}

.site-header.has-stuck-toc,
.site-header.has-stuck-toc.mega-open,
.site-header.has-stuck-toc.nav-expanded {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: transparent;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset;
}

.mega-menu__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.85fr);
  gap: 1.25rem 1.5rem;
  align-items: start;
  justify-items: start;
}

.mega-menu:not(.mega-menu--mobile) .mega-menu__inner {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding-bottom: 0.35rem;
}

.mega-menu__browse,
.mega-menu__pillar,
.mega-menu__subject,
.mega-menu__group,
.mega-menu a {
  color: var(--color-slate-600);
  text-decoration: none;
  transition: color 0.2s var(--ease-out);
}

.mega-menu a:hover {
  color: var(--color-ink);
}

.mega-menu__pillar {
  font-family: var(--font-nav);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-ink);
  letter-spacing: 0.01em;
}

.mega-menu a.mega-menu__pillar:hover {
  color: var(--color-gold-600);
}

.mega-menu a.mega-menu__browse {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  grid-column: 1 / -1;
  justify-self: end;
  align-self: end;
  min-height: 2.125rem;
  padding: 0.45rem 0.95rem;
  margin-top: 0.35rem;
  font-family: var(--font-nav);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--color-on-accent);
  background: var(--color-accent);
  border: 1.5px solid var(--color-accent);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition:
    background 0.2s var(--ease-out),
    color 0.2s var(--ease-out),
    border-color 0.2s var(--ease-out),
    box-shadow 0.2s var(--ease-out),
    transform 0.2s var(--ease-out);
}

.mega-menu a.mega-menu__browse::after {
  content: "→";
  font-size: 0.875em;
  line-height: 1;
  transition: transform 0.2s var(--ease-out);
}

.mega-menu a.mega-menu__browse:hover {
  color: var(--color-on-accent);
  background: var(--color-gold-600);
  border-color: var(--color-gold-600);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.mega-menu a.mega-menu__browse:hover::after {
  transform: translateX(3px);
}

.mega-menu a.mega-menu__browse:active {
  transform: translateY(0);
}

.mega-menu__subject {
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-slate-400);
  display: inline-block;
  margin-bottom: 0.45rem;
}

.mega-menu a.mega-menu__subject:hover {
  color: var(--color-slate-600);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.mega-menu__group {
  font-family: var(--font-nav);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--color-ink);
}

.mega-menu a.mega-menu__group:hover {
  color: var(--color-navy-700);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.mega-menu__list {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

/* Nesting: subject under pillar → group under subject → leaf under group */
.mega-menu__node--d0 > .mega-menu__list {
  padding-left: 0;
}

.mega-menu__node--d1 > .mega-menu__list {
  padding-left: 0.65rem;
  border-left: 2px solid rgba(15, 23, 42, 0.08);
  margin-top: 0.35rem;
  gap: 0.35rem;
}

.mega-menu__node--d2 > .mega-menu__list {
  padding-left: 0.8rem;
}

.mega-menu__col--learning-path .mega-menu__list {
  gap: 0.65rem;
}

.mega-menu__col--learning-path .mega-menu__node--d1 {
  padding-bottom: 0.75rem;
  margin-bottom: 0.35rem;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.mega-menu__col--learning-path .mega-menu__node--d1:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.mega-menu__col--topic-collection > .mega-menu__node > .mega-menu__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem 1rem;
  margin-top: 0.55rem;
}

.mega-menu__node--d1 > .mega-menu__list {
  margin-top: 0.35rem;
  gap: 0.35rem;
}

.mega-menu__node--d2 .mega-menu__list {
  margin-top: 0.25rem;
  gap: 0.12rem;
}

.mega-menu__item--leaf {
  display: block;
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.35;
  color: var(--color-slate-400);
  opacity: 0.85;
  cursor: default;
}

.mega-menu--mobile {
  display: none;
}

@media (min-width: 1121px) {
  .mega-menu--mobile {
    display: none !important;
  }
}

.category-placeholder {
  padding-top: calc(var(--header-h) + var(--space-7));
  padding-bottom: var(--space-8);
}

.category-placeholder__inner {
  max-width: 42rem;
}

.category-placeholder__crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  margin-bottom: var(--space-4);
  font-family: var(--font-nav);
  font-size: 0.875rem;
  color: var(--color-slate-600);
}

.category-placeholder__crumb a {
  color: var(--color-navy-700);
  text-decoration: none;
}

.category-placeholder__crumb a:hover {
  color: var(--color-ink);
  text-decoration: underline;
}

.category-placeholder__eyebrow {
  margin: 0 0 0.35rem;
  font-family: var(--font-nav);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-navy-700);
}

.category-placeholder h1 {
  margin: 0 0 var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  line-height: 1.15;
  color: var(--color-ink);
}

.category-placeholder .lead {
  margin: 0 0 var(--space-5);
  color: var(--color-slate-600);
  font-size: 1.0625rem;
}

.category-placeholder__children {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.category-placeholder__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
}

.category-placeholder__list a {
  font-family: var(--font-nav);
  font-weight: 600;
  color: var(--color-navy-700);
  text-decoration: none;
}

.category-placeholder__list a:hover {
  color: var(--color-ink);
  text-decoration: underline;
}

.nav-actions {
  display: flex;
  align-items: center;
  justify-self: end;
  gap: 0.5rem;
  flex-shrink: 0;
  min-width: 0;
}

.nav-search {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  width: clamp(13.5rem, 18vw, 17rem);
  height: 2.5rem;
  padding: 0 0.4rem 0 0.35rem;
  background: #fff;
  border: 1.5px solid rgba(26, 63, 111, 0.22);
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(11, 31, 58, 0.06);
  transition:
    border-color 0.2s var(--ease-out),
    background 0.2s var(--ease-out),
    box-shadow 0.2s var(--ease-out);
}

.nav-search:hover {
  border-color: rgba(26, 63, 111, 0.4);
  box-shadow: 0 2px 8px rgba(11, 31, 58, 0.1);
}

.nav-search:focus-within {
  background: #fff;
  border-color: var(--color-navy-700);
  box-shadow:
    0 0 0 3px rgba(230, 180, 34, 0.35),
    0 2px 10px rgba(11, 31, 58, 0.12);
}

.nav-search__submit {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 1.85rem;
  height: 1.85rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--color-navy-800);
  color: #fff;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.nav-search__submit:hover {
  background: var(--color-navy-900);
  color: #fff;
}

.nav-search__submit svg {
  width: 0.95rem;
  height: 0.95rem;
}

.nav-search input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  background: transparent;
  font-family: var(--font-nav);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-navy-900);
  padding: 0;
  outline: none;
}

.nav-search input::placeholder {
  color: #5b6b7f;
  font-weight: 500;
  opacity: 1;
}

.nav-search input::-webkit-search-decoration,
.nav-search input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.nav-search__clear {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 1.4rem;
  height: 1.4rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  transition: color 0.2s var(--ease-out), background 0.2s var(--ease-out);
}

.nav-search__clear:hover {
  color: var(--color-navy-900);
  background: rgba(11, 31, 58, 0.08);
}

.nav-search__clear[hidden] {
  display: none;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 2.75rem;
  padding: 0.75rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  border-radius: var(--radius-md);
  border: 2px solid transparent;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.btn--primary {
  background: var(--color-accent);
  color: var(--color-on-accent);
}

.btn--primary:hover {
  background: var(--color-gold-600);
  color: var(--color-on-accent);
}

.btn--secondary {
  background: transparent;
  color: var(--color-on-brand);
  border-color: var(--color-on-brand);
}

.btn--secondary:hover {
  background: var(--color-on-brand);
  color: var(--color-brand);
}

.btn--brand {
  background: var(--color-navy-900);
  color: var(--color-white);
}

.btn--brand:hover {
  background: var(--color-navy-800);
  color: var(--color-white);
}

.btn--outline {
  background: transparent;
  color: var(--color-brand);
  border-color: var(--color-brand);
}

.btn--outline:hover {
  background: var(--color-brand);
  color: var(--color-on-brand);
}

.btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.btn-row--center {
  justify-content: center;
}

.trust .btn-row {
  width: 100%;
  max-width: 28rem;
}

.trust .btn-row .btn {
  flex: 1 1 0;
  min-width: 0;
}

/* Trust / certifications */
.trust {
  padding-top: var(--space-7);
  padding-bottom: var(--space-8);
}

.trust__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-6);
  margin-top: var(--space-6);
  text-align: center;
}

.trust__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 46rem;
  margin: 0 auto;
}

.trust__intro .rule {
  width: 3rem;
  height: 3px;
  margin: 0 0 var(--space-4);
  border: 0;
  background: var(--color-accent);
}

.trust__heading {
  margin: 0 0 var(--space-4);
  font-size: clamp(1.55rem, 3vw, 2.15rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-navy-900);
  text-wrap: balance;
}

.trust__copy {
  margin: 0;
  font-size: clamp(1rem, 1.5vw, 1.1rem);
  line-height: 1.7;
  color: var(--color-muted);
  text-wrap: pretty;
}

.trust__reviews {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.55rem 0.75rem;
  margin: 0;
  padding-top: var(--space-2);
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  font-weight: 600;
  color: var(--color-navy-900);
  letter-spacing: 0.01em;
}

.trust__stars {
  display: inline-flex;
  align-items: center;
  gap: 0.12rem;
  color: var(--color-accent);
  line-height: 0;
}

.trust__stars svg {
  display: block;
  width: 1.05rem;
  height: 1.05rem;
}

.trust__certs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  justify-items: stretch;
  gap: var(--space-4);
  width: min(100%, 64rem);
  margin: 0;
  padding: 0;
  list-style: none;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.trust__certs li {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 8rem;
  width: 100%;
  padding: var(--space-5) var(--space-4);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1.25rem;
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.07);
  transform: none;
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.trust__certs li:nth-child(even) {
  transform: none;
}

.trust__certs li:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(11, 31, 58, 0.1);
}

.trust__certs img {
  width: auto;
  max-width: 100%;
  height: 5.5rem;
  object-fit: contain;
  filter: grayscale(0.12) contrast(1.02);
  opacity: 0.95;
  transition: filter 0.25s var(--ease-out), opacity 0.25s var(--ease-out), transform 0.25s var(--ease-out);
}

.trust__certs li:hover img {
  filter: none;
  opacity: 1;
  transform: scale(1.03);
}

/* Audience routing — vertical path timeline */
.audience-routes {
  position: relative;
  padding-top: var(--space-7);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + var(--space-4));
  background:
    linear-gradient(180deg, rgba(245, 247, 250, 0.2) 0%, var(--color-white) 28%, var(--color-white) 100%);
  border-top: 1px solid rgba(15, 23, 42, 0.06);
}

.audience-routes .section__head {
  margin-bottom: var(--space-6);
}

.audience-routes__timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6) var(--space-7);
}

.audience-routes__item {
  position: relative;
  z-index: 1;
  display: flex;
}

.audience-routes__item::before {
  display: none;
}

.audience-route {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: var(--space-5);
  align-items: stretch;
  flex: 1;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}

.audience-route:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 4px;
}

.audience-route__marker {
  z-index: 1;
  align-self: start;
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--color-navy-900);
  color: var(--color-gold-500);
  font-family: var(--font-display);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  box-shadow: 0 0 0 6px var(--color-white);
  transition:
    background-color 0.25s var(--ease-out),
    color 0.25s var(--ease-out),
    transform 0.25s var(--ease-out);
}

.audience-route:hover .audience-route__marker,
.audience-route:focus-visible .audience-route__marker {
  background: var(--color-gold-500);
  color: var(--color-navy-900);
  transform: scale(1.08);
}

.audience-route__card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  width: 100%;
  height: 100%;
  padding: var(--space-4);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-top: 3px solid var(--color-navy-800);
  box-shadow: var(--shadow-sm);
  transition:
    border-color 0.25s var(--ease-out),
    box-shadow 0.25s var(--ease-out);
}

.audience-route:hover .audience-route__card,
.audience-route:focus-visible .audience-route__card {
  border-top-color: var(--color-gold-500);
  box-shadow: var(--shadow-md);
}

.audience-route__eyebrow {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-slate-600);
}

.audience-route h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.4vw, 1.28rem);
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-navy-900);
}

.audience-route__copy {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--color-muted);
}

.audience-route__ideal {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.4;
  color: var(--color-slate-600);
}

.audience-route__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: auto;
  padding-top: var(--space-2);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--color-navy-800);
}

.audience-route__cta svg {
  flex-shrink: 0;
  transition: transform 0.25s var(--ease-out);
}

.audience-route:hover .audience-route__cta svg,
.audience-route:focus-visible .audience-route__cta svg {
  transform: translateX(3px);
}

@media (max-width: 800px) {
  .audience-routes__timeline {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }

}

@media (prefers-reduced-motion: reduce) {
  .audience-route__marker,
  .audience-route__card,
  .audience-route__cta svg {
    transition: none;
  }

  .audience-route:hover .audience-route__marker,
  .audience-route:focus-visible .audience-route__marker {
    transform: none;
  }
}

/* Specialized mastery / courses folio */
.mastery {
  position: relative;
  overflow: hidden;
  padding-top: var(--space-7);
  padding-bottom: var(--space-7);
  background:
    linear-gradient(180deg, #f3f4f6 0%, #f7f8fa 50%, #f1f3f6 100%);
}

.mastery::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(15, 23, 42, 0.11) 1px, transparent 1px);
  background-size: 18px 18px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.7), transparent 92%);
  pointer-events: none;
}

.mastery > .container {
  position: relative;
  z-index: 1;
}

.mastery__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-3) var(--space-5);
  margin-bottom: var(--space-5);
}

.mastery__intro {
  max-width: 32rem;
}

.mastery__intro h2 {
  margin-bottom: 0.35rem;
  font-size: clamp(2rem, 4vw, 2.75rem);
  line-height: 1.12;
}

.mastery__intro .lead {
  margin: 0;
  max-width: 28rem;
  font-size: 0.98rem;
}

.mastery__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.mastery__browse {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.65rem 1.05rem;
  border-radius: 999px;
  background: var(--color-accent);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s var(--ease-out), transform 0.2s var(--ease-out);
}

.mastery__browse:hover {
  background: var(--color-gold-600);
  color: var(--color-navy-900);
  transform: translateY(-1px);
}

.mastery__browse svg {
  transition: transform 0.25s var(--ease-out);
}

.mastery__browse:hover svg {
  transform: translateX(3px);
}

.mastery__filters {
  margin: 0;
}

.mastery__select {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}

.mastery__select-label {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-slate-400);
  white-space: nowrap;
}

.mastery__select-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 13.5rem;
}

.mastery__select-control select {
  appearance: none;
  width: 100%;
  margin: 0;
  padding: 0.65rem 2.35rem 0.65rem 1rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(11, 31, 58, 0.05);
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.mastery__select-control select:hover {
  border-color: rgba(15, 23, 42, 0.22);
}

.mastery__select-control select:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.mastery__select-chevron {
  position: absolute;
  right: 0.9rem;
  top: 50%;
  color: var(--color-navy-800);
  pointer-events: none;
  transform: translateY(-50%);
}

.mastery__empty {
  margin: var(--space-4) 0 0;
  color: var(--color-muted);
}

.mastery__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
  align-items: stretch;
}

.mastery-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 15.5rem;
  overflow: hidden;
  isolation: isolate;
  border-radius: 1.5rem;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.08);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out);
}

.mastery-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 36px rgba(11, 31, 58, 0.12);
}

.mastery-card__media {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scale(1.02);
  transition: transform 0.55s var(--ease-out);
  z-index: 0;
}

.mastery-card:hover .mastery-card__media {
  transform: scale(1.07);
}

.mastery-card__body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.55rem;
  padding: 1.35rem 1.4rem 1.45rem;
  max-width: 100%;
}

.mastery-card__icon {
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 0.65rem;
  flex-shrink: 0;
}

.mastery-card__icon svg {
  display: block;
}

.mastery-card h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.28rem, 1.85vw, 1.55rem);
  font-weight: 700;
  line-height: 1.2;
}

.mastery-card__summary {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mastery-card__link {
  margin-top: 0.45rem;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-navy-900);
}

.mastery-card--featured {
  grid-column: span 2;
  min-height: 17rem;
  color: var(--color-white);
  background: var(--color-navy-900);
}

.mastery-card--featured .mastery-card__media {
  left: 38%;
}

.mastery-card--featured .mastery-card__media::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #0b1f3a 0%, rgba(11, 31, 58, 0.82) 28%, rgba(11, 31, 58, 0.25) 62%, transparent 100%);
  pointer-events: none;
}

.mastery-card--featured .mastery-card__body {
  max-width: min(26rem, 58%);
  justify-content: center;
  min-height: 100%;
  background: linear-gradient(90deg, #0b1f3a 0%, rgba(11, 31, 58, 0.92) 72%, transparent 100%);
}

.mastery-card--featured .mastery-card__icon {
  background: var(--color-accent);
  color: var(--color-navy-900);
}

.mastery-card--featured h3 {
  max-width: 16ch;
  color: var(--color-white);
  font-size: clamp(1.45rem, 2.4vw, 1.95rem);
}

.mastery-card--featured .mastery-card__summary {
  max-width: 36ch;
  color: rgba(255, 255, 255, 0.8);
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.mastery-card--featured .mastery-card__link {
  color: var(--color-accent);
}

.mastery-card--tile {
  background: var(--color-white);
}

.mastery-card--tile .mastery-card__media {
  left: 42%;
}

.mastery-card--tile .mastery-card__media::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.92) 34%, rgba(255, 255, 255, 0.35) 68%, transparent 100%);
  pointer-events: none;
}

.mastery-card--tile .mastery-card__body {
  max-width: min(15.5rem, 72%);
  min-height: 100%;
  justify-content: center;
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.96) 78%, transparent 100%);
}

.mastery-card--tile .mastery-card__icon {
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.12);
  color: var(--color-navy-900);
}

.mastery-card--tile .mastery-card__icon--accent {
  background: #2563eb;
  border-color: #2563eb;
  color: var(--color-white);
}

.mastery-card--tile h3 {
  color: var(--color-navy-900);
}

.mastery-card--tile .mastery-card__summary {
  color: var(--color-slate-600);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

/* Content hub (homepage blog teasers) */
.content-hub {
  position: relative;
  overflow: hidden;
  padding-top: var(--space-7);
  padding-bottom: var(--space-7);
  background:
    linear-gradient(180deg, #f7f8fa 0%, #eef2f6 52%, #f5f7fa 100%);
}

.content-hub::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(15, 23, 42, 0.09) 1px, transparent 1px);
  background-size: 18px 18px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.55), transparent 90%);
  pointer-events: none;
}

.content-hub > .container {
  position: relative;
  z-index: 1;
}

.content-hub__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-3) var(--space-5);
  margin-bottom: var(--space-5);
}

.content-hub__intro {
  max-width: 32rem;
}

.content-hub__intro .lead {
  margin: 0;
  max-width: 28rem;
  font-size: 0.98rem;
}

.content-hub__browse {
  display: inline-block;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--color-navy-900);
  text-decoration: none;
  border-bottom: 1px solid rgba(11, 31, 58, 0.4);
  transition: color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.content-hub__browse:hover {
  color: var(--color-navy-700);
  border-bottom-color: var(--color-navy-700);
}

.content-hub__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.15rem;
}

.content-hub-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow: hidden;
  border-radius: 1.15rem;
  background: var(--color-white);
  color: inherit;
  text-decoration: none;
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.07);
  transition: transform 0.28s var(--ease-out), box-shadow 0.28s var(--ease-out);
}

.content-hub-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(11, 31, 58, 0.11);
}

.content-hub-card__media {
  display: block;
  aspect-ratio: 16 / 10;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.content-hub-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  flex: 1;
  padding: 1.05rem 1.15rem 1.2rem;
}

.content-hub-card__meta {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-slate-400);
}

.content-hub-card__title {
  margin: 0;
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.3;
}

.content-hub-card__excerpt {
  margin: 0;
  color: var(--color-slate-600);
  font-size: 0.9rem;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.content-hub-card__more {
  margin-top: auto;
  padding-top: 0.55rem;
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--color-navy-800);
}

.content-hub-card:hover .content-hub-card__more {
  color: var(--color-navy-900);
}

@media (max-width: 1100px) {
  .content-hub__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Hero */
.hero {
  position: relative;
  min-height: min(100svh, 47rem);
  display: grid;
  align-items: center;
  padding-top: var(--header-h);
  color: var(--color-on-brand);
  --hero-image: url("../images/hero-classroom-ai.jpg");
  background:
    linear-gradient(
      90deg,
      rgba(11, 31, 58, 0.88) 0%,
      rgba(11, 31, 58, 0.72) 28%,
      rgba(11, 31, 58, 0.42) 55%,
      rgba(11, 31, 58, 0.18) 78%,
      rgba(11, 31, 58, 0.06) 100%
    ),
    var(--hero-image) center / cover no-repeat;
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: min(36%, 10rem);
  background: linear-gradient(
    to top,
    rgba(11, 31, 58, 0.78) 0%,
    rgba(11, 31, 58, 0.35) 55%,
    transparent 100%
  );
  pointer-events: none;
  z-index: 0;
}

.hero--short {
  min-height: 18rem;
  align-items: center;
  padding-top: 0;
}

.hero--short::after {
  display: none;
}

.hero__content {
  position: relative;
  z-index: 1;
  padding: var(--space-5) 0 var(--space-7);
}

.hero__content > :is(h1, .lead, .btn-row) {
  max-width: 46rem;
}

/* Stats strip — solid brand bar below hero */
.hero__stats {
  position: relative;
  z-index: 2;
  margin-top: 0;
  padding: var(--space-5) 0;
  background: linear-gradient(
    160deg,
    var(--color-navy-900) 0%,
    #0e2744 48%,
    var(--color-navy-800) 100%
  );
  color: var(--color-on-brand);
  pointer-events: none;
  animation: none;
}

.hero__stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: 52rem;
}

.hero__stats .stat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  min-height: 0;
  padding: 0.5rem 1rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  text-align: center;
}

.hero__stats .stat-card__value,
.hero__stats .stat-card__value--accent,
.hero__stats .stat-card__label {
  margin: 0;
  color: var(--color-on-brand);
  text-shadow: none;
}

.hero__stats .stat-card__value {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.hero__stats .stat-card__label {
  font-family: var(--font-nav);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.hero h1 {
  color: var(--color-on-brand);
  font-size: clamp(2.85rem, 5.8vw, 4.75rem);
  line-height: 1.06;
  margin-bottom: var(--space-4);
  text-wrap: balance;
  animation: none;
}

.hero .lead {
  color: rgba(255, 255, 255, 0.92);
  font-size: clamp(1.15rem, 1.85vw, 1.4rem);
  max-width: 38rem;
  margin-bottom: var(--space-6);
  animation: none;
}

.hero .btn-row {
  gap: 0.85rem;
  animation: none;
}

.hero .btn {
  position: relative;
  min-height: 3.35rem;
  padding: 0.9rem 1.55rem 0.9rem 1.7rem;
  gap: 0.65rem;
  font-family: var(--font-nav);
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 0.7rem;
  box-shadow: none;
  transition:
    background 0.35s var(--ease-out),
    color 0.35s var(--ease-out),
    border-color 0.35s var(--ease-out),
    box-shadow 0.35s var(--ease-out),
    transform 0.35s var(--ease-out);
}

.hero .btn__arrow {
  flex-shrink: 0;
  transition: transform 0.35s var(--ease-out);
}

.hero .btn:hover .btn__arrow {
  transform: translateX(4px);
}

.hero .btn:hover {
  transform: translateY(-1px);
}

.hero .btn--primary {
  background: var(--color-accent);
  color: var(--color-on-accent);
  border-color: transparent;
  box-shadow: none;
}

.hero .btn--primary:hover {
  background: var(--color-gold-600);
  color: var(--color-on-accent);
  border-color: transparent;
  box-shadow: none;
}

.hero .btn--secondary {
  background: rgba(255, 255, 255, 0.1);
  color: var(--color-on-brand);
  border-color: rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.hero .btn--secondary:hover {
  background: rgba(255, 255, 255, 0.18);
  color: var(--color-on-brand);
  border-color: rgba(255, 255, 255, 0.9);
}

.page-hero {
  background: var(--color-brand);
  color: var(--color-on-brand);
  min-height: var(--page-hero-h);
  display: grid;
  align-items: end;
  padding: 0;
}

.page-hero .container,
.schedule-hero__content,
.about-hero__content,
.contact-hero__content {
  width: min(100% - 2.5rem, var(--content-max));
  margin-inline: auto;
  padding: var(--page-hero-pad-top) 0 var(--page-hero-pad-bottom);
  max-width: none;
}

.page-hero h1,
.schedule-hero h1,
.about-hero__content h1,
.contact-hero__content h1 {
  margin: 0 0 var(--space-4);
  max-width: 40rem;
  color: var(--color-on-brand);
  font-size: clamp(2.1rem, 4.5vw, 3.35rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  animation: none;
}

.page-hero .lead,
.schedule-hero__lead,
.about-hero__content p,
.contact-hero__content p {
  margin: 0;
  max-width: 34rem;
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(1rem, 1.4vw, 1.125rem);
  line-height: 1.65;
  animation: none;
}

.page-hero .rule {
  display: none;
}

/* Grids & cards */
.grid {
  display: grid;
  gap: var(--space-5);
}

.grid--3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid--2 {
  grid-template-columns: repeat(2, 1fr);
}

.card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.card:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--color-navy-700);
}

.card__media {
  aspect-ratio: 16 / 10;
  background: var(--color-navy-800) center / cover no-repeat;
}

.card__body {
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  flex: 1;
}

.card__body p {
  color: var(--color-muted);
  flex: 1;
}

.card__meta {
  font-size: 0.875rem;
  color: var(--color-slate-400);
  font-weight: 600;
}

/* Blog page */
.blog-catalog {
  background: var(--color-white);
  padding-top: var(--header-h);
}

.blog-catalog__layout {
  display: grid;
  grid-template-columns: minmax(18rem, 21rem) minmax(0, 1fr);
  align-items: start;
}

.blog-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: var(--space-6) var(--space-5) var(--space-7);
  background: var(--color-surface);
  border-right: 1px solid rgba(15, 23, 42, 0.06);
  position: sticky;
  top: var(--header-h);
  align-self: start;
  max-height: calc(100vh - var(--header-h));
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.blog-sidebar::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.blog-sidebar__head h2 {
  margin: 0 0 0.25rem;
  font-size: 1.15rem;
  color: var(--color-navy-900);
}

.blog-sidebar__head p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--color-muted);
}

.blog-sidebar__search-inner {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  height: 2.75rem;
  padding: 0 0.85rem 0 0.75rem;
  background: var(--color-bg);
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: var(--radius-md);
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.blog-sidebar__search-inner:focus-within {
  border-color: rgba(15, 23, 42, 0.18);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.06);
}

.blog-sidebar__search-submit {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-muted);
  cursor: pointer;
  transition: color 0.2s var(--ease-out);
}

.blog-sidebar__search-submit:hover {
  color: var(--color-navy-900);
}

.blog-sidebar__search input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  background: transparent;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-navy-900);
  padding: 0;
  outline: none;
}

.blog-sidebar__search input::placeholder {
  color: var(--color-muted);
  opacity: 1;
}

.blog-sidebar__search input::-webkit-search-decoration,
.blog-sidebar__search input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.blog-sidebar__search-clear {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--color-muted);
  cursor: pointer;
  transition: color 0.2s var(--ease-out), background 0.2s var(--ease-out);
}

.blog-sidebar__search-clear:hover {
  color: var(--color-navy-900);
  background: rgba(15, 23, 42, 0.06);
}

.blog-sidebar__search-clear[hidden] {
  display: none;
}

.blog-sidebar__nav {
  display: grid;
  gap: 0.35rem;
}

.blog-cat {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0.7rem 0.85rem;
  border: 0;
  border-radius: 0.75rem;
  background: transparent;
  color: var(--color-slate-600);
  text-align: left;
  text-decoration: none;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.blog-cat:hover {
  color: var(--color-navy-900);
  background: rgba(15, 23, 42, 0.04);
}

.blog-cat.is-active {
  background: var(--color-accent);
  color: var(--color-navy-900);
}

.blog-sidebar__tags {
  padding-top: var(--space-4);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.blog-sidebar__tags-label {
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-slate-400);
}

.blog-tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.blog-tag {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.1);
  background: var(--color-white);
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.blog-tag:hover {
  color: var(--color-navy-900);
  border-color: rgba(15, 23, 42, 0.18);
  background: rgba(15, 23, 42, 0.03);
}

.blog-tag.is-active {
  background: var(--color-navy-900);
  border-color: var(--color-navy-900);
  color: var(--color-white);
}

.blog-sidebar__tools {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-top: var(--space-4);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.blog-sidebar__count {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-muted);
}

.blog-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 100%;
  margin: 0;
  padding: 0.55rem 0.85rem;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 0.75rem;
  background: var(--color-white);
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.blog-chip:hover {
  color: var(--color-navy-900);
  border-color: rgba(15, 23, 42, 0.18);
}

.blog-chip.is-active,
.blog-chip--toggle.is-active {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: var(--color-navy-900);
}

.blog-main {
  padding: var(--space-6) clamp(var(--space-5), 3vw, var(--space-7)) var(--space-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-7);
  background:
    radial-gradient(ellipse 70% 40% at 100% 0%, rgba(230, 180, 34, 0.08), transparent 55%),
    var(--color-white);
}

.blog-section-head {
  margin-bottom: var(--space-5);
}

.blog-section-head h2 {
  margin: 0 0 0.3rem;
  font-size: clamp(1.35rem, 2vw, 1.7rem);
  color: var(--color-navy-900);
}

.blog-section-head p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.95rem;
}

.blog-section-head--row {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: var(--space-4);
}

.blog-filters-crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 var(--space-4);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-filters-crumb[hidden] {
  display: none;
}

.blog-filters-crumb__sep {
  color: var(--color-slate-400);
}

.blog-filters-crumb__link {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-navy-800);
  font: inherit;
  cursor: pointer;
  text-decoration: none;
}

.blog-filters-crumb__link:hover {
  color: var(--color-gold-600);
}

.blog-filters-crumb__current {
  color: var(--color-navy-900);
}

.blog-filters-crumb__clear {
  margin-left: 0.35rem;
  padding: 0.2rem 0.55rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 999px;
  background: var(--color-white);
  color: var(--color-slate-600);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.blog-filters-crumb__clear:hover {
  color: var(--color-navy-900);
  border-color: rgba(15, 23, 42, 0.2);
  background: rgba(15, 23, 42, 0.03);
}

.blog-sort {
  display: inline-flex;
  padding: 0.25rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.05);
  gap: 0.15rem;
}

.blog-sort__btn {
  margin: 0;
  padding: 0.45rem 0.85rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.blog-sort__btn.is-active {
  background: var(--color-white);
  color: var(--color-navy-900);
  box-shadow: 0 4px 12px rgba(11, 31, 58, 0.08);
}

.blog-featured__head {
  margin-bottom: var(--space-5);
}

.blog-featured__head h2 {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
  color: var(--color-navy-900);
}

.blog-featured__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.blog-feature {
  display: flex;
  flex-direction: column;
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(11, 31, 58, 0.05);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), border-color 0.25s var(--ease-out);
}

.blog-feature:hover {
  transform: translateY(-3px);
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow: 0 16px 32px rgba(11, 31, 58, 0.1);
}

.blog-feature__media {
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--color-surface-alt);
}

.blog-feature__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s var(--ease-out);
}

.blog-feature:hover .blog-feature__media img {
  transform: scale(1.04);
}

.blog-feature__body {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: var(--space-5);
  flex: 1;
}

.blog-feature__meta {
  margin: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.65rem;
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-feature__byline {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

.blog-feature__tags {
  flex: 0 1 auto;
  margin-left: auto;
  text-align: right;
  font-weight: 500;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 50%;
}

.blog-feature__title {
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.3;
}

.blog-feature__title a {
  color: var(--color-navy-900);
  text-decoration: none;
}

.blog-feature__title a:hover {
  color: var(--color-navy-700);
}

.blog-feature__excerpt {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.92rem;
  line-height: 1.55;
}

.blog-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.blog-card__cat {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.6rem;
  border-radius: 999px;
  background: rgba(230, 180, 34, 0.16);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.blog-card__mins {
  font-family: var(--font-nav);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-card__title a {
  color: var(--color-navy-900);
  text-decoration: none;
}

.blog-card__title a:hover {
  color: var(--color-navy-700);
}

.blog-card__excerpt {
  margin: 0;
  color: var(--color-muted);
  line-height: 1.55;
}

.blog-browse__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
}

.blog-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1.15rem;
  background: var(--color-white);
  box-shadow: 0 10px 24px rgba(11, 31, 58, 0.05);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.blog-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 34px rgba(11, 31, 58, 0.12);
}

.blog-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--color-surface-alt);
}

.blog-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s var(--ease-out);
}

.blog-card:hover .blog-card__media img {
  transform: scale(1.05);
}

.blog-card__mins-badge {
  position: absolute;
  left: 0.75rem;
  bottom: 0.75rem;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: rgba(11, 31, 58, 0.82);
  color: #fff;
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
}

.blog-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 1rem 1.05rem 1.15rem;
  flex: 1;
}

.blog-card__title {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.3;
}

.blog-card__excerpt {
  font-size: 0.9rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.blog-card__meta {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: auto;
  padding-top: 0.35rem;
}

.blog-card__tag {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--color-muted);
}

.blog-save {
  margin: 0;
  padding: 0.55rem 0.9rem;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 999px;
  background: transparent;
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), border-color 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.blog-save:hover,
.blog-save.is-saved {
  background: rgba(230, 180, 34, 0.16);
  border-color: rgba(230, 180, 34, 0.55);
}

.blog-save--icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border-radius: 50%;
  color: var(--color-slate-400);
}

.blog-save--icon.is-saved {
  color: var(--color-navy-900);
}

.blog-ask {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.6fr);
  gap: var(--space-5);
  align-items: center;
  padding: clamp(1.25rem, 3vw, 2rem);
  border-radius: 1.35rem;
  background:
    linear-gradient(120deg, rgba(11, 31, 58, 0.96), rgba(18, 48, 86, 0.9)),
    var(--color-navy-900);
  color: rgba(255, 255, 255, 0.88);
  box-shadow: 0 20px 40px rgba(11, 31, 58, 0.18);
}

.blog-ask h2 {
  margin: 0 0 0.45rem;
  color: #fff;
  font-size: clamp(1.35rem, 2vw, 1.75rem);
}

.blog-ask__copy p {
  margin: 0;
  max-width: 36rem;
  color: rgba(255, 255, 255, 0.78);
}

.blog-ask__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.blog-ask__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.blog-ask__actions .btn--outline {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.55);
}

.blog-ask__actions .btn--outline:hover {
  background: #fff;
  color: var(--color-navy-900);
}

.blog-tips {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  position: relative;
  flex: 1 1 16rem;
  min-width: 0;
}

.blog-tips input {
  appearance: none;
  width: 100%;
  min-height: 2.75rem;
  height: 2.75rem;
  padding: 0 1.25rem;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  line-height: 1;
}

.blog-tips input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.blog-tips .btn {
  min-height: 2.75rem;
  height: 2.75rem;
}

.blog-tips__note {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 0.35rem);
  margin: 0;
  font-size: 0.82rem;
  color: var(--color-accent);
}

.blog-pagination {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: var(--space-7);
}

.blog-page {
  display: grid;
  place-items: center;
  min-width: 2.35rem;
  height: 2.35rem;
  padding: 0 0.55rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 0.55rem;
  background: var(--color-white);
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.blog-page:hover {
  color: var(--color-navy-900);
  border-color: rgba(15, 23, 42, 0.22);
}

.blog-page.is-active {
  background: var(--color-navy-900);
  border-color: var(--color-navy-900);
  color: var(--color-white);
}

.blog-page.is-disabled,
.blog-page:disabled {
  opacity: 0.4;
  pointer-events: none;
}

.blog-empty {
  grid-column: 1 / -1;
  display: grid;
  gap: var(--space-4);
  justify-items: start;
  margin: 0;
  padding: var(--space-7);
  border: 1px dashed rgba(15, 23, 42, 0.16);
  border-radius: 1rem;
  background: var(--color-white);
  color: var(--color-muted);
}

.blog-empty--soft {
  border: 0;
  background: transparent;
  padding: var(--space-4) 0;
}

.blog-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  height: 3px;
  background: transparent;
  pointer-events: none;
}

.blog-progress__bar {
  width: 0%;
  height: 100%;
  background: linear-gradient(90deg, var(--color-accent), var(--color-gold-600));
  transition: width 0.08s linear;
}

.blog-article {
  background: var(--color-white);
  padding-bottom: var(--space-8);
}

.blog-article__layout {
  width: min(100% - 2.5rem, var(--content-max));
  margin: 0 auto;
  padding-top: calc(var(--header-h) + var(--space-7));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 19rem);
  gap: clamp(var(--space-6), 4vw, var(--space-8));
  align-items: start;
}

.blog-article__shell {
  width: 100%;
  max-width: 44rem;
  margin: 0;
  padding-top: 0;
}

.blog-article__aside {
  position: sticky;
  top: calc(var(--header-h) + var(--space-4));
  padding-top: 0.15rem;
}

.blog-article__aside-card {
  padding: var(--space-5);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1.15rem;
  background:
    linear-gradient(165deg, rgba(253, 248, 237, 0.95) 0%, rgba(255, 255, 255, 0.92) 55%),
    #fbf7ef;
  box-shadow: 0 14px 34px rgba(11, 31, 58, 0.07);
}

.blog-article__aside-card h2 {
  margin: 0 0 0.35rem;
  font-size: 1.15rem;
  color: var(--color-navy-900);
}

.blog-article__aside-lead {
  margin: 0 0 var(--space-4);
  font-size: 0.88rem;
  color: var(--color-muted);
  line-height: 1.45;
}

.blog-article__aside-list {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.blog-article__aside-list .blog-article__course-card {
  grid-template-columns: 4.25rem minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0.65rem;
  background: rgba(255, 255, 255, 0.78);
}

.blog-article__aside-list .blog-article__course-title {
  font-size: 0.92rem;
}

.blog-article__aside-link {
  display: inline-flex;
  margin-top: var(--space-4);
  font-family: var(--font-nav);
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--color-navy-800);
  text-decoration: none;
}

.blog-article__aside-link:hover {
  color: var(--color-gold-600);
}

.blog-article__crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 var(--space-5);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-article__crumb a {
  color: var(--color-navy-800);
  text-decoration: none;
}

.blog-article__crumb a:hover {
  color: var(--color-gold-600);
}

.blog-article__header {
  margin-bottom: var(--space-6);
}

.blog-article__kicker {
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-gold-600);
}

.blog-article__title {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 5vw, 3.35rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.03em;
  color: var(--color-navy-900);
}

.blog-article__dek {
  margin: 0 0 var(--space-6);
  font-family: "Source Serif 4", "Source Serif 4 Fallback", Georgia, serif;
  font-size: clamp(1.15rem, 2vw, 1.35rem);
  font-weight: 400;
  line-height: 1.5;
  color: var(--color-slate-600);
}

.blog-article__byline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.blog-article__author {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-width: 0;
}

.blog-article__avatar {
  display: grid;
  place-items: center;
  width: 2.85rem;
  height: 2.85rem;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--color-navy-800), var(--color-navy-900));
  color: var(--color-accent);
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}

.blog-article__author-name {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-navy-900);
}

.blog-article__author-role {
  margin: 0.15rem 0 0;
  font-size: 0.82rem;
  color: var(--color-muted);
}

.blog-article__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-nav);
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-article__tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-top: var(--space-4);
}

.blog-article__tool {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.4rem 0.75rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 999px;
  background: transparent;
  color: var(--color-navy-800);
  font-family: var(--font-nav);
  font-size: 0.76rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), border-color 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.blog-article__tool:hover,
.blog-article__tool.is-saved {
  background: rgba(230, 180, 34, 0.14);
  border-color: rgba(230, 180, 34, 0.45);
  color: var(--color-navy-900);
}

.blog-article__figure {
  margin: 0 0 var(--space-7);
}

.blog-article__figure img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 0.35rem;
  background: var(--color-surface-alt);
}

.blog-article__figure figcaption {
  margin-top: 0.75rem;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-style: italic;
  color: var(--color-muted);
  line-height: 1.45;
}

.blog-article__body {
  max-width: none;
  font-family: "Source Serif 4", "Source Serif 4 Fallback", Georgia, serif;
  font-size: 1.125rem;
  line-height: 1.75;
  color: #243044;
}

.blog-article__body.prose {
  max-width: none;
}

.blog-article__body > * + * {
  margin-top: 1.25em;
}

.blog-article__lead {
  font-size: 1.28rem;
  line-height: 1.6;
  color: var(--color-navy-900);
}

.blog-article__lead::first-letter {
  float: left;
  margin: 0.08em 0.12em 0 0;
  font-family: var(--font-display);
  font-size: 3.6rem;
  font-weight: 700;
  line-height: 0.8;
  color: var(--color-navy-900);
}

.blog-article__body h2 {
  margin: 2em 0 0.65em;
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2vw, 1.65rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--color-navy-900);
}

.blog-article__body p,
.blog-article__body ul {
  margin: 0;
}

.blog-article__body ul {
  padding-left: 1.2em;
}

.blog-article__body img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 1.75em auto;
  border-radius: 8px;
}

.blog-article__body li + li {
  margin-top: 0.45em;
}

.blog-article__quote {
  margin: 2em 0;
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 3px solid var(--color-accent);
}

.blog-article__quote p,
.blog-article__body blockquote p {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.2vw, 1.55rem);
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-navy-900);
}

.blog-article__body blockquote {
  margin: 2em 0;
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 3px solid var(--color-accent);
}

.blog-article__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-top: var(--space-8);
  padding-top: var(--space-6);
  border-top: 1px solid rgba(15, 23, 42, 0.1);
}

.blog-article__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.blog-article__tags span {
  display: inline-flex;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: var(--color-surface);
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
}

.blog-article__footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.blog-article__more,
.blog-article__courses {
  margin-top: var(--space-8);
  padding: var(--space-8) 0;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  background: var(--color-surface);
}

.blog-article__courses {
  margin-top: 0;
  background: var(--color-white);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.blog-article__more-inner {
  width: min(100% - 2.5rem, var(--content-max));
  margin: 0 auto;
}

.blog-article__more-head {
  margin-bottom: var(--space-5);
  max-width: 40rem;
}

.blog-article__more-head h2 {
  margin: 0 0 0.35rem;
  font-size: clamp(1.35rem, 2vw, 1.7rem);
  color: var(--color-navy-900);
}

.blog-article__more-head p {
  margin: 0;
  color: var(--color-muted);
}

.blog-article__more-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.blog-article__more-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 1rem;
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.08);
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.blog-article__more-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 32px rgba(11, 31, 58, 0.1);
}

.blog-article__more-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: var(--color-surface-alt);
}

.blog-article__more-card-body {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1rem 1.05rem 1.15rem;
}

.blog-article__more-card-meta {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-article__more-card-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.05rem;
  line-height: 1.3;
  color: var(--color-navy-900);
}

.blog-article__courses-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.blog-article__course-card {
  display: grid;
  grid-template-columns: 5.25rem minmax(0, 1fr);
  gap: 0.9rem;
  align-items: center;
  padding: 0.9rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1rem;
  background: var(--color-surface);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s var(--ease-out), transform 0.2s var(--ease-out);
}

.blog-article__course-card:hover {
  border-color: rgba(15, 23, 42, 0.16);
  transform: translateY(-2px);
}

.blog-article__course-card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 0.65rem;
  background: var(--color-surface-alt);
}

.blog-article__course-meta {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--color-slate-400);
}

.blog-article__course-title {
  margin: 0.2rem 0;
  font-family: var(--font-display);
  font-size: 1rem;
  line-height: 1.3;
  color: var(--color-navy-900);
}

.blog-article__course-price {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--color-navy-900);
}

.blog-share__status {
  margin: 0;
  min-height: 1.1em;
  font-size: 0.8rem;
  color: var(--color-muted);
}

/* Courses catalog */
.courses-catalog {
  background: var(--color-white);
  min-height: 70vh;
}

.courses-catalog__layout {
  display: grid;
  grid-template-columns: minmax(15rem, 17.5rem) minmax(0, 1fr);
  min-height: 100vh;
  align-items: start;
}

.courses-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  position: sticky;
  top: var(--header-h);
  align-self: start;
  max-height: calc(100vh - var(--header-h));
  overflow-y: auto;
  overflow-x: hidden;
  padding: var(--space-6) var(--space-5) var(--space-7);
  background: var(--color-surface);
  border-right: 1px solid rgba(15, 23, 42, 0.06);
}


.filter-drawer__toggle,
.filter-drawer__close {
  display: none;
}

.filter-drawer__mobile-controls {
  display: none;
}

.filter-drawer__backdrop {
  display: none;
}

.courses-sidebar__head h2 {
  margin: 0 0 0.25rem;
  font-size: 1.15rem;
  color: var(--color-navy-900);
}

.courses-sidebar__head p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--color-muted);
}

.courses-sidebar__search-inner {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  height: 2.75rem;
  padding: 0 0.85rem 0 0.75rem;
  background: var(--color-bg);
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: var(--radius-md);
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.courses-sidebar__search-inner:focus-within {
  border-color: rgba(15, 23, 42, 0.18);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.06);
}

.courses-sidebar__search-submit {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-muted);
  cursor: pointer;
  transition: color 0.2s var(--ease-out);
}

.courses-sidebar__search-submit:hover {
  color: var(--color-navy-900);
}

.courses-sidebar__search input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  background: transparent;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-navy-900);
  padding: 0;
  outline: none;
}

.courses-sidebar__search input::placeholder {
  color: var(--color-muted);
  opacity: 1;
}

.courses-sidebar__search input::-webkit-search-decoration,
.courses-sidebar__search input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.courses-sidebar__search-clear {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--color-muted);
  cursor: pointer;
  transition: color 0.2s var(--ease-out), background 0.2s var(--ease-out);
}

.courses-sidebar__search-clear:hover {
  color: var(--color-navy-900);
  background: rgba(15, 23, 42, 0.06);
}

.courses-sidebar__search-clear[hidden] {
  display: none;
}

.courses-search--prominent .courses-sidebar__search-inner {
  height: 3rem;
  border-width: 1.5px;
}

.catalog-finder {
  display: grid;
  gap: 0.75rem;
  padding: 0.9rem;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 0.85rem;
  background: rgba(255, 255, 255, 0.72);
}

.catalog-finder__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.catalog-finder__head h3 {
  margin: 0;
  font-size: 0.95rem;
  color: var(--color-navy-900);
}

.catalog-finder__toggle {
  border: 0;
  background: transparent;
  color: var(--color-gold-600);
  font-family: var(--font-nav);
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
}

.catalog-finder__panel {
  display: grid;
  gap: 0.65rem;
}

.catalog-finder__panel label {
  display: grid;
  gap: 0.25rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-muted);
}

.catalog-finder__panel select {
  width: 100%;
  height: 2.45rem;
  padding: 0 0.7rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-navy-900);
}

.catalog-finder__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  margin-top: 0.25rem;
}

.catalog-filters {
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-3);
}

.catalog-filters .schedule-filter + .schedule-filter {
  padding-top: var(--space-3);
  border-top: 1px solid rgba(15, 23, 42, 0.07);
}

.catalog-filters .schedule-filter__label {
  margin-bottom: var(--space-2);
}

.catalog-filters .schedule-filter__list {
  gap: 0.45rem;
}

.catalog-filters .schedule-dates {
  gap: 0.5rem;
}

.catalog-filters .schedule-dates__field input {
  height: 2.45rem;
  padding: 0 0.3rem;
  font-size: 0.75rem;
  max-width: 100%;
  box-sizing: border-box;
}

.schedule-dates--inline {
  grid-template-columns: 1fr 1fr;
}

.catalog-view-toggle {
  display: inline-flex;
  gap: 0.25rem;
  padding: 0.2rem;
  border-radius: 999px;
  background: var(--color-surface);
  flex-shrink: 0;
}

.catalog-view-toggle__btn {
  border: 0;
  border-radius: 999px;
  padding: 0.5rem 1rem;
  background: transparent;
  font-family: var(--font-nav);
  font-size: 0.84rem;
  font-weight: 700;
  color: var(--color-slate-600);
  cursor: pointer;
}

.catalog-view-toggle__btn.is-active {
  background: var(--color-navy-900);
  color: var(--color-white);
}

.catalog-enquiry {
  margin-top: var(--space-7);
}

.courses-main .schedule-list,
.courses-main .schedule-notify {
  width: 100%;
  margin-inline: 0;
}

.courses-sidebar__nav {
  display: grid;
  gap: 0.35rem;
}

.courses-cat {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 0.85rem;
  border-radius: 0.75rem;
  color: var(--color-slate-600);
  text-decoration: none;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 600;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.courses-cat:hover {
  color: var(--color-navy-900);
  background: rgba(15, 23, 42, 0.04);
}

.courses-cat.is-active {
  background: var(--color-accent);
  color: var(--color-navy-900);
}

.courses-cat__icon {
  display: grid;
  place-items: center;
  width: 1.35rem;
  height: 1.35rem;
  flex-shrink: 0;
  color: inherit;
}

.courses-sidebar__all {
  margin-top: auto;
  padding-top: var(--space-4);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--color-navy-800);
  text-decoration: none;
}

.courses-sidebar__all:hover { 
  color: var(--color-gold-600);
}

.courses-main {
  padding: clamp(var(--space-7), 9vh, var(--space-9)) clamp(var(--space-5), 3vw, var(--space-7)) var(--space-8);
}

#course-catalog-combined .courses-main {
  padding-top: calc(var(--header-h) + var(--space-5));
}

.catalog-search {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  width: 100%;
  min-height: 2.85rem;
  margin-bottom: var(--space-4);
  padding: 0.25rem 0.3rem 0.25rem 0.1rem;
  border: 1.5px solid rgba(18, 48, 86, 0.28);
  border-radius: 0.85rem;
  background: #fff;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 10px 28px rgba(11, 31, 58, 0.1);
  transition:
    border-color 0.2s var(--ease-out),
    box-shadow 0.2s var(--ease-out);
}

.catalog-search:hover {
  border-color: rgba(18, 48, 86, 0.42);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 12px 32px rgba(11, 31, 58, 0.12);
}

.catalog-search:focus-within {
  border-color: var(--color-navy-700);
  box-shadow:
    0 0 0 3px rgba(230, 180, 34, 0.35),
    0 12px 32px rgba(11, 31, 58, 0.12);
}

.catalog-search__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-left: 0.75rem;
  color: var(--color-navy-700);
  flex-shrink: 0;
}

.catalog-search input[type="search"] {
  flex: 1;
  min-width: 0;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.55rem 0.45rem;
  font-family: var(--font-nav);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-navy-900);
}

.catalog-search input[type="search"]::placeholder {
  color: var(--color-slate-600);
  font-weight: 500;
  opacity: 0.72;
}

.catalog-search input[type="search"]:focus {
  outline: none;
}

.catalog-search input[type="search"]::-webkit-search-decoration,
.catalog-search input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.catalog-search__clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--color-slate-600);
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  cursor: pointer;
  flex-shrink: 0;
}

.catalog-search__clear:hover {
  background: rgba(15, 23, 42, 0.06);
  color: var(--color-navy-900);
}

.catalog-search__clear[hidden] {
  display: none;
}

.catalog-search__submit {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.25rem;
  padding: 0.45rem 1rem;
  margin: 0;
  border: 0;
  border-radius: 0.65rem;
  background: var(--color-navy-800);
  color: #fff;
  font-family: var(--font-nav);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition:
    background 0.2s var(--ease-out),
    transform 0.2s var(--ease-out);
}

.catalog-search__submit:hover {
  background: var(--color-navy-900);
}

.catalog-search__submit:active {
  transform: translateY(1px);
}

.courses-main__head {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
  padding: 0.5rem 0.75rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0.75rem;
  background: var(--color-white);
  box-shadow: 0 1px 3px rgba(11, 31, 58, 0.04);
}

.courses-main__head h1 {
  margin: 0;
  font-size: clamp(1.85rem, 3vw, 2.45rem);
  color: var(--color-navy-900);
  letter-spacing: -0.02em;
}

.courses-main__tools {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-left: auto;
}

.courses-main__count {
  margin: 0;
  flex-shrink: 0;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-slate-400);
  white-space: nowrap;
}

.courses-main__sort {
  display: inline-flex;
  align-items: center;
  font-size: 0.82rem;
}

.courses-main__sort select {
  min-width: 10rem;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 999px;
  background: var(--color-surface);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0.42rem 0.75rem;
  cursor: pointer;
}

.courses-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.courses-empty {
  grid-column: 1 / -1;
  margin: 0;
}

.course-card {
  display: flex;
  flex-direction: column;
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(11, 31, 58, 0.05);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), border-color 0.25s var(--ease-out);
}

.course-card:hover {
  transform: translateY(-3px);
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow: 0 16px 32px rgba(11, 31, 58, 0.1);
}

.course-card__media {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--color-navy-800);
}

.course-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform 0.45s var(--ease-out);
}

.course-card:hover .course-card__media img {
  transform: scale(1.04);
}

.course-card__badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  font-family: var(--font-nav);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-white);
  background: var(--color-navy-900);
}

.course-card__badge--microsoft {
  background: var(--color-gold-500);
  color: var(--color-navy-900);
}

.course-card__badge--leadership {
  background: #1f7a4d;
}

.course-card__badge--finance {
  background: #0f766e;
}

.course-card__badge--ai {
  background: #334155;
}

.course-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: 1.15rem 1.15rem 1.2rem;
  flex: 1;
}

.course-card__body h3 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.3;
}

.course-card__body h3 a {
  color: var(--color-navy-900);
  text-decoration: none;
  font-family: var(--font-display);
}

.course-card__body h3 a:hover {
  color: var(--color-gold-600);
}

.course-card__body > p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.92rem;
  line-height: 1.5;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.course-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.course-card__session-label {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-gold-600);
}

.course-card__schedule {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.course-card__schedule-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.course-card__level {
  flex-shrink: 0;
  font-family: var(--font-nav);
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--color-slate-600);
  text-align: right;
}

.course-card__date,
.course-card__time {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-nav);
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--color-slate-600);
}

.course-card__date svg,
.course-card__time svg {
  flex-shrink: 0;
  color: var(--color-gold-600);
}

.course-card__duration {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  justify-self: center;
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-slate-600);
  white-space: nowrap;
}

.course-card__footer {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.5rem;
  padding-top: 0.75rem;
  margin-top: auto;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.course-card__price {
  justify-self: start;
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-navy-900);
  white-space: nowrap;
}

.course-card__link {
  justify-self: end;
  font-family: var(--font-nav);
  font-size: 0.84rem;
  font-weight: 700;
  color: var(--color-gold-600);
  text-decoration: none;
  white-space: nowrap;
}

.course-card__link:hover {
  color: var(--color-navy-900);
}

.courses-pagination {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: var(--space-7);
}

.courses-page {
  display: grid;
  place-items: center;
  min-width: 2.35rem;
  height: 2.35rem;
  padding: 0 0.55rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 0.55rem;
  background: var(--color-white);
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.courses-page:hover {
  color: var(--color-navy-900);
  border-color: rgba(15, 23, 42, 0.22);
}

.courses-page.is-active {
  background: var(--color-navy-900);
  border-color: var(--color-navy-900);
  color: var(--color-white);
}

.courses-page.is-disabled {
  opacity: 0.4;
  pointer-events: none;
}

/* Schedule page */
.schedule-hero {
  position: relative;
  isolation: isolate;
  height: var(--page-hero-h);
  min-height: var(--page-hero-h);
  max-height: var(--page-hero-h);
  display: grid;
  align-items: stretch;
  color: var(--color-on-brand);
  overflow: hidden;
}

.schedule-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(105deg, rgba(11, 31, 58, 0.84) 0%, rgba(11, 31, 58, 0.58) 48%, rgba(11, 31, 58, 0.4) 100%),
    url("../images/hero-classroom-ai.jpg") center / cover no-repeat;
}

.schedule-hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.schedule-hero__content > .category-breadcrumb {
  margin-bottom: 0;
}

.schedule-hero__content > h1 {
  margin-top: auto;
}

.schedule-catalog {
  background: var(--color-white);
}

.schedule-catalog__layout {
  display: grid;
  grid-template-columns: minmax(15rem, 17.5rem) minmax(0, 1fr);
  align-items: start;
}

.schedule-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: var(--space-6) var(--space-5) var(--space-7);
  background: var(--color-surface);
  border-right: 1px solid rgba(15, 23, 42, 0.06);
  position: sticky;
  top: var(--header-h);
  align-self: start;
  max-height: calc(100vh - var(--header-h));
  overflow-y: auto;
}

.schedule-filter {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.schedule-filter__label {
  display: block;
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-slate-400);
}

.schedule-filter__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.schedule-filter__select {
  width: 100%;
  height: 2.45rem;
  padding: 0 0.75rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-navy-900);
}

.schedule-filter__select:focus {
  outline: none;
  border-color: var(--color-navy-700);
  box-shadow: 0 0 0 3px rgba(11, 31, 58, 0.08);
}

.schedule-filter__item {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
}

.schedule-filter__item input {
  margin-top: 0.15rem;
  accent-color: var(--color-navy-900);
}

.schedule-filter__item label {
  font-size: 0.92rem;
  color: var(--color-navy-900);
  line-height: 1.35;
  cursor: pointer;
}

.schedule-filter__item--disabled {
  opacity: 0.45;
  pointer-events: none;
}

.schedule-filter__item--disabled label {
  color: var(--color-slate-400);
  cursor: not-allowed;
}

.schedule-dates {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}

.schedule-dates__field {
  display: grid;
  gap: 0.35rem;
}

.schedule-dates__field label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-muted);
}

.schedule-dates__field input {
  width: 100%;
  height: 2.65rem;
  padding: 0 0.75rem;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-navy-900);
}

.schedule-dates__field input:focus {
  outline: none;
  border-color: var(--color-navy-700);
  box-shadow: 0 0 0 3px rgba(11, 31, 58, 0.08);
}

.schedule-corporate {
  margin-top: var(--space-2);
  padding: var(--space-5);
  border-radius: var(--radius-md);
  background: linear-gradient(160deg, var(--color-navy-800) 0%, var(--color-navy-900) 100%);
  color: var(--color-on-brand);
}

.schedule-corporate h2 {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
  color: var(--color-on-brand);
}

.schedule-corporate p {
  margin: 0 0 var(--space-4);
  font-size: 0.88rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.82);
}

.schedule-corporate__btn {
  width: 100%;
  justify-content: center;
}

.schedule-main {
  padding: var(--space-6) var(--space-6) var(--space-8);
  --schedule-content-width: 70%;
}

.schedule-main__head,
.schedule-notify {
  width: var(--schedule-content-width);
  margin-inline: auto;
}

.schedule-main__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-5);
  flex-wrap: wrap;
}

.schedule-main__head h2 {
  margin: 0;
  font-size: 1.45rem;
  color: var(--color-navy-900);
}

.schedule-main__count {
  margin: 0;
  font-size: 0.88rem;
  color: var(--color-muted);
}

.schedule-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: var(--schedule-content-width);
  margin-inline: auto;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.schedule-day {
  --schedule-badge-size: 5.25rem;
  display: grid;
  grid-template-columns: var(--schedule-badge-size) minmax(0, 1fr);
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-5);
  background: var(--color-white);
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.schedule-day:last-child {
  border-bottom: 0;
}

.schedule-day--alt {
  background: var(--color-surface);
}

.schedule-day__badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  width: var(--schedule-badge-size);
  height: var(--schedule-badge-size);
  flex-shrink: 0;
  padding: var(--space-2);
  border-radius: var(--radius-md);
  background: var(--color-navy-900);
  color: var(--color-white);
  text-align: center;
  align-self: center;
}

.schedule-day__day {
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.01em;
}

.schedule-day__month {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.schedule-day__year {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.72);
}

.schedule-day__sessions {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
}

.schedule-day__sessions .schedule-card + .schedule-card {
  margin-top: 0;
}

.schedule-course {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5);
  background: var(--color-white);
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.schedule-course:last-child {
  border-bottom: 0;
}

.schedule-course--alt {
  background: var(--color-surface);
}

.schedule-course__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}

.schedule-course__intro {
  min-width: 0;
}

.schedule-course__title {
  margin: 0.35rem 0 0;
  font-size: 1.05rem;
  line-height: 1.3;
  color: var(--color-navy-900);
}

.schedule-course__title a {
  color: inherit;
  text-decoration: none;
}

.schedule-course__title a:hover {
  color: var(--color-navy-700);
}

.schedule-course__summary {
  margin: 0.35rem 0 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--color-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.schedule-course__facts {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.2rem;
  flex-shrink: 0;
  text-align: right;
}

.schedule-course__price {
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-navy-900);
  white-space: nowrap;
}

.schedule-course__duration {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-muted);
  white-space: nowrap;
}

.schedule-course__sessions {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
}

.schedule-course--alt .schedule-card {
  background: #fbfcfd;
  border-color: rgba(15, 23, 42, 0.07);
}

.schedule-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto auto;
  align-items: center;
  gap: var(--space-2) var(--space-3);
  padding: 0.85rem var(--space-3);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: box-shadow 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.schedule-card__link {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
}

.schedule-card__link:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.schedule-card__link:hover ~ .schedule-card__main h3,
.schedule-card__link:hover ~ .schedule-card__main h4,
.schedule-card:has(.schedule-card__link:hover) h3,
.schedule-card:has(.schedule-card__link:hover) h4 {
  color: var(--color-navy-700);
}

.schedule-day--alt .schedule-card {
  background: #fbfcfd;
  border-color: rgba(15, 23, 42, 0.07);
}

.schedule-card:hover {
  border-color: rgba(15, 23, 42, 0.14);
  box-shadow: var(--shadow-md);
  cursor: pointer;
}

.schedule-card__main {
  position: relative;
  z-index: 0;
  min-width: 0;
  pointer-events: none;
}

.schedule-card__head {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.schedule-card__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.schedule-card__cat {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: var(--color-surface-alt);
  font-family: var(--font-nav);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-muted);
}

.schedule-card__hrd {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: rgba(31, 122, 77, 0.1);
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--color-success);
}

.schedule-card__main h3,
.schedule-card__main h4 {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.25;
  color: var(--color-navy-900);
  transition: color 0.2s var(--ease-out);
}

.schedule-card--session {
  grid-template-columns: minmax(0, 1fr) auto;
}

.schedule-card__summary {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--color-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  pointer-events: none;
}

.schedule-card__duration,
.schedule-card__range {
  position: relative;
  z-index: 0;
  pointer-events: none;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-muted);
  white-space: nowrap;
}

.schedule-card__range {
  color: var(--color-slate-600);
}

.schedule-card__price {
  position: relative;
  z-index: 0;
  pointer-events: none;
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-navy-900);
  white-space: nowrap;
}

.schedule-card__enquire {
  position: relative;
  z-index: 1;
  pointer-events: auto;
  min-width: 5.75rem;
  padding-inline: 0.85rem;
  justify-content: center;
  white-space: nowrap;
}


.schedule-empty {
  margin: 0;
  padding: var(--space-6);
  text-align: center;
  color: var(--color-muted);
  background: var(--color-surface);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-md);
}

.schedule-notify {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--space-4);
  margin-top: var(--space-6);
  padding: var(--space-5) var(--space-5);
  background: var(--color-surface);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-md);
}

.schedule-notify__icon {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: rgba(11, 31, 58, 0.06);
  color: var(--color-navy-700);
}

.schedule-notify__copy h3 {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  color: var(--color-navy-900);
}

.schedule-notify__copy p {
  margin: 0;
  font-size: 0.88rem;
  color: var(--color-muted);
}

.schedule-benefits {
  background: var(--color-surface);
}

.schedule-benefits__head {
  text-align: center;
  margin-bottom: var(--space-6);
}

.schedule-benefits__head h2 {
  margin: 0 0 var(--space-3);
}

.rule--center {
  margin-inline: auto;
}

.schedule-benefits__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0;
}

.schedule-benefit {
  text-align: center;
  padding: var(--space-5);
}

.schedule-benefit__icon {
  display: grid;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  margin: 0 auto var(--space-3);
  border-radius: 50%;
  background: rgba(230, 180, 34, 0.14);
  color: var(--color-gold-600);
}

.schedule-benefit h3 {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
}

.schedule-benefit p {
  margin: 0;
  font-size: 0.92rem;
  color: var(--color-muted);
  line-height: 1.5;
}


.feature {
  text-align: left;
  padding: var(--space-5);
  background: var(--color-white);
  border-top: 3px solid var(--color-accent);
  border-radius: 0 var(--radius-md) var(--radius-md) var(--radius-md);
  box-shadow: var(--shadow-sm);
}

.feature h3 {
  margin-bottom: var(--space-2);
}

.feature p {
  color: var(--color-muted);
}

.quote-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
}

.quote-card blockquote {
  margin: 0 0 var(--space-4);
  font-size: 1.05rem;
  color: var(--color-ink);
}

.quote-card figcaption {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  font-size: 0.875rem;
  color: var(--color-muted);
}

.avatar {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--color-navy-700) center / cover;
  flex-shrink: 0;
}

/* Testimonials bento page */
.testimonials-page {
  padding-top: calc(var(--header-h) + var(--space-7));
  padding-bottom: var(--space-8);
  background:
    radial-gradient(ellipse 80% 50% at 10% 0%, rgba(230, 180, 34, 0.08), transparent 55%),
    radial-gradient(ellipse 60% 40% at 90% 20%, rgba(18, 48, 86, 0.06), transparent 50%),
    var(--color-surface);
}

.testimonials-page__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
}

.testimonials-filters {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.3rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: var(--shadow-sm);
}

.testimonials-filters__btn {
  appearance: none;
  border: 0;
  margin: 0;
  padding: 0.55rem 1rem;
  border-radius: 999px;
  background: transparent;
  color: var(--color-slate-600);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.testimonials-filters__btn:hover {
  color: var(--color-navy-900);
}

.testimonials-filters__btn.is-active {
  background: var(--color-navy-900);
  color: var(--color-white);
}

.testimonials-category {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}

.testimonials-category__label {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-slate-600);
  white-space: nowrap;
}

.testimonials-category__control {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 13.5rem;
}

.testimonials-category__control select {
  appearance: none;
  width: 100%;
  margin: 0;
  padding: 0.55rem 2.35rem 0.55rem 1rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.testimonials-category__control select:hover {
  border-color: rgba(15, 23, 42, 0.16);
}

.testimonials-category__control select:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.testimonials-category__chevron {
  position: absolute;
  right: 0.9rem;
  top: 50%;
  color: var(--color-navy-800);
  pointer-events: none;
  transform: translateY(-50%);
}

.testimonials-bento {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: dense;
  gap: 1.1rem;
}

.t-card {
  position: relative;
  display: flex;
  flex-direction: column;
  grid-column: span 4;
  margin: 0;
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1.35rem;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.06);
  transition: transform 0.28s var(--ease-out), box-shadow 0.28s var(--ease-out);
}

.t-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px rgba(11, 31, 58, 0.12);
}

.t-card--featured {
  grid-column: span 8;
  grid-row: span 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(11, 31, 58, 0.22);
}

.t-card--featured:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 44px rgba(11, 31, 58, 0.28);
}

.t-card--featured .t-card__watermark {
  position: absolute;
  top: -0.2rem;
  right: 0.85rem;
  font-family: var(--font-display);
  font-size: clamp(5rem, 9vw, 7rem);
  font-weight: 700;
  line-height: 0.8;
  color: rgba(230, 180, 34, 0.16);
  pointer-events: none;
  user-select: none;
}

.t-card__body--featured {
  position: relative;
  z-index: 1;
  gap: 0.85rem;
  padding: 1.35rem 1.5rem 1.4rem;
  max-width: none;
}

.t-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.9rem;
}

.t-card__stars {
  display: inline-flex;
  gap: 0.12rem;
  color: var(--color-accent);
}

.t-card--featured .t-card__course {
  margin: 0;
}

.t-card.t-card--featured.t-card--navy blockquote {
  flex: 0 1 auto;
  font-size: clamp(1rem, 1.55vw, 1.15rem);
  line-height: 1.55;
  max-width: none;
}

.t-card__person--inline {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.15rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.t-card__person--inline .t-card__avatar {
  width: 2.6rem;
  height: 2.6rem;
  border: 2px solid rgba(230, 180, 34, 0.55);
  box-shadow: none;
}

.t-card__person--inline > span:last-child {
  display: grid;
  gap: 0.08rem;
}

.t-card__person--inline > span:last-child span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.8rem;
}

.t-card--navy {
  background:
    linear-gradient(155deg, rgba(230, 180, 34, 0.14) 0%, transparent 38%),
    linear-gradient(180deg, var(--color-navy-800), var(--color-navy-900));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 16px 34px rgba(11, 31, 58, 0.18);
}

.t-card--navy:hover {
  box-shadow: 0 20px 40px rgba(11, 31, 58, 0.26);
}

.t-card--wide {
  grid-column: span 8;
}

.t-card--tall {
  grid-column: span 4;
  grid-row: span 2;
}

.t-card--navy .t-card__media--quote {
  background: transparent;
}

.t-card--navy .t-card__avatar {
  border: 2px solid rgba(230, 180, 34, 0.55);
}

.t-card--navy .t-card__mark {
  color: rgba(230, 180, 34, 0.4);
}

.t-card--navy .t-card__course,
.t-card.t-card--navy .t-card__course {
  color: var(--color-accent);
}

.t-card--navy blockquote,
.t-card.t-card--navy blockquote {
  color: #fff;
}

.t-card--navy .t-card__person strong,
.t-card.t-card--navy .t-card__person strong {
  color: #fff;
}

.t-card--navy .t-card__person span,
.t-card.t-card--navy .t-card__person span {
  color: rgba(255, 255, 255, 0.78);
}

.t-card--tall .t-card__media--video {
  flex: 1 1 auto;
  min-height: 14rem;
  aspect-ratio: auto;
}

.t-card__media {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--color-navy-900);
  overflow: hidden;
}

.t-card__media--video {
  aspect-ratio: 16 / 10;
  cursor: pointer;
}

.t-card__media--video img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s var(--ease-out);
}

.t-card:hover .t-card__media--video img {
  transform: scale(1.04);
}

.t-card__media--video::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(11, 31, 58, 0.45) 100%);
  pointer-events: none;
}

.t-card__play {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  margin: -1.625rem 0 0 -1.625rem;
  border-radius: 50%;
  background: var(--color-accent);
  color: var(--color-navy-900);
  box-shadow: 0 10px 24px rgba(11, 31, 58, 0.28);
  transition: transform 0.25s var(--ease-out), background 0.25s var(--ease-out);
}

.t-card__media--video:hover .t-card__play,
.t-card__media--video:focus-visible .t-card__play {
  transform: scale(1.08);
  background: #f0c84a;
}

.t-card__media--quote {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: 6.5rem;
  padding: 1.25rem 1.35rem 0.5rem;
  background:
    linear-gradient(135deg, rgba(230, 180, 34, 0.12), transparent 60%),
    var(--color-surface-alt);
}

.t-card__avatar {
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 50%;
  background: var(--color-navy-700) center / cover;
  flex-shrink: 0;
  box-shadow: 0 6px 16px rgba(11, 31, 58, 0.15);
}

.t-card__mark {
  font-family: var(--font-display);
  font-size: 5rem;
  font-weight: 700;
  line-height: 0.75;
  color: rgba(230, 180, 34, 0.45);
  user-select: none;
}

.t-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1 1 auto;
  padding: 1.15rem 1.35rem 1.35rem;
}

.t-card--video .t-card__body {
  padding-top: 1rem;
}

.t-card__course {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-gold-600);
}

.t-card blockquote {
  margin: 0;
  flex: 1 1 auto;
  font-family: var(--font-display);
  font-size: clamp(0.98rem, 1.4vw, 1.12rem);
  font-weight: 500;
  line-height: 1.55;
  color: var(--color-ink);
}

.t-card.t-card--navy,
.t-card.t-card--navy .t-card__body,
.t-card.t-card--navy blockquote,
.t-card.t-card--navy .t-card__person strong {
  color: #ffffff;
}

.t-card.t-card--navy .t-card__course {
  color: var(--color-accent);
}

.t-card.t-card--navy .t-card__person span {
  color: rgba(255, 255, 255, 0.78);
}

.t-card.t-card--featured.t-card--navy blockquote {
  font-size: clamp(1.2rem, 2.2vw, 1.55rem);
}

.t-card__person {
  display: grid;
  gap: 0.15rem;
  margin-top: auto;
  padding-top: 0.35rem;
}

.t-card__person strong {
  font-family: var(--font-nav);
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--color-navy-900);
}

.t-card__person span {
  font-size: 0.82rem;
  color: var(--color-muted);
  line-height: 1.35;
}

.testimonials-empty {
  margin: var(--space-6) 0 0;
  text-align: center;
  color: var(--color-muted);
}

.testimonials-cta {
  padding: var(--space-8) 0;
  background: var(--color-white);
  color: var(--color-ink);
}

.testimonials-cta__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
}

.testimonials-cta h2 {
  margin: 0 0 var(--space-2);
  color: var(--color-ink);
}

.testimonials-cta p {
  margin: 0;
  max-width: 32rem;
  color: var(--color-muted);
}

.testimonials-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

/* Testimonial video lightbox */
.t-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: var(--space-5);
}

.t-lightbox[hidden] {
  display: none;
}

.t-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 21, 37, 0.78);
  backdrop-filter: blur(4px);
}

.t-lightbox__dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 56rem);
  border-radius: 1rem;
  overflow: hidden;
  background: #000;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

.t-lightbox__frame {
  position: relative;
  aspect-ratio: 16 / 9;
  background: #000;
}

.t-lightbox__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.t-lightbox__close {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  z-index: 2;
  width: 2.4rem;
  height: 2.4rem;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-navy-900);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: var(--shadow-md);
}

.t-lightbox__close:hover {
  background: var(--color-accent);
}

body.t-lightbox-open {
  overflow: hidden;
}

/* Our clients */
.clients {
  padding-top: var(--space-7);
  padding-bottom: var(--space-8);
  background: linear-gradient(160deg, #071525 0%, #0b1f3a 55%, #123056 100%);
  color: var(--color-on-brand);
  overflow: hidden;
}

.clients__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 40rem;
  margin: 0 auto var(--space-6);
  text-align: center;
}

.clients__head .rule {
  width: 3rem;
  height: 3px;
  margin: 0 0 var(--space-4);
  border: 0;
  background: var(--color-accent);
}

.clients__head h2 {
  margin-bottom: var(--space-3);
  color: var(--color-white);
  font-size: clamp(1.75rem, 3vw, 2.35rem);
}

.clients__head .lead {
  margin: 0;
  max-width: 34rem;
  color: rgba(255, 255, 255, 0.72);
}

.clients__rows {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.clients__marquee {
  position: relative;
  width: 100%;
  mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

.clients__track {
  display: flex;
  width: max-content;
  gap: 0;
}

.clients__marquee--left .clients__track {
  animation: clients-marquee-left 100s linear infinite;
}

.clients__marquee--right .clients__track {
  animation: clients-marquee-right 100s linear infinite;
}

.clients__list {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0 var(--space-3);
}

.clients__item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.clients__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(11.5rem, 18vw, 14.5rem);
  height: clamp(11.5rem, 18vw, 14.5rem);
  padding: 0.5rem;
  border-radius: 1.25rem;
  background: var(--color-white);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
}

.clients__logo img {
  display: block;
  width: 92%;
  height: auto;
  max-height: 92%;
  object-fit: contain;
  object-position: center;
}

@keyframes clients-marquee-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@keyframes clients-marquee-right {
  from {
    transform: translateX(-50%);
  }
  to {
    transform: translateX(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .clients__track {
    animation: none !important;
    flex-wrap: wrap;
    width: min(100% - 2.5rem, var(--content-max));
    margin-inline: auto;
    justify-content: center;
  }

  .clients__list[aria-hidden="true"] {
    display: none;
  }
}

/* Why Choose CAD Training — trust logos + team CTA */
.why-choose {
  position: relative;
  background:
    linear-gradient(135deg, rgba(11, 31, 58, 0.04) 0%, transparent 48%),
    var(--color-white);
  color: var(--color-ink);
  overflow: hidden;
}

.why-choose__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: clamp(var(--space-6), 5vw, var(--space-8));
  align-items: center;
}

.why-choose__logos {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  text-align: center;
}

.why-choose__trust {
  margin: 0;
  color: var(--color-navy-800);
  font-family: var(--font-nav);
  font-size: clamp(0.9rem, 1.35vw, 1.05rem);
  font-weight: 600;
  line-height: 1.45;
  max-width: none;
  white-space: nowrap;
  margin-inline: auto;
}

.why-choose__clients {
  margin: 0;
}

.why-choose__clients img {
  display: block;
  width: 100%;
  height: auto;
}

.why-choose__cta {
  max-width: 36rem;
}

.why-choose__eyebrow {
  margin: 0 0 var(--space-3);
  color: var(--color-navy-700);
  font-family: var(--font-nav);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.why-choose__cta h2 {
  margin: 0 0 var(--space-4);
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: clamp(2.15rem, 4.2vw, 3.25rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.why-choose__lead {
  margin: 0 0 var(--space-6);
  color: var(--color-muted);
  font-size: clamp(1.125rem, 1.85vw, 1.35rem);
  line-height: 1.55;
}

.why-choose__btn {
  min-height: 3.15rem;
  padding: 0.9rem 1.85rem;
  font-family: var(--font-nav);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 999px;
  box-shadow: 0 10px 28px rgba(230, 180, 34, 0.28);
  transition:
    background 0.2s var(--ease-out),
    color 0.2s var(--ease-out),
    border-color 0.2s var(--ease-out),
    transform 0.25s var(--ease-out),
    box-shadow 0.25s var(--ease-out);
}

.why-choose__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(230, 180, 34, 0.4);
}

.why-choose__btn:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

@media (max-width: 900px) {
  .why-choose__grid {
    grid-template-columns: 1fr;
    gap: var(--space-7);
  }

  .why-choose__trust {
    white-space: normal;
    max-width: 28rem;
  }

  .why-choose__cta {
    max-width: none;
    text-align: center;
  }

  .why-choose__cta .why-choose__btn {
    margin-inline: auto;
  }
}

/* Student success — featured quote + sidebar stack */
.success {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(ellipse 55% 60% at 16% 38%, rgba(90, 168, 255, 0.08), transparent 68%),
    radial-gradient(ellipse 50% 55% at 84% 22%, rgba(230, 180, 34, 0.06), transparent 65%),
    radial-gradient(ellipse 60% 50% at 72% 90%, rgba(56, 120, 220, 0.07), transparent 68%),
    linear-gradient(165deg, #071526 0%, var(--color-navy-900) 42%, #0a1a30 100%);
  color: var(--color-on-brand);
  padding-top: var(--space-7);
  padding-bottom: var(--space-7);
}

/* Soft ambient glow — barely-there light blooms */
.success::before,
.success::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  filter: blur(100px);
}

.success::before {
  width: min(58vw, 42rem);
  height: min(58vw, 42rem);
  top: -22%;
  left: -12%;
  background:
    radial-gradient(circle at 40% 40%, rgba(120, 190, 255, 0.28) 0%, rgba(56, 130, 230, 0.08) 48%, transparent 72%);
  opacity: 0.35;
}

.success::after {
  width: min(54vw, 38rem);
  height: min(54vw, 38rem);
  right: -14%;
  bottom: -26%;
  background:
    radial-gradient(circle at 55% 45%, rgba(230, 180, 34, 0.2) 0%, rgba(180, 140, 40, 0.06) 50%, transparent 74%);
  opacity: 0.3;
}

.success > .container {
  position: relative;
  z-index: 1;
}

.success__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-3) var(--space-5);
  margin-bottom: var(--space-5);
}

.success__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
}

.success__filters {
  margin: 0;
}

.success__select {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}

.success__select-label {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
  white-space: nowrap;
}

.success__select-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 13.5rem;
}

.success__select-control select {
  appearance: none;
  width: 100%;
  margin: 0;
  padding: 0.65rem 2.35rem 0.65rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.success__select-control select:hover {
  border-color: rgba(255, 255, 255, 0.4);
}

.success__select-control select:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.success__select-chevron {
  position: absolute;
  right: 0.9rem;
  top: 50%;
  color: var(--color-navy-800);
  pointer-events: none;
  transform: translateY(-50%);
}

.success__link {
  display: inline-block;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.success__link:hover {
  color: var(--color-white);
  border-bottom-color: rgba(255, 255, 255, 0.55);
}

.success__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: var(--space-6) var(--space-7);
  align-items: stretch;
}

.success__layout[hidden] {
  display: none;
}

.success__featured {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-self: start;
  gap: var(--space-5);
  margin: 0;
  padding: var(--space-6) var(--space-6) var(--space-5);
  border-left: 3px solid var(--color-gold-500);
  background: linear-gradient(160deg, #ffffff 0%, #f3f6fa 100%);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22);
}

.success__featured:only-child {
  max-width: 42rem;
}

.success__featured-mark {
  position: absolute;
  top: 0.15rem;
  right: 1.1rem;
  font-family: var(--font-display);
  font-size: clamp(4.5rem, 8vw, 6.5rem);
  font-weight: 700;
  line-height: 1;
  color: rgba(230, 180, 34, 0.22);
  pointer-events: none;
  user-select: none;
}

.success__featured-stars {
  display: inline-flex;
  gap: 0.15rem;
  color: var(--color-accent);
}

.success__featured blockquote {
  position: relative;
  z-index: 1;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 2.2vw, 1.55rem);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-ink);
}

.success__featured figcaption {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding-top: var(--space-4);
  border-top: 1px solid rgba(15, 23, 42, 0.1);
}

.success__featured .avatar {
  width: 3.25rem;
  height: 3.25rem;
  flex-shrink: 0;
  border: 2px solid rgba(230, 180, 34, 0.55);
}

.success__featured figcaption strong {
  display: block;
  font-family: var(--font-nav);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-navy-900);
}

.success__featured figcaption em {
  display: block;
  margin-top: 0.15rem;
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-style: normal;
  color: var(--color-muted);
}

.success__featured-course {
  display: block;
  margin-top: 0.35rem;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-navy-700);
}

.success__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--space-4);
}

.success__item {
  margin: 0;
  padding: var(--space-4) var(--space-4) var(--space-4) var(--space-5);
  border-left: 2px solid rgba(230, 180, 34, 0.55);
  background: rgba(255, 255, 255, 0.08);
}

.success__item blockquote {
  margin: 0 0 var(--space-3);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.9);
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.success__item figcaption {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}

.success__item .avatar {
  width: 2.35rem;
  height: 2.35rem;
  flex-shrink: 0;
}

.success__item figcaption strong {
  display: block;
  font-family: var(--font-nav);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--color-white);
}

.success__item figcaption em {
  display: block;
  margin-top: 0.1rem;
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-style: normal;
  color: rgba(255, 255, 255, 0.62);
}

.success__empty {
  margin: var(--space-5) 0 0;
  color: rgba(255, 255, 255, 0.68);
}

@media (max-width: 900px) {
  .success__head {
    justify-content: flex-start;
  }

  .success__actions {
    width: 100%;
  }

  .success__select {
    width: 100%;
  }

  .success__select-control {
    flex: 1;
    min-width: 0;
  }

  .success__layout {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .success__featured {
    padding: var(--space-5);
  }
}

/* Tables */
.table-wrap {
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-white);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
}

th,
td {
  padding: var(--space-3) var(--space-4);
  text-align: left;
  border-bottom: 1px solid var(--color-border);
}

th {
  background: var(--color-brand);
  color: var(--color-on-brand);
  font-weight: 600;
}

tbody tr:nth-child(even) {
  background: var(--color-surface-alt);
}

tbody tr:last-child td {
  border-bottom: 0;
}

.badge {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 700;
  background: rgba(230, 180, 34, 0.2);
  color: var(--color-navy-900);
}

.badge--open {
  background: rgba(31, 122, 77, 0.15);
  color: var(--color-success);
}

.badge--full {
  background: rgba(180, 35, 24, 0.12);
  color: var(--color-error);
}

/* Forms */
.form {
  display: grid;
  gap: var(--space-4);
}

.form-row {
  display: grid;
  gap: var(--space-2);
}

.form-row label {
  font-weight: 600;
}

.form-row input,
.form-row select,
.form-row textarea {
  font: inherit;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  color: var(--color-ink);
  width: 100%;
}

.form-row textarea {
  min-height: 8rem;
  resize: vertical;
}

.form-row input:focus-visible,
.form-row select:focus-visible,
.form-row textarea:focus-visible {
  outline: 2px solid var(--color-navy-700);
  outline-offset: 1px;
  border-color: var(--color-navy-700);
}

.form-row input.is-invalid,
.form-row select.is-invalid,
.form-row textarea.is-invalid {
  border-color: var(--color-error);
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.14);
}

.form-row input.is-invalid:focus-visible,
.form-row select.is-invalid:focus-visible,
.form-row textarea.is-invalid:focus-visible {
  outline-color: var(--color-error);
  border-color: var(--color-error);
}

.form-row:has(.is-invalid) > label {
  color: var(--color-error);
}

.form-message {
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-sm);
  font-weight: 600;
}

.form-message--ok {
  background: rgba(31, 122, 77, 0.12);
  color: var(--color-success);
}

.form-message--err {
  background: rgba(180, 35, 24, 0.1);
  color: var(--color-error);
}

/* About page */
.about-hero {
  position: relative;
  isolation: isolate;
  height: var(--page-hero-h);
  min-height: var(--page-hero-h);
  max-height: var(--page-hero-h);
  display: grid;
  align-items: stretch;
  color: var(--color-white);
  overflow: hidden;
}

.about-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(105deg, rgba(11, 31, 58, 0.8) 0%, rgba(11, 31, 58, 0.48) 48%, rgba(11, 31, 58, 0.3) 100%),
    url("../images/about-hero-ai.jpg") center / cover no-repeat;
}

.about-hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.about-hero__content > .category-breadcrumb {
  margin-bottom: 0;
}

.about-hero__content > h1 {
  margin-top: auto;
}

.about-story {
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  background: var(--color-white);
}

.about-story__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(var(--space-6), 4vw, var(--space-8));
  align-items: center;
}

.about-story__copy .rule {
  width: 2.75rem;
  height: 3px;
  margin: 0 0 var(--space-4);
  border: 0;
  background: var(--color-accent);
}

.about-story__copy h2 {
  margin-bottom: var(--space-4);
  font-size: clamp(1.75rem, 3vw, 2.35rem);
}

.about-story__copy h3 {
  margin: var(--space-5) 0 var(--space-3);
  font-family: inherit;
  font-size: inherit;
  font-weight: 400;
  color: var(--color-muted);
}

.about-story__copy p {
  color: var(--color-muted);
  max-width: 36rem;
}

.about-story__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.about-story__stat-value {
  margin: 0 0 0.2rem;
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.5vw, 1.9rem);
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--color-navy-900);
}

.about-story__stat-label {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-slate-600);
}

.about-story__media {
  margin: 0;
  border-radius: 1.15rem;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(11, 31, 58, 0.14);
  background: var(--color-navy-800);
}

.about-story__media-stack {
  position: relative;
  display: grid;
  gap: var(--space-4);
}

.about-story__media--inset {
  width: min(78%, 22rem);
  margin-left: auto;
  margin-top: -3.5rem;
  border: 4px solid var(--color-white);
  box-shadow: 0 16px 36px rgba(11, 31, 58, 0.18);
  transition: transform 0.35s var(--ease-out);
}

.about-story__media-stack:hover .about-story__media--inset {
  transform: translateY(-0.35rem);
}

.about-story__media img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.55s var(--ease-out);
}

.about-story__media-stack:hover .about-story__media:first-child img {
  transform: scale(1.03);
}

.about-story__media--inset img {
  aspect-ratio: 16 / 9;
}

.about-toc {
  --toc-width: min(calc(100% - var(--float-inset)), var(--content-max));
  position: sticky;
  top: var(--header-h);
  z-index: 90;
  width: var(--toc-width);
  margin-top: 0;
  margin-bottom: var(--space-4);
  margin-inline: auto;
}

.about-toc.is-stuck {
  top: var(--header-h);
}

.about-toc__inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding: 0.45rem;
  overflow-x: auto;
  scrollbar-width: thin;
  background: rgba(255, 252, 247, 0.94);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0 0 var(--float-radius) var(--float-radius);
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.about-toc.is-stuck .about-toc__inner {
  border-top-color: transparent;
  box-shadow: 0 14px 36px rgba(11, 31, 58, 0.14);
}

.about-toc__link {
  flex: 0 0 auto;
  padding: 0.55rem 0.95rem;
  border-radius: 999px;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-slate-600);
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.about-toc__link:hover {
  color: var(--color-navy-900);
  background: rgba(15, 23, 42, 0.05);
}

.about-toc__link.is-active {
  color: var(--color-navy-900);
  background: rgba(230, 180, 34, 0.22);
}

.about-toc__top {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  border-radius: 999px;
  color: var(--color-navy-900);
  background: rgba(230, 180, 34, 0.22);
  text-decoration: none;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.about-toc__top:hover,
.about-toc__top:focus-visible {
  color: var(--color-navy-900);
  background: rgba(230, 180, 34, 0.38);
}

.about-toc__top:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.about-toc__top svg {
  display: block;
}

.about-approach {
  background: var(--color-surface);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.about-pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0;
}

.about-pillars--wide {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.about-pillar {
  padding: var(--space-5);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-top: 3px solid var(--color-accent);
  border-radius: 0 0.85rem 0.85rem 0.85rem;
  box-shadow: var(--shadow-sm);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.about-pillar:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 28px rgba(11, 31, 58, 0.1);
}

.about-pillar__icon {
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  margin-bottom: var(--space-4);
  border-radius: 999px;
  background: rgba(230, 180, 34, 0.14);
  color: var(--color-gold-600);
  transition: transform 0.25s var(--ease-out), background 0.25s var(--ease-out);
}

.about-pillar:hover .about-pillar__icon {
  transform: scale(1.08);
  background: rgba(230, 180, 34, 0.28);
}

.about-pillar h3 {
  margin: 0 0 var(--space-2);
  font-size: 1.1rem;
}

.about-pillar p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.95rem;
}

.about-credentials {
  background:
    radial-gradient(ellipse 50% 60% at 90% 10%, rgba(230, 180, 34, 0.08), transparent 70%),
    var(--color-surface);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.about-credentials__bento {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "intro hrd cidb"
    "intro mof autodesk";
  gap: 0.9rem;
}

.cred-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: 1rem;
  border-radius: 1.25rem;
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.05);
  overflow: hidden;
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.cred-tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(11, 31, 58, 0.1);
}

.cred-tile--intro {
  grid-area: intro;
  justify-content: flex-start;
  gap: var(--space-4);
  padding: clamp(1.35rem, 2.4vw, 1.85rem);
  background:
    linear-gradient(160deg, rgba(230, 180, 34, 0.12) 0%, transparent 42%),
    linear-gradient(180deg, var(--color-navy-800), var(--color-navy-900));
  border-color: transparent;
  color: var(--color-white);
  min-height: 22rem;
  box-shadow: 0 18px 40px rgba(11, 31, 58, 0.22);
}

.cred-tile--intro:hover {
  transform: none;
  box-shadow: 0 18px 40px rgba(11, 31, 58, 0.22);
}

.cred-tile__eyebrow {
  margin: 0 0 var(--space-4);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.cred-tile--intro h2 {
  margin: 0 0 var(--space-4);
  color: var(--color-white);
  font-size: clamp(1.7rem, 2.8vw, 2.25rem);
  line-height: 1.15;
  max-width: 10ch;
}

.cred-tile--intro p {
  margin: 0 0 var(--space-4);
  color: rgba(255, 255, 255, 0.78);
  max-width: 28rem;
  font-size: 0.98rem;
  line-height: 1.6;
}

.cred-tile--intro p:last-child {
  margin-bottom: 0;
}

.cred-tile--hrd { grid-area: hrd; }
.cred-tile--cidb { grid-area: cidb; }
.cred-tile--mof { grid-area: mof; }
.cred-tile--autodesk { grid-area: autodesk; }

.cred-tile__logo {
  display: grid;
  place-items: center;
  flex: 1 1 auto;
  width: 100%;
  min-height: 9.5rem;
  padding: 1.35rem 1.1rem;
  background: #fff;
  border-radius: 0.95rem;
  border: 1px solid rgba(15, 23, 42, 0.05);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6);
}

.cred-tile__logo img {
  width: auto;
  max-width: min(100%, 12rem);
  height: 5.75rem;
  object-fit: contain;
  filter: contrast(1.05);
}

.cred-tile--autodesk .cred-tile__logo img {
  max-width: min(100%, 15rem);
  height: 4.25rem;
}

.cred-tile__body {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  padding: 0 0.15rem 0.15rem;
}

.cred-tile__body h3 {
  margin: 0;
  font-size: 0.98rem;
  color: var(--color-navy-900);
}

.cred-tile__body p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.about-cta {
  background: var(--color-white);
  color: var(--color-ink);
  padding: var(--space-8) 0;
}

.about-cta__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  flex-wrap: wrap;
}

.about-cta h2 {
  margin: 0 0 var(--space-3);
  color: var(--color-ink);
  font-size: clamp(1.65rem, 3vw, 2.2rem);
}

.about-cta p {
  margin: 0;
  max-width: 34rem;
  color: var(--color-muted);
}

.about-cta .btn--secondary {
  color: var(--color-brand);
  border-color: var(--color-brand);
}

.about-cta .btn--secondary:hover {
  background: var(--color-brand);
  color: var(--color-on-brand);
  border-color: var(--color-brand);
}


.about-journey {
  background: var(--color-white);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.about-journey__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(var(--space-6), 4vw, var(--space-8));
  align-items: start;
}

.about-journey__visual {
  margin: 0;
  position: sticky;
  top: calc(var(--header-h) + 5.5rem);
}

.about-journey__visual img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 1rem;
  box-shadow: 0 16px 36px rgba(11, 31, 58, 0.14);
  transition: opacity 0.28s var(--ease-out), transform 0.28s var(--ease-out);
}

.about-journey__visual figcaption {
  margin-top: var(--space-3);
  font-size: 0.88rem;
  color: var(--color-muted);
  transition: opacity 0.28s var(--ease-out);
}

.about-journey__visual.is-swapping img,
.about-journey__visual.is-swapping figcaption {
  opacity: 0;
}

.about-journey__visual.is-swapping img {
  transform: translateY(0.4rem);
}

@media (prefers-reduced-motion: reduce) {
  .about-journey__visual img,
  .about-journey__visual figcaption {
    transition: none;
  }

  .about-journey__visual.is-swapping img {
    transform: none;
  }
}

.about-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
  border-left: 2px solid rgba(230, 180, 34, 0.45);
  margin-left: 0.35rem;
}

.about-timeline__item {
  padding: 0.35rem 0 0.35rem var(--space-5);
  position: relative;
}

.about-timeline__item::before {
  content: "";
  position: absolute;
  left: -0.42rem;
  top: 1.35rem;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  background: rgba(230, 180, 34, 0.45);
  box-shadow: 0 0 0 4px var(--color-white);
  transition: background 0.2s var(--ease-out), transform 0.2s var(--ease-out);
}

.about-timeline__item.is-active::before {
  background: var(--color-accent);
  transform: scale(1.15);
}

.about-timeline__trigger {
  display: flex;
  align-items: baseline;
  gap: var(--space-4);
  width: 100%;
  padding: var(--space-4) var(--space-4) var(--space-4) 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
}

.about-timeline__trigger:hover .about-timeline__heading,
.about-timeline__item.is-active .about-timeline__heading {
  color: var(--color-navy-900);
}

.about-timeline__year {
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-gold-600);
  letter-spacing: 0.04em;
  min-width: 3.5rem;
  flex-shrink: 0;
}

.about-timeline__heading {
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-slate-600);
  transition: color 0.2s var(--ease-out);
}

.about-timeline__body {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.35s var(--ease-out), opacity 0.25s var(--ease-out), margin 0.25s var(--ease-out);
  margin: 0;
}

.about-timeline__item.is-active .about-timeline__body {
  max-height: 8rem;
  opacity: 1;
  margin: 0 0 var(--space-4);
}

.about-timeline__body p {
  margin: 0;
  padding-right: var(--space-4);
  color: var(--color-muted);
  max-width: 36rem;
}

.about-values {
  background: var(--color-surface);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.about-values__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0;
}

.about-value {
  padding: var(--space-5);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1rem;
  transition: transform 0.25s var(--ease-out), border-color 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.about-value:hover {
  transform: translateY(-4px);
  border-color: rgba(230, 180, 34, 0.45);
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.08);
}

.about-value__num {
  display: block;
  margin-bottom: var(--space-3);
  font-family: var(--font-display);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--color-gold-600);
}

.about-value h3 {
  margin: 0 0 var(--space-2);
  font-size: 1.05rem;
}

.about-value p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.92rem;
}

.about-values__grid > .about-value:nth-child(7) {
  grid-column: 2;
}

.about-formats {
  background: var(--color-white);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.about-formats__interactive {
  display: grid;
  gap: var(--space-5);
}

.about-formats__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  padding: 0.4rem;
  background: var(--color-surface);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 999px;
  width: fit-content;
  max-width: 100%;
}

.about-formats__tab {
  border: 0;
  background: transparent;
  padding: 0.7rem 1.15rem;
  border-radius: 999px;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-slate-600);
  cursor: pointer;
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.about-formats__tab:hover {
  color: var(--color-navy-900);
}

.about-formats__tab.is-active {
  background: var(--color-navy-900);
  color: var(--color-white);
}

.about-formats__panel {
  display: none;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: clamp(var(--space-5), 3vw, var(--space-7));
  align-items: center;
  animation: about-panel-in 0.35s var(--ease-out);
}

.about-formats__panel.is-active {
  display: grid;
}

.about-formats__media {
  margin: 0;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 16px 36px rgba(11, 31, 58, 0.14);
}

.about-formats__media img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform 0.5s var(--ease-out);
}

.about-formats__panel.is-active .about-formats__media img {
  transform: scale(1.01);
}

.about-formats__copy h3 {
  margin: 0 0 var(--space-3);
  font-size: 1.35rem;
}

.about-formats__copy p {
  margin: 0 0 var(--space-4);
  color: var(--color-muted);
}

.about-formats__copy ul {
  margin: 0 0 var(--space-5);
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.5rem;
}

.about-formats__copy li {
  font-size: 0.92rem;
  color: var(--color-slate-600);
  padding-left: 1.1rem;
  position: relative;
}

.about-formats__copy li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 50%;
  background: var(--color-accent);
}

@keyframes about-panel-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.about-path {
  background:
    radial-gradient(ellipse 60% 50% at 100% 0%, rgba(230, 180, 34, 0.08), transparent 55%),
    var(--color-surface);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.about-path__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-4);
}

.about-path__step {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1rem;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  outline: none;
  transition: transform 0.25s var(--ease-out), border-color 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.about-path__step:hover,
.about-path__step:focus-visible,
.about-path__step.is-active {
  transform: translateY(-4px);
  border-color: rgba(230, 180, 34, 0.5);
  box-shadow: 0 14px 28px rgba(11, 31, 58, 0.1);
}

.about-path__step.is-active .about-path__marker {
  background: var(--color-accent);
  color: var(--color-navy-900);
}

.about-path__marker {
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  background: var(--color-navy-900);
  color: var(--color-accent);
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 700;
  flex-shrink: 0;
  transition: background 0.25s var(--ease-out), color 0.25s var(--ease-out);
}

.about-path__step h3 {
  margin: 0 0 var(--space-2);
  font-size: 1rem;
}

.about-path__step p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.about-industries {
  background: var(--color-navy-900);
  color: var(--color-white);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.about-industries .section__head .rule {
  background: var(--color-accent);
}

.about-industries .section__head h2 {
  color: var(--color-white);
}

.about-industries .section__head .lead {
  color: rgba(255, 255, 255, 0.72);
}

.about-industries__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  list-style: none;
  margin: 0;
  padding: 0;
}

.about-industry {
  padding: 1.1rem 1.15rem;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.75rem;
  text-align: center;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.92);
}

.about-industry--visual {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 9.5rem;
  padding: 0;
  display: grid;
  align-items: end;
  text-align: left;
  cursor: default;
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out);
}

.about-industry--visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform 0.5s var(--ease-out);
}

.about-industry--visual::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(11, 31, 58, 0.15) 0%, rgba(11, 31, 58, 0.82) 100%);
}

.about-industry--visual span {
  display: block;
  padding: 1rem 1.05rem;
  color: var(--color-white);
}

.about-industry--visual:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.28);
}

.about-industry--visual:hover img {
  transform: scale(1.08);
}

.about-audience {
  background: var(--color-white);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.about-audience__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(var(--space-6), 4vw, var(--space-8));
  align-items: start;
}

.about-audience__copy .rule {
  width: 2.75rem;
  height: 3px;
  margin: 0 0 var(--space-4);
  border: 0;
  background: var(--color-accent);
}

.about-audience__copy h2 {
  margin-bottom: var(--space-3);
}

.about-audience__copy > p {
  color: var(--color-muted);
  margin-bottom: var(--space-4);
}

.about-audience__list {
  margin: 0 0 var(--space-5);
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.65rem;
}

.about-audience__list li {
  padding-left: 1.25rem;
  position: relative;
  color: var(--color-ink);
  font-size: 0.95rem;
}

.about-audience__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 2px;
  background: var(--color-accent);
}

.about-quote {
  margin: 0;
  padding: var(--space-6);
  background: var(--color-surface);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-left: 3px solid var(--color-accent);
  border-radius: 0 1rem 1rem 0;
  box-shadow: var(--shadow-sm);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.about-quote:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(11, 31, 58, 0.1);
}

.about-quote__avatar {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: var(--space-4);
  border: 2px solid var(--color-white);
  box-shadow: 0 4px 12px rgba(11, 31, 58, 0.12);
}

.about-quote p {
  margin: 0 0 var(--space-4);
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
  font-style: italic;
}

.about-quote footer {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-bottom: var(--space-4);
}

.about-quote cite {
  font-family: var(--font-display);
  font-style: normal;
  font-weight: 600;
  color: var(--color-navy-900);
}

.about-quote footer span {
  font-size: 0.85rem;
  color: var(--color-muted);
}

.about-quote__link {
  font-family: var(--font-nav);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-navy-800);
  text-decoration: none;
}

.about-quote__link:hover {
  color: var(--color-gold-600);
}

.about-facilities {
  background: var(--color-surface);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.about-facilities__intro {
  max-width: 40rem;
  margin-bottom: var(--space-6);
}

.about-facilities__intro .rule {
  width: 2.75rem;
  height: 3px;
  margin: 0 0 var(--space-4);
  border: 0;
  background: var(--color-accent);
}

.about-facilities__mosaic {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
}

.about-facilities__tile {
  position: relative;
  isolation: isolate;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 1rem;
  overflow: hidden;
  cursor: zoom-in;
  background: var(--color-navy-800);
  box-shadow: 0 14px 32px rgba(11, 31, 58, 0.12);
  text-align: left;
}

.about-facilities__tile--lg {
  grid-column: span 2;
  grid-row: span 2;
}

.about-facilities__tile img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 9rem;
  object-fit: cover;
  aspect-ratio: 4 / 3;
  transition: transform 0.45s var(--ease-out);
}

.about-facilities__tile--lg img {
  aspect-ratio: 4 / 3;
  min-height: 100%;
}

.about-facilities__caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1.6rem 0.9rem 0.85rem;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-white);
  background: linear-gradient(180deg, transparent, rgba(11, 31, 58, 0.78));
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.25s var(--ease-out), transform 0.25s var(--ease-out);
}

.about-facilities__tile:hover img,
.about-facilities__tile:focus-visible img {
  transform: scale(1.06);
}

.about-facilities__tile:hover .about-facilities__caption,
.about-facilities__tile:focus-visible .about-facilities__caption {
  opacity: 1;
  transform: none;
}

.about-facilities__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  list-style: none;
  margin: 0;
  padding: 0;
}

.about-facility-card {
  padding: var(--space-5);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 0.85rem;
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.about-facility-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(11, 31, 58, 0.08);
}

.about-facility-card h3 {
  margin: 0 0 var(--space-2);
  font-size: 1rem;
}

.about-facility-card p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.9rem;
}

.about-faq {
  background:
    linear-gradient(165deg, rgba(11, 31, 58, 0.04) 0%, transparent 42%),
    var(--color-surface-alt);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.about-faq__intro {
  margin-bottom: var(--space-6);
  max-width: 36rem;
}

.about-faq__eyebrow {
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-gold-600);
}

.about-faq__intro h2 {
  margin: 0 0 var(--space-3);
  line-height: 1.15;
}

.about-faq__lead {
  margin: 0;
  color: var(--color-muted);
  font-size: 1.02rem;
}

.about-faq__contact {
  margin: var(--space-4) 0 0;
  color: var(--color-muted);
  font-size: 0.95rem;
  line-height: 1.5;
}

.about-faq__contact a {
  color: var(--color-navy-800);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.about-faq__body {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  gap: clamp(var(--space-5), 3vw, var(--space-7));
  align-items: start;
}

.about-faq__media {
  position: relative;
  margin: 0;
  border-radius: 1.15rem;
  overflow: hidden;
  width: 100%;
  box-shadow: 0 18px 40px rgba(11, 31, 58, 0.16);
}

.about-faq__media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-faq__media-caption {
  position: absolute;
  inset: auto 0 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-4);
  background: linear-gradient(180deg, transparent 0%, rgba(11, 31, 58, 0.88) 38%);
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 600;
}

.about-faq__media-caption .btn {
  flex-shrink: 0;
}

.about-faq__panel {
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1.25rem;
  padding: clamp(var(--space-2), 1.5vw, var(--space-4)) clamp(var(--space-4), 2vw, var(--space-6));
  box-shadow: 0 12px 32px rgba(11, 31, 58, 0.06);
}

.about-faq__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.about-faq__item {
  border: 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: transparent;
  overflow: hidden;
}

.about-faq__item:last-child {
  border-bottom: 0;
}

.about-faq__item summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--space-4);
  padding: 1.15rem 0.15rem;
  transition: color 0.2s var(--ease-out);
}

.about-faq__item summary::-webkit-details-marker {
  display: none;
}

.about-faq__item summary:hover .about-faq__q {
  color: var(--color-navy-800);
}

.about-faq__num {
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--color-gold-600);
  min-width: 1.6rem;
}

.about-faq__q {
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 600;
  color: var(--color-navy-900);
  line-height: 1.35;
  transition: color 0.2s var(--ease-out);
}

.about-faq__icon {
  position: relative;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 1px solid rgba(201, 154, 18, 0.45);
  background: rgba(230, 180, 34, 0.08);
  flex-shrink: 0;
  transition: background 0.2s var(--ease-out), border-color 0.2s var(--ease-out), transform 0.25s var(--ease-out);
}

.about-faq__icon::before,
.about-faq__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--color-gold-600);
  transform: translate(-50%, -50%);
}

.about-faq__icon::before {
  width: 0.55rem;
  height: 1.5px;
}

.about-faq__icon::after {
  width: 1.5px;
  height: 0.55rem;
  transition: transform 0.25s var(--ease-out), opacity 0.2s var(--ease-out);
}

.about-faq__item[open] .about-faq__icon {
  background: var(--color-accent);
  border-color: var(--color-accent);
  transform: rotate(90deg);
}

.about-faq__item[open] .about-faq__icon::before,
.about-faq__item[open] .about-faq__icon::after {
  background: var(--color-navy-900);
}

.about-faq__item[open] .about-faq__icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) scaleY(0);
}

.about-faq__item[open] .about-faq__q {
  color: var(--color-navy-900);
}

.about-faq__a {
  padding: 0 0 1.2rem calc(1.6rem + var(--space-4));
  max-width: 38rem;
}

.about-faq__a p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

@media (prefers-reduced-motion: reduce) {
  .about-faq__icon,
  .about-faq__icon::after,
  .about-faq__q {
    transition: none;
  }
}

.about-visit {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #f7f8fa;
  background-image: radial-gradient(rgba(15, 23, 42, 0.18) 1px, transparent 1px);
  background-size: 24px 24px;
  background-position: 0 0;
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.about-visit__layout {
  display: grid;
  gap: clamp(var(--space-5), 3vw, var(--space-6));
}

.about-visit__head {
  max-width: 36rem;
}

.about-visit__eyebrow {
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-gold-600);
}

.about-visit__head h2 {
  margin: 0;
  line-height: 1.15;
}

.about-visit__media {
  margin: 0;
  position: relative;
  display: grid;
  border-radius: 1.15rem;
  overflow: hidden;
  box-shadow:
    0 18px 40px rgba(11, 31, 58, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.2);
}

.about-visit__media::after {
  content: "";
  grid-area: 1 / 1;
  z-index: 1;
  background: linear-gradient(180deg, transparent 52%, rgba(11, 31, 58, 0.58) 100%);
  pointer-events: none;
}

.about-visit__media img {
  grid-area: 1 / 1;
  display: block;
  width: 100%;
  aspect-ratio: 2 / 1;
  max-height: 26rem;
  height: auto;
  object-fit: cover;
  object-position: center 42%;
  transform: scale(1.01);
  transition: transform 0.7s var(--ease-out);
}

.about-visit__media:hover img {
  transform: scale(1.04);
}

.about-visit__caption {
  grid-area: 1 / 1;
  z-index: 2;
  align-self: end;
  justify-self: start;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  padding: var(--space-4) var(--space-5);
  color: var(--color-white);
  font-family: var(--font-nav);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.about-visit__caption-mark {
  flex-shrink: 0;
  width: 0.7rem;
  height: 0.7rem;
  background: var(--color-accent);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 35% 100%);
}

.about-visit__panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: clamp(var(--space-5), 3vw, var(--space-7));
  align-items: start;
  padding: clamp(var(--space-5), 3vw, var(--space-7));
  background: var(--color-white);
  border-radius: 1.15rem;
  box-shadow: 0 16px 36px rgba(11, 31, 58, 0.1);
  border: 1px solid rgba(15, 23, 42, 0.05);
}

.about-visit__intro {
  min-width: 0;
}

.about-visit__aside {
  display: grid;
  gap: var(--space-5);
  align-content: start;
  min-width: 0;
}

.about-visit__lead {
  margin: 0 0 var(--space-5);
  color: var(--color-muted);
  max-width: 36rem;
}

.about-visit__facts {
  margin: 0;
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.about-visit__fact {
  display: grid;
  grid-template-columns: minmax(7.5rem, 9rem) minmax(0, 1fr);
  gap: var(--space-3) var(--space-4);
  padding: 0.95rem 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.about-visit__fact dt {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-navy-900);
}

.about-visit__fact-icon {
  display: inline-flex;
  color: var(--color-gold-600);
  margin-top: 0.05rem;
}

.about-visit__fact dd {
  margin: 0;
  color: var(--color-ink);
  font-weight: 500;
  line-height: 1.45;
}

.about-visit__fact address {
  font-style: normal;
}

.about-visit__fact dd span:first-child {
  display: block;
  font-weight: 700;
  color: var(--color-navy-900);
}

.about-visit__fact a {
  color: var(--color-navy-800);
  font-weight: 600;
  text-decoration: none;
}

.about-visit__fact a:hover {
  color: var(--color-gold-600);
}

.about-visit__sep {
  margin: 0 0.35rem;
  color: var(--color-slate-400);
}

.about-visit__expect {
  margin: 0;
  padding: var(--space-4);
  background: linear-gradient(135deg, rgba(11, 31, 58, 0.04) 0%, rgba(230, 180, 34, 0.1) 100%);
  border-radius: 0.85rem;
  border-left: 3px solid var(--color-accent);
}

.about-visit__expect-label {
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-navy-800);
}

.about-visit__expect ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.about-visit__expect li {
  position: relative;
  padding-left: 1.15rem;
  color: var(--color-ink);
  font-size: 0.97rem;
  line-height: 1.4;
}

.about-visit__expect li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.45rem;
  height: 0.45rem;
  background: var(--color-navy-900);
  transform: rotate(45deg);
}

.about-visit__actions .btn-row {
  margin-bottom: var(--space-3);
}

.about-visit__footnote {
  margin: 0;
  font-size: 0.92rem;
  color: var(--color-muted);
}

.about-visit__footnote a {
  font-weight: 600;
  color: var(--color-navy-800);
  text-decoration: none;
  border-bottom: 1px solid rgba(18, 48, 86, 0.25);
  transition: color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}

.about-visit__footnote a:hover {
  color: var(--color-gold-600);
  border-bottom-color: var(--color-gold-600);
}

@media (prefers-reduced-motion: reduce) {
  .about-visit__media img,
  .about-visit__media:hover img {
    transform: none;
    transition: none;
  }
}

.about-lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: var(--space-5);
}

.about-lightbox[hidden] {
  display: none;
}

.about-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(11, 31, 58, 0.72);
  backdrop-filter: blur(4px);
}

.about-lightbox__dialog {
  position: relative;
  z-index: 1;
  width: min(56rem, 100%);
  max-height: min(90vh, 48rem);
  padding: var(--space-4);
  background: var(--color-white);
  border-radius: 1rem;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

.about-lightbox__img {
  display: block;
  width: 100%;
  max-height: min(72vh, 38rem);
  object-fit: contain;
  border-radius: 0.65rem;
  background: var(--color-navy-900);
}

.about-lightbox__caption {
  margin: var(--space-3) 0 0;
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-navy-900);
}

.about-lightbox__close {
  position: absolute;
  top: 0.55rem;
  right: 0.65rem;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: rgba(11, 31, 58, 0.85);
  color: var(--color-white);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}

.about-lightbox__close:hover {
  background: var(--color-navy-900);
}

body.about-lightbox-open {
  overflow: hidden;
}

#mission,
#approach {
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

/* Contact page */
.contact-hero {
  position: relative;
  isolation: isolate;
  height: var(--page-hero-h);
  min-height: var(--page-hero-h);
  max-height: var(--page-hero-h);
  display: grid;
  align-items: stretch;
  color: var(--color-white);
  overflow: hidden;
}

.contact-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(105deg, rgba(11, 31, 58, 0.78) 0%, rgba(11, 31, 58, 0.45) 48%, rgba(11, 31, 58, 0.28) 100%),
    url("../images/contact-hero-ai.jpg") center / cover no-repeat;
}

.contact-hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.contact-hero__content > .category-breadcrumb {
  margin-bottom: 0;
}

.contact-hero__content > h1 {
  margin-top: auto;
}

.about-hero__media--in-house {
  background:
    linear-gradient(105deg, rgba(11, 31, 58, 0.78) 0%, rgba(11, 31, 58, 0.45) 48%, rgba(11, 31, 58, 0.28) 100%),
    url("../images/hero-classroom-ai.jpg") center / cover no-repeat;
}

.about-hero__media--privacy {
  background-color: #0b1f3a;
  background-image:
    linear-gradient(105deg, rgba(11, 31, 58, 0.92) 0%, rgba(11, 31, 58, 0.7) 42%, rgba(11, 31, 58, 0.38) 100%),
    url("../images/logo.png");
  background-repeat: no-repeat;
  background-position: center, right 6% center;
  background-size: auto, auto min(58%, 13.5rem);
}

.in-house-intro {
  padding-top: var(--space-8);
  padding-bottom: var(--space-6);
  background: var(--color-white);
}

.in-house-intro__inner {
  max-width: 40rem;
}

.in-house-intro__inner .rule {
  width: 2.75rem;
  height: 3px;
  margin: 0 0 var(--space-4);
  border: 0;
  background: var(--color-accent);
}

.in-house-intro__inner h2 {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  line-height: 1.2;
}

.in-house-intro__inner p {
  margin: 0 0 var(--space-4);
  color: var(--color-muted);
  line-height: 1.7;
}

.in-house-intro__inner p:last-child {
  margin-bottom: 0;
}

.in-house-gallery-section {
  padding-top: 0;
  padding-bottom: var(--space-6);
  background: var(--color-white);
}

.in-house-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(var(--space-4), 3vw, var(--space-6));
}

.in-house-gallery__item {
  margin: 0;
}

.in-house-gallery__item img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 1rem;
  background: var(--color-surface-alt);
}

.in-house-gallery__item figcaption {
  margin-top: var(--space-2);
  text-align: left;
  color: var(--color-muted);
  font-size: 0.875rem;
}

.in-house-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);
  list-style: none;
  margin: var(--space-6) 0 0;
  padding: 0;
}

.in-house-card {
  padding: var(--space-5);
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-top: 3px solid var(--color-accent);
  border-radius: 0 0.85rem 0.85rem 0.85rem;
  box-shadow: var(--shadow-sm);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}

.in-house-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 28px rgba(11, 31, 58, 0.1);
}

.in-house-card__icon {
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  margin-bottom: var(--space-4);
  border-radius: 999px;
  background: rgba(230, 180, 34, 0.14);
  color: var(--color-gold-600);
  transition: transform 0.25s var(--ease-out), background 0.25s var(--ease-out);
}

.in-house-card:hover .in-house-card__icon {
  transform: scale(1.08);
  background: rgba(230, 180, 34, 0.28);
}

.in-house-card h3 {
  margin: 0 0 var(--space-2);
  font-size: 1.1rem;
}

.in-house-card p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.95rem;
}

.in-house-note {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  margin: var(--space-5) 0 0;
  padding: 0.85rem 1.1rem;
  background: rgba(230, 180, 34, 0.14);
  border: 1px solid rgba(201, 154, 18, 0.38);
  border-radius: 0.7rem;
  color: #8a5a10;
  font-size: 0.95rem;
  line-height: 1.5;
}

.in-house-note__icon {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  margin-top: 0.08rem;
}

.in-house-outro {
  padding-top: var(--space-6);
  padding-bottom: var(--space-8);
  background: var(--color-surface);
}

.in-house-outro__inner {
  max-width: 40rem;
}

.in-house-outro__inner h2 {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  line-height: 1.2;
}

.in-house-outro__inner p {
  margin: 0;
  color: var(--color-muted);
  line-height: 1.7;
}

.in-house-form {
  position: relative;
  margin-top: var(--space-6);
  gap: var(--space-5);
}

.in-house-form__ref {
  margin: 0;
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-slate-400);
}

.in-house-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4) var(--space-5);
}

.in-house-form__span {
  grid-column: 1 / -1;
}

.in-house-form .form-row label {
  font-family: var(--font-nav);
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--color-navy-900);
}

.in-house-form__req {
  color: #e08a1e;
  font-weight: 700;
}

.in-house-form .form-row input,
.in-house-form .form-row select,
.in-house-form .form-row textarea {
  border-radius: 0.55rem;
  border-color: #e2e8f0;
  background: var(--color-white);
  min-height: 2.85rem;
}

.in-house-form .form-row textarea {
  min-height: 7.25rem;
}

.in-house-form__submit {
  border-radius: 999px;
  min-height: 2.85rem;
  padding-inline: 1.6rem;
}

#in-house-form {
  scroll-margin-top: calc(var(--header-h) + var(--space-4));
}

.contact-main {
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  background: var(--color-surface);
}

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.15fr);
  gap: clamp(var(--space-6), 4vw, var(--space-8));
  align-items: stretch;
}

.contact-hubs {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.contact-hubs__title {
  margin-bottom: var(--space-5);
  position: relative;
  padding-bottom: var(--space-3);
}

.contact-hubs__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 2.75rem;
  height: 3px;
  border-radius: 2px;
  background: var(--color-accent);
}

.hub-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-4);
  align-items: start;
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-left: 3px solid var(--color-gold-600);
  border-radius: 0.85rem;
  padding: var(--space-5);
  box-shadow: var(--shadow-sm);
  margin-bottom: var(--space-5);
}

.hub-card__icon {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: rgba(230, 180, 34, 0.14);
  color: var(--color-gold-600);
}

.hub-card h3 {
  margin: 0 0 var(--space-2);
  font-size: 1.05rem;
}

.hub-card p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.95rem;
}

.hub-card div > p + p {
  margin-top: 0.35rem;
  font-size: 0.8rem;
}

.contact-details {
  display: grid;
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}

.contact-detail__label {
  margin: 0 0 var(--space-2);
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-slate-400);
}

.contact-detail__list {
  display: grid;
  gap: var(--space-2);
}

.contact-detail__value {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--color-ink);
  font-weight: 600;
  text-decoration: none;
}

.contact-detail__value:hover {
  color: var(--color-gold-600);
}

.contact-detail__icon {
  display: grid;
  place-items: center;
  color: var(--color-gold-600);
  flex-shrink: 0;
}

.contact-hours {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  background: var(--color-navy-900);
  color: var(--color-white);
  border-radius: 0.85rem;
  padding: 1rem 1.15rem;
  margin-bottom: var(--space-5);
}

.contact-hours__icon {
  display: grid;
  place-items: center;
  color: var(--color-accent);
  flex-shrink: 0;
}

.contact-hours p {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
}

.contact-hours span {
  color: var(--color-accent);
}

.contact-quick-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}

.contact-quick-actions .btn {
  width: 100%;
}

.contact-form-card {
  background: var(--color-white);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1.15rem;
  padding: clamp(1.35rem, 3vw, 2rem);
  box-shadow: var(--shadow-md);
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.contact-form-card h2 {
  margin-bottom: var(--space-3);
}

.contact-form-card__lead {
  margin: 0 0 var(--space-5);
  color: var(--color-muted);
  max-width: 36rem;
}

.form--contact {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  gap: var(--space-4);
}

.form--contact .form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.form--contact .form-row label {
  font-family: var(--font-nav);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-slate-600);
}

.form--contact .form-row input,
.form--contact .form-row select,
.form--contact .form-row textarea {
  border-radius: 0.65rem;
  border-color: #e2e8f0;
  background: #fbfcfe;
  min-height: 2.85rem;
}

.form--contact .form-row:has(textarea) {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 8.5rem;
}

.form--contact .form-row textarea {
  min-height: 8.5rem;
  flex: 1 1 auto;
  height: 100%;
  resize: vertical;
}

.contact-submit {
  width: 100%;
  min-height: 3rem;
  border-radius: 0.75rem;
  margin-top: auto;
}

#contact-form {
  scroll-margin-top: 5.5rem;
}

.contact-map {
  position: relative;
  min-height: clamp(18rem, 38vw, 24rem);
  overflow: hidden;
  background: #d7dde5;
}
 
.contact-map__main {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.contact-map__street {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  z-index: 2;
  width: min(30rem, calc(100% - 2rem));
  aspect-ratio: 4 / 3;
  border-radius: 0.75rem;
  overflow: hidden;
  border: 2px solid var(--color-white);
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.28);
  background: #0b1f3a;
}

.contact-map__street iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.contact-faq {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-border);
  color: var(--color-ink);
}

.contact-faq__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
  flex-wrap: wrap;
}

.contact-faq__head h2 {
  margin: 0;
  color: var(--color-ink);
  font-size: 1.05rem;
}

.contact-faq__all {
  color: var(--color-gold-600);
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
}

.contact-faq__all:hover {
  color: var(--color-navy-800);
}

.contact-faq__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.55rem;
}

.faq-item {
  border: 1px solid var(--color-border);
  border-radius: 0.65rem;
  padding: 0;
  background: var(--color-white);
}

.faq-item summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2);
  padding: 0.7rem 0.8rem;
  font-family: var(--font-display);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--color-ink);
  line-height: 1.35;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item__icon {
  color: var(--color-gold-600);
  font-size: 1.05rem;
  line-height: 1;
  flex-shrink: 0;
  transition: transform 0.2s var(--ease-out);
}

.faq-item[open] .faq-item__icon {
  transform: rotate(45deg);
}

.faq-item p {
  margin: 0;
  padding: 0 0.8rem 0.75rem;
  color: var(--color-muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-7);
  align-items: center;
}

.split__media {
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-md);
  background: var(--color-navy-800) center / cover;
}

/* Footer */
.site-footer {
  background: var(--color-navy-900);
  color: rgba(255, 255, 255, 0.78);
  margin: auto 0 0;
  padding: var(--space-8) 0 var(--space-5);
  border-radius: 2rem 2rem 0 0;
}

.wa-float {
  position: fixed;
  right: max(4rem, calc(env(safe-area-inset-right, 0px) + 3.5rem));
  bottom: max(4rem, calc(env(safe-area-inset-bottom, 0px) + 3.5rem));
  z-index: 90;
  width: 4.5rem;
  height: 4.5rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  text-decoration: none;
  border: none;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.22) inset,
    0 6px 16px rgba(11, 31, 58, 0.22);
  transition:
    transform 0.22s var(--ease-out),
    background 0.22s var(--ease-out),
    box-shadow 0.22s var(--ease-out);
}

.wa-float:hover,
.wa-float:focus-visible {
  background: #1ebe57;
  color: #fff;
  transform: translateY(-3px) scale(1.04);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.28) inset,
    0 10px 22px rgba(11, 31, 58, 0.26);
}

.wa-float:focus-visible {
  outline: 2px solid #25d366;
  outline-offset: 3px;
}

.wa-float svg {
  display: block;
  width: 30px;
  height: 30px;
}

.site-footer a {
  color: rgba(255, 255, 255, 0.92);
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--color-accent);
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.35fr 0.9fr 1.15fr 1.2fr;
  gap: var(--space-6);
  align-items: start;
  padding-bottom: var(--space-7);
}

.footer-brand__logo {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: var(--space-4);
  text-decoration: none;
  color: var(--color-white);
}

.footer-brand__logo img {
  width: 4.75rem;
  height: 4.75rem;
  object-fit: contain;
  border-radius: 4px;
  background: var(--color-white);
  box-sizing: border-box;
}

.footer-brand__name {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  text-align: center;
  color: var(--color-white);
}

.footer-brand__name span {
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
}

.footer-brand__text {
  margin: 0 0 var(--space-5);
  max-width: 18rem;
  font-family: var(--font-nav);
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.62);
}

.footer-social {
  display: flex;
  gap: 0.75rem;
}

.footer-social a {
  width: 2.75rem;
  height: 2.75rem;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.9);
  transition: background 0.2s var(--ease-out), color 0.2s var(--ease-out);
}

.footer-social a svg {
  width: 1.15rem;
  height: 1.15rem;
}

.footer-social a:hover {
  background: rgba(230, 180, 34, 0.18);
  color: var(--color-accent);
}

.footer-heading {
  margin: 0 0 var(--space-4);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.footer-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.4rem;
}

.footer-links a {
  font-family: var(--font-nav);
  font-size: 0.92rem;
  font-weight: 500;
}

.footer-contact {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1rem;
}

.footer-contact li {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-family: var(--font-nav);
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.88);
}

.footer-contact__icon {
  display: grid;
  place-items: center;
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
  margin-top: 0.15rem;
  color: var(--color-accent);
}

.footer-contact__phones {
  display: grid;
  gap: 0.35rem;
}

.footer-cert__logos {
  list-style: none;
  margin: 0 0 var(--space-4);
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
}

.footer-cert__logos li {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.15rem;
  padding: 0.45rem 0.55rem;
  background: var(--color-white);
  border-radius: 0.5rem;
}

.footer-cert__logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: 2.15rem;
  object-fit: contain;
}

.footer-cert__logo--hrd {
  height: 2.45rem;
}

.footer-cert__logo--autodesk {
  height: 1.55rem;
}

.footer-cert__text {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.58);
}

.footer-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  flex-wrap: wrap;
  padding-top: var(--space-5);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.55);
}

.footer-legal {
  display: flex;
  gap: 1.25rem;
}

.footer-legal a {
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.8rem;
}

.footer-legal a:hover {
  color: var(--color-accent);
}

/* Privacy / legal pages */
.legal-page {
  padding-top: var(--space-8);
  padding-bottom: var(--space-9);
}

.legal-page__body {
  font-size: 1.05rem;
  line-height: 1.75;
  color: #243044;
}

.legal-page__body > * + * {
  margin-top: 1.15em;
}

.legal-page__body h2 {
  margin: 2em 0 0.65em;
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--color-navy-900);
}

.legal-page__body h2:first-child {
  margin-top: 0;
}

.legal-page__body h3 {
  margin: 1.5em 0 0.5em;
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-navy-900);
}

.legal-page__body p,
.legal-page__body ul {
  margin: 0;
}

.legal-page__body ul {
  padding-left: 1.2em;
}

.legal-page__body li + li {
  margin-top: 0.4em;
}

.legal-page__body a {
  color: var(--color-navy-800);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.legal-page__body a:hover {
  color: var(--color-accent);
}

/* Course detail */
.syllabus {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
}

.syllabus ol {
  margin: 0;
  padding-left: 1.25rem;
}

.syllabus li {
  margin-bottom: var(--space-2);
}

.course-intro {
  display: grid;
  grid-template-columns: minmax(16rem, 0.95fr) minmax(0, 1.25fr);
  grid-template-areas:
    "media content"
    "facts facts";
  gap: var(--space-5) var(--space-6);
  margin-bottom: var(--space-7);
  padding: var(--space-5);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 1.5rem;
  color: var(--color-on-brand);
  background:
    linear-gradient(145deg, rgba(230, 180, 34, 0.12), transparent 38%),
    linear-gradient(160deg, #071525 0%, #0b1f3a 48%, #123056 100%);
  box-shadow: 0 22px 48px rgba(7, 21, 37, 0.28);
}

.course-intro__media {
  grid-area: media;
  min-height: 18rem;
  border-radius: 1.15rem;
  background: var(--color-navy-800) center / cover no-repeat;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.1),
    0 14px 32px rgba(0, 0, 0, 0.28);
}

.course-intro__content {
  grid-area: content;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}

.course-intro__badge {
  display: inline-flex;
  align-self: start;
  margin: 0 0 var(--space-3);
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  background: rgba(230, 180, 34, 0.16);
  color: var(--color-accent);
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.course-intro h1 {
  margin-bottom: var(--space-3);
  color: var(--color-white);
  font-size: clamp(2.2rem, 4.2vw, 3.2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

.course-intro .lead {
  margin-bottom: var(--space-4);
  max-width: 46ch;
  color: rgba(255, 255, 255, 0.74);
}

.course-intro__actions {
  margin-top: auto;
}

.course-intro__cta {
  min-height: 3.15rem;
  padding: 0.95rem 1.55rem;
  font-size: 1rem;
  font-weight: 700;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
}

.course-intro__actions .btn--primary.course-intro__cta {
  background: var(--color-accent);
  color: var(--color-on-accent);
}

.course-intro__actions .btn--primary.course-intro__cta:hover {
  background: var(--color-gold-600);
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.28);
}

.course-intro__actions .btn--outline {
  border-color: rgba(255, 255, 255, 0.55);
  border-width: 2px;
  color: var(--color-white);
  background: rgba(255, 255, 255, 0.06);
}

.course-intro__actions .btn--outline:hover {
  border-color: var(--color-accent);
  background: rgba(255, 255, 255, 0.12);
  color: var(--color-white);
  transform: translateY(-1px);
}

.course-intro__facts {
  grid-area: facts;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Match column count to visible facts so 2–3 items fill the row */
.course-intro__facts:where(:has(> :only-child)) {
  grid-template-columns: 1fr;
}

.course-intro__facts:where(:has(> :nth-child(2):last-child)) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.course-intro__facts:where(:has(> :nth-child(4))) {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.course-intro__facts li {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.85rem;
  background: rgba(255, 255, 255, 0.05);
  transition: transform 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out), border-color 0.2s var(--ease-out), background 0.2s var(--ease-out);
}

.course-intro__facts li:hover {
  transform: translateY(-1px);
  border-color: rgba(230, 180, 34, 0.4);
  background: rgba(255, 255, 255, 0.09);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
}

.course-intro__facts li.course-intro__fact--ccd {
  border-color: rgba(230, 180, 34, 0.5);
  background: rgba(230, 180, 34, 0.16);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

.course-intro__facts li.course-intro__fact--ccd:hover {
  border-color: rgba(230, 180, 34, 0.7);
  background: rgba(230, 180, 34, 0.22);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22);
}

.course-intro__facts li.course-intro__fact--ccd strong {
  font-size: 1.05rem;
  color: var(--color-accent);
}

.course-intro__fact-icon {
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  flex-shrink: 0;
  border-radius: 0.6rem;
  background: rgba(230, 180, 34, 0.14);
  color: var(--color-accent);
}

.course-intro__fact-icon svg {
  width: 15px;
  height: 15px;
}

.course-intro__facts span:not(.course-intro__fact-icon) {
  display: block;
  margin-bottom: 0.08rem;
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.course-intro__facts strong {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.25;
}

.course-detail.section {
  padding-top: calc(var(--header-h) + var(--space-8));
  padding-bottom: var(--space-8);
}

.course-detail > .container > .course-intro {
  margin-top: 0;
}

.course-toc {
  --toc-width: min(calc(100% + var(--content-inset) - var(--float-inset)), var(--content-max));
  position: sticky;
  top: var(--header-h);
  z-index: 90;
  width: var(--toc-width);
  max-width: none;
  margin-bottom: var(--space-4);
  margin-inline: calc((100% - var(--toc-width)) / 2);
}

.course-toc.is-stuck {
  top: var(--header-h);
}

.course-toc__inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  padding: 0.45rem;
  overflow-x: auto;
  scrollbar-width: thin;
  border-radius: 0 0 var(--float-radius) var(--float-radius);
  background: rgba(255, 252, 247, 0.94);
  border: 1px solid rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.1);
}

.course-toc.is-stuck .course-toc__inner {
  border-top-color: transparent;
  box-shadow: 0 14px 36px rgba(11, 31, 58, 0.14);
}

.course-toc__link {
  flex: 0 0 auto;
  padding: 0.55rem 0.95rem;
  border-radius: 999px;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--color-slate-600);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s, background 0.2s;
}

.course-toc__link:hover {
  color: var(--color-navy-900);
  background: rgba(15, 23, 42, 0.05);
}

.course-toc__link.is-active {
  color: var(--color-navy-900);
  background: rgba(230, 180, 34, 0.22);
}

.course-toc__top {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  color: var(--color-slate-400);
  text-decoration: none;
  transition: color 0.2s, background 0.2s;
}

.course-toc__top:hover,
.course-toc__top:focus-visible {
  color: var(--color-navy-900);
  background: rgba(230, 180, 34, 0.38);
}

.course-toc__top:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.course-toc__top svg {
  display: block;
}

.course-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 21rem;
  gap: var(--space-7);
  align-items: start;
}

.course-main {
  display: flex;
  flex-direction: column;
  gap: var(--space-7);
  min-width: 0;
}

.course-block h2 {
  margin-bottom: var(--space-4);
  font-size: clamp(1.35rem, 2vw, 1.7rem);
  /* Clear sticky header + course TOC when jumping from the section nav */
  scroll-margin-top: calc(var(--header-h) + 4.5rem);
}

.course-block__head {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}

.course-block__head h2 {
  margin-bottom: var(--space-2);
}

.course-block__lead {
  margin: 0;
  color: var(--color-muted);
}

.course-writeup {
  display: grid;
  gap: var(--space-4);
  max-width: 68ch;
  color: var(--color-slate-600);
  font-size: 1.05rem;
  line-height: 1.7;
}

.course-writeup > * + * {
  margin-top: 0;
}

.course-writeup p {
  margin: 0;
}

.course-writeup h2,
.course-writeup h3 {
  margin: 0;
  color: var(--color-navy-900);
  font-weight: 700;
  line-height: 1.3;
}

.course-writeup h2 {
  font-size: 1.35rem;
}

.course-writeup h3 {
  font-size: 1.15rem;
}

.course-writeup ul,
.course-writeup ol {
  margin: 0;
  padding-left: 1.25em;
}

.course-writeup li + li {
  margin-top: 0.4em;
}

.course-writeup blockquote {
  margin: 0;
  padding: 0.15rem 0 0.15rem 1rem;
  border-left: 3px solid var(--color-accent);
  color: var(--color-navy-900);
  font-weight: 600;
}

.course-writeup blockquote p {
  margin: 0;
}

.course-writeup img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.course-about-extra {
  margin-top: var(--space-6);
  max-width: 68ch;
}

.course-about-extra h3 {
  margin: 0 0 var(--space-3);
  font-size: 1.15rem;
  font-weight: 700;
}

.course-about-extra__audience {
  margin-top: var(--space-5) !important;
}

.course-gallery {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: var(--space-3);
  min-height: 18rem;
}

.course-gallery__item {
  margin: 0;
  overflow: hidden;
  border-radius: 1rem;
  background: var(--color-navy-800);
}

.course-gallery__item--hero {
  grid-row: 1 / span 2;
}

.course-gallery__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s var(--ease-out);
}

.course-gallery__item:hover img {
  transform: scale(1.03);
}

.course-social-proof {
  margin: var(--space-5) 0 0;
  padding: var(--space-5) 0 0;
  border-top: 1px solid rgba(15, 23, 42, 0.1);
  display: grid;
  gap: var(--space-6);
}

.course-social-proof:empty,
.course-social-proof[hidden] {
  margin: 0;
  padding: 0;
  border: 0;
}

.course-proof-item {
  display: grid;
  gap: var(--space-5);
  align-items: center;
}

.course-proof-item + .course-proof-item {
  padding-top: var(--space-6);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.course-proof-item--pair {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
}

.course-proof-item--quote,
.course-proof-item--video {
  grid-template-columns: minmax(0, 1fr);
}

.course-proof-item__video {
  position: relative;
  width: 100%;
  max-width: 40rem;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--color-navy-800, #0f172a);
}

.course-proof-item--video .course-proof-item__video {
  justify-self: start;
}

.course-proof-item__video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.course-proof-item__quote {
  margin: 0;
  max-width: 36rem;
}

.course-social-proof__mark {
  display: block;
  margin-bottom: 0.15rem;
  color: var(--color-accent);
  font-family: var(--font-display);
  font-size: 2.75rem;
  font-weight: 700;
  line-height: 1;
}

.course-proof-item__quote blockquote {
  margin: 0 0 var(--space-4);
  color: var(--color-ink);
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  font-weight: 500;
  line-height: 1.55;
}

.course-proof-item__quote figcaption {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.course-social-proof__avatar {
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background-color: var(--color-navy-800);
  background-position: center;
  background-size: cover;
}

.course-social-proof__avatar--placeholder {
  display: grid;
  place-items: center;
  color: var(--color-accent);
  font-family: var(--font-display);
  font-weight: 700;
}

.course-proof-item__quote figcaption strong {
  display: block;
  color: var(--color-ink);
  font-size: 0.95rem;
}

.course-proof-item__quote figcaption em {
  display: block;
  color: var(--color-muted);
  font-size: 0.88rem;
  font-style: normal;
}

@media (max-width: 720px) {
  .course-proof-item--pair {
    grid-template-columns: 1fr;
  }

  .course-proof-item__video {
    max-width: none;
  }
}

.course-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-3);
}

.course-checklist li {
  position: relative;
  padding-left: 1.35rem;
  color: var(--color-ink);
  font-weight: 600;
  line-height: 1.55;
}

.course-checklist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--color-accent);
}

.course-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.course-tags li {
  padding: 0.45rem 0.9rem;
  border: 1px solid rgba(201, 154, 18, 0.35);
  border-radius: 0.85rem;
  background: var(--color-accent);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 600;
}

.course-range {
  display: inline-flex;
  padding: 0.25rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-white);
}

.course-range__btn {
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 0.95rem;
  background: transparent;
  color: var(--color-muted);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
}

.course-range__btn.is-active {
  background: var(--color-navy-900);
  color: var(--color-white);
}

.course-schedule__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-3);
}

.course-schedule__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: 1.05rem 1.15rem;
  border: 1px solid var(--color-border);
  border-radius: 1rem;
  background: var(--color-white);
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out), transform 0.2s var(--ease-out);
}

.course-schedule__item:hover {
  transform: translateY(-1px);
  border-color: rgba(18, 48, 86, 0.22);
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.07);
}

.course-schedule__when strong {
  display: block;
  margin-bottom: 0.25rem;
  color: var(--color-ink);
  font-family: var(--font-display);
}

.course-schedule__when span {
  color: var(--color-muted);
  font-size: 0.92rem;
}

.course-schedule__meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.course-schedule__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.4rem;
  padding: 0.55rem 1rem;
  border-radius: var(--radius-md);
  background: var(--color-accent);
  color: var(--color-on-accent);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 16px rgba(201, 154, 18, 0.28);
  transition: background 0.2s var(--ease-out), transform 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.course-schedule__cta:hover {
  background: var(--color-gold-600);
  color: var(--color-on-accent);
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(201, 154, 18, 0.34);
}

.course-schedule__empty {
  padding: var(--space-5);
  border: 1px dashed var(--color-border);
  border-radius: 1rem;
  background: var(--color-surface-alt);
  color: var(--color-muted);
}

.course-schedule__empty p {
  margin: 0;
}

.course-outline {
  display: grid;
  gap: var(--space-2);
}

.course-outline__item {
  border: 1px solid var(--color-border);
  border-radius: 1rem;
  background: var(--color-white);
  box-shadow: 0 8px 20px rgba(11, 31, 58, 0.04);
  overflow: hidden;
}

.course-outline__item summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 6.75rem minmax(0, 1fr) auto;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-4) var(--space-5);
}

.course-outline__item summary::-webkit-details-marker {
  display: none;
}

.course-outline__item summary:hover .course-outline__title {
  color: var(--color-navy-800);
}

.course-outline__day {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: start;
  min-height: 2rem;
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  background: rgba(230, 180, 34, 0.16);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-align: center;
}

.course-outline__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--color-ink);
  transition: color 0.2s var(--ease-out);
}

.course-outline__icon {
  position: relative;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 1px solid rgba(201, 154, 18, 0.45);
  background: rgba(230, 180, 34, 0.08);
  flex-shrink: 0;
  transition: background 0.2s var(--ease-out), border-color 0.2s var(--ease-out), transform 0.25s var(--ease-out);
}

.course-outline__icon::before,
.course-outline__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--color-gold-600);
  transform: translate(-50%, -50%);
}

.course-outline__icon::before {
  width: 0.55rem;
  height: 1.5px;
}

.course-outline__icon::after {
  width: 1.5px;
  height: 0.55rem;
  transition: transform 0.25s var(--ease-out), opacity 0.2s var(--ease-out);
}

.course-outline__item[open] .course-outline__icon {
  background: var(--color-accent);
  border-color: var(--color-accent);
  transform: rotate(90deg);
}

.course-outline__item[open] .course-outline__icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) scaleY(0);
}

.course-outline__body {
  margin: 0;
  padding: 0 var(--space-5) var(--space-4);
  padding-left: calc(6.75rem + var(--space-4) + var(--space-5));
  color: var(--color-muted);
  line-height: 1.55;
}

.course-outline__body > * + * {
  margin-top: 0.65em;
}

.course-outline__body p {
  margin: 0;
}

.course-outline__body ul {
  margin: 0;
  padding-left: 1.25em;
}

.course-outline__body li + li {
  margin-top: 0.35em;
}

.course-outline__body strong {
  font-weight: 700;
  color: var(--color-navy-900);
}

.course-outline__body em {
  font-style: italic;
}

.course-format {
  list-style: none;
  margin: var(--space-4) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.course-format__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3);
  align-items: start;
  padding: 0;
  border-bottom: 0;
}

.course-format__item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.course-format__item:first-child {
  padding-top: 0;
}

.course-format__mark {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.85rem;
  background: rgba(230, 180, 34, 0.16);
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: 0.85rem;
  font-weight: 700;
}

.course-format__item h3 {
  margin: 0 0 0.45rem;
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.25;
}

.course-format__item p {
  margin: 0;
  color: var(--color-muted);
  line-height: 1.55;
  max-width: none;
}

.course-cert {
  display: grid;
  gap: var(--space-4);
}

.course-cert__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-4);
  align-items: start;
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.course-cert__item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.course-cert__icon {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.85rem;
  background: rgba(230, 180, 34, 0.16);
  color: var(--color-navy-900);
}

.course-cert__item h3 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
}

.course-cert__item p,
.course-cert__item ul {
  margin: 0;
  color: var(--color-muted);
  line-height: 1.55;
}

.course-cert__item ul {
  padding-left: 1.1rem;
  display: grid;
  gap: 0.35rem;
}

.course-tools details {
  border: 1px solid var(--color-border);
  border-radius: 1rem;
  background: var(--color-white);
  box-shadow: 0 8px 20px rgba(11, 31, 58, 0.04);
  overflow: hidden;
}

.course-tools summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 700;
  color: var(--color-ink);
}

.course-tools summary::-webkit-details-marker {
  display: none;
}

.course-tools__icon {
  position: relative;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 1px solid rgba(201, 154, 18, 0.45);
  background: rgba(230, 180, 34, 0.08);
  flex-shrink: 0;
  transition: background 0.2s var(--ease-out), border-color 0.2s var(--ease-out), transform 0.25s var(--ease-out);
}

.course-tools__icon::before,
.course-tools__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--color-gold-600);
  transform: translate(-50%, -50%);
}

.course-tools__icon::before {
  width: 0.55rem;
  height: 1.5px;
}

.course-tools__icon::after {
  width: 1.5px;
  height: 0.55rem;
  transition: opacity 0.2s var(--ease-out);
}

.course-tools details[open] .course-tools__icon {
  background: var(--color-accent);
  border-color: var(--color-accent);
  transform: rotate(90deg);
}

.course-tools details[open] .course-tools__icon::after {
  opacity: 0;
}

.course-tools__list {
  list-style: none;
  margin: 0;
  padding: 0 var(--space-5) var(--space-5);
  display: grid;
  gap: var(--space-3);
}

.course-tools__list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3);
  align-items: start;
  padding-top: var(--space-3);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.course-tools__list strong {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--color-ink);
  font-size: 0.98rem;
}

.course-tools__list span {
  color: var(--color-muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

.course-tools__mark {
  display: grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 0.7rem;
  background: rgba(230, 180, 34, 0.16);
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
}

.course-faq {
  display: grid;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: 1rem;
  background: var(--color-white);
  padding: 0 var(--space-5);
  box-shadow: 0 8px 20px rgba(11, 31, 58, 0.04);
}

.course-faq__item {
  border: 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: transparent;
}

.course-faq__item:last-child {
  border-bottom: 0;
}

.course-faq__item summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--space-3);
  padding: 1.05rem 0;
}

.course-faq__item summary::-webkit-details-marker {
  display: none;
}

.course-faq__num {
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--color-gold-600);
  min-width: 1.6rem;
}

.course-faq__q {
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 600;
  color: var(--color-navy-900);
  line-height: 1.35;
}

.course-faq__icon {
  position: relative;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 1px solid rgba(201, 154, 18, 0.45);
  background: rgba(230, 180, 34, 0.08);
  flex-shrink: 0;
  transition: background 0.2s var(--ease-out), border-color 0.2s var(--ease-out), transform 0.25s var(--ease-out);
}

.course-faq__icon::before,
.course-faq__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--color-gold-600);
  transform: translate(-50%, -50%);
}

.course-faq__icon::before {
  width: 0.55rem;
  height: 1.5px;
}

.course-faq__icon::after {
  width: 1.5px;
  height: 0.55rem;
  transition: opacity 0.2s var(--ease-out);
}

.course-faq__item[open] .course-faq__icon {
  background: var(--color-accent);
  border-color: var(--color-accent);
  transform: rotate(90deg);
}

.course-faq__item[open] .course-faq__icon::after {
  opacity: 0;
}

.course-faq__item p {
  margin: 0;
  padding: 0 0 1.05rem;
  padding-left: calc(1.6rem + var(--space-3));
  color: var(--color-muted);
  line-height: 1.55;
  max-width: 62ch;
}

.course-bundles {
  list-style: none;
  margin: var(--space-4) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.course-bundles__item {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  padding: var(--space-5) var(--space-4);
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-top: 3px solid var(--color-navy-800);
  border-radius: 0.35rem 0.35rem 0.85rem 0.85rem;
  background: var(--color-white);
}

.course-bundles__item:nth-child(2) {
  border-top-color: var(--color-gold-600);
}

.course-bundles__badge {
  margin: 0;
  color: var(--color-gold-600);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.course-bundles__item h3 {
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.25;
  color: var(--color-navy-900);
}

.course-bundles__detail {
  margin: 0;
  color: var(--color-muted);
  line-height: 1.55;
  flex: 1;
  font-size: 0.95rem;
}

.course-bundles__price {
  margin: 0.5rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: clamp(1.55rem, 2.2vw, 1.85rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.course-bundles__price--text {
  font-size: 1.05rem;
  letter-spacing: 0;
  line-height: 1.3;
}

.course-bundles__note {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.course-bundles__cta {
  margin-top: 0.5rem;
  align-self: start;
  color: var(--color-navy-900);
  font-weight: 700;
  font-size: 0.92rem;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.course-bundles__cta:hover {
  color: var(--color-navy-700);
}

.course-related {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.course-related__item {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: 1.15rem;
  background: var(--color-white);
  transition: transform 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

.course-related__item:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 32px rgba(11, 31, 58, 0.1);
}

.course-related__media {
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: var(--color-navy-800);
}

.course-related__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s var(--ease-out);
}

.course-related__item:hover .course-related__media img {
  transform: scale(1.04);
}

.course-related__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1rem 1.05rem 1.15rem;
}

.course-related__item h3 {
  margin: 0.2rem 0 0.45rem;
  font-size: 1.02rem;
}

.course-related__item h3 a {
  color: inherit;
  text-decoration: none;
}

.course-related__item h3 a:hover {
  color: var(--color-navy-700);
}

.course-related__body > p:not(.card__meta) {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.92rem;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.course-related__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: auto;
  padding-top: 0.9rem;
}

.course-related__price {
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-weight: 700;
}

.course-related__link {
  color: var(--color-navy-800);
  font-family: var(--font-nav);
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
}

.course-related__link:hover {
  color: var(--color-gold-600);
}

.course-aside {
  position: sticky;
  top: 12rem;
}

.course-panel {
  padding: var(--space-4) var(--space-5);
  border: 1px solid rgba(18, 48, 86, 0.1);
  border-radius: 1.15rem;
  background:
    linear-gradient(180deg, rgba(230, 180, 34, 0.06), transparent 28%),
    var(--color-white);
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.06);
}

.course-panel__pricing {
  margin-bottom: var(--space-4);
  padding: 0.35rem 0 var(--space-4);
  border-bottom: 1px solid rgba(18, 48, 86, 0.08);
}

.course-panel__claims {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.45rem;
  list-style: none;
  margin: 0 0 var(--space-4);
  padding: 0;
}

.course-panel__claims:empty {
  margin: 0;
}

.course-panel__claim {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.65rem;
  border: 1px solid rgba(31, 122, 77, 0.28);
  border-radius: 0.4rem;
  background: rgba(31, 122, 77, 0.08);
  color: var(--color-success);
  font-family: var(--font-nav);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
}

.course-panel__claim--long {
  flex: 1 1 100%;
  display: block;
  padding: 0.25rem 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-muted);
  font-family: inherit;
  font-size: 0.86rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.5;
  white-space: normal;
}

.course-panel__claim::before {
  content: "";
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

.course-panel__claim--long::before {
  content: none;
}

.course-panel__claim-points {
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: 1.05em;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.course-price__eyebrow {
  margin: 0 0 0.65rem;
  color: var(--color-gold-600);
  font-family: var(--font-nav);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.course-price__hero {
  margin: 0;
}

.course-price__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 1rem;
}

.course-price__hero strong {
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: clamp(2rem, 2.6vw, 2.45rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.05;
}

.course-price__was {
  color: var(--color-slate-400);
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 400;
  letter-spacing: -0.01em;
  opacity: 0.85;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

.course-panel__actions {
  margin-bottom: var(--space-3);
}

.course-panel__actions .btn {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.course-brochure {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.45rem;
  padding: 0.7rem 0.85rem;
  border: 1px dashed var(--color-border);
  border-radius: 0.75rem;
  color: inherit;
  text-decoration: none;
  transition: border-color 0.2s var(--ease-out), background 0.2s var(--ease-out);
}

.course-brochure[hidden] {
  display: none;
}

.course-brochure:last-of-type {
  margin-bottom: var(--space-4);
}

.course-brochure:hover {
  border-color: var(--color-navy-700);
  background: var(--color-surface-alt);
}

.course-brochure__icon {
  display: grid;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 0.55rem;
  background: var(--color-navy-900);
  color: var(--color-white);
  flex-shrink: 0;
}

.course-brochure strong,
.course-brochure small {
  display: block;
}

.course-brochure strong {
  margin-bottom: 0.05rem;
  font-size: 0.9rem;
}

.course-brochure small {
  color: var(--color-muted);
  font-size: 0.76rem;
}

.course-panel__meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}

.course-panel__meta li {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  padding: 0.55rem 0;
  border-top: 1px solid var(--color-border);
  font-size: 0.88rem;
}

.course-panel__meta li:last-child {
  padding-bottom: 0;
}

.course-panel__meta span {
  color: var(--color-muted);
}

.course-panel__meta strong {
  color: var(--color-ink);
  text-align: right;
}

.course-register {
  --course-register-pad: clamp(3.25rem, 6vw, 5.5rem);
  background:
    linear-gradient(180deg, rgba(245, 247, 250, 0.92) 0%, rgba(255, 255, 255, 0.98) 48%, #fff 100%);
  color: var(--color-ink);
  padding: var(--course-register-pad) 0;
  margin-bottom: var(--space-8);
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  scroll-margin-top: 5.5rem;
}

.course-register__inner {
  display: grid;
  grid-template-columns: minmax(0, 18rem) minmax(0, 1fr);
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
  max-width: 68rem;
}

.course-register__eyebrow {
  margin: 0 0 var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-slate-600);
}

.course-register__intro h2 {
  margin: 0 0 var(--space-4);
  color: var(--color-navy-900);
  font-size: clamp(1.65rem, 2.4vw, 2.15rem);
  line-height: 1.15;
  font-weight: 700;
}

.course-register__intro p {
  margin: 0;
  max-width: 22rem;
  color: var(--color-muted);
  line-height: 1.65;
  font-size: 1rem;
}

.form--course-register {
  gap: var(--space-5);
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 1.25rem;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.04);
}

.form--course-register .form-grid {
  gap: var(--space-5);
}

.course-register__delivery-row {
  max-width: 18rem;
}

.course-register__delivery-label {
  display: block;
  font-family: var(--font-nav);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-slate-600);
  margin-bottom: 0.4rem;
}

.course-register__delivery {
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 0.4rem;
  width: fit-content;
}

.course-register__choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 1.9rem;
  margin: 0;
  padding: 0.28rem 0.7rem;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  cursor: pointer;
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1;
  color: var(--color-ink);
}

.course-register__choice:has(input:checked) {
  border-color: var(--color-brand, #0b5fff);
  box-shadow: 0 0 0 1px var(--color-brand, #0b5fff);
  background: #fff;
}

.course-register__choice input {
  width: 0.75rem;
  height: 0.75rem;
  margin: 0;
  accent-color: var(--color-brand, #0b5fff);
}

.course-register__submit {
  width: auto;
  min-width: 12.5rem;
  margin-top: var(--space-2);
}

.form--course-register .form-row:has(textarea) {
  min-height: 6.25rem;
}

.form--course-register .form-row textarea {
  min-height: 6.25rem;
}

@media (max-width: 1100px) {
  .course-related {
    grid-template-columns: 1fr;
  }

  .course-bundles {
    grid-template-columns: 1fr;
  }

  .course-related__item {
    display: grid;
    grid-template-columns: 10rem minmax(0, 1fr);
  }

  .course-related__media {
    height: 100%;
    aspect-ratio: auto;
  }
}

@media (max-width: 960px) {
  .blog-article__layout {
    grid-template-columns: 1fr;
    padding-top: calc(var(--header-h) + var(--space-6));
  }

  .blog-article__shell {
    max-width: none;
  }

  .blog-article__aside {
    position: static;
    order: 2;
  }

  .course-detail.section {
    padding-top: calc(var(--header-h) + var(--space-7));
  }

  .course-intro {
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content"
      "facts";
  }

  .course-intro__media {
    min-height: 14rem;
  }

  .course-layout {
    grid-template-columns: 1fr;
  }

  .course-aside {
    position: static;
    order: -1;
  }

  .blog-article__more-grid,
  .blog-article__courses-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .course-gallery {
    grid-template-columns: 1fr;
  }

  .course-gallery {
    grid-template-rows: none;
  }

  .course-gallery__item--hero {
    grid-row: auto;
    min-height: 14rem;
  }

  .course-gallery__item {
    min-height: 11rem;
  }

  .course-intro__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .course-register__inner {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }

  .course-register__intro p {
    max-width: 36rem;
  }

  .form--course-register {
    padding: var(--space-5);
  }

  .course-register__submit {
    width: 100%;
  }

  .course-outline__item summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: var(--space-2);
  }

  .course-outline__body {
    padding-left: var(--space-5);
  }
}

@media (max-width: 640px) {
  .course-intro {
    padding: var(--space-4);
  }

  .course-intro__facts {
    grid-template-columns: 1fr;
  }

  .course-format {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .course-related__item {
    grid-template-columns: 1fr;
  }

  .course-schedule__item {
    flex-direction: column;
    align-items: flex-start;
  }

  .course-schedule__meta {
    width: 100%;
    justify-content: space-between;
  }

  .course-block__head {
    align-items: stretch;
  }

  .course-range {
    width: 100%;
  }

  .course-range__btn {
    flex: 1;
  }

  .course-faq__item summary {
    grid-template-columns: auto 1fr;
  }

  .course-faq__icon {
    grid-column: 2;
    justify-self: end;
  }

  .course-faq__item p {
    padding-left: 0;
  }
}

.prose {
  max-width: 65ch;
}

.prose h2 {
  margin-top: var(--space-6);
}

.reveal {
  opacity: 1;
  transform: none;
  transition: opacity 0.35s var(--ease-out), transform 0.35s var(--ease-out);
}

/* Below-fold only — applied by JS after html.js is set so content never starts blank */
html.js .reveal.reveal--pending:not(.is-visible) {
  opacity: 0;
  transform: translateY(10px);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

@keyframes chrome-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes hero-in {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 1120px) {
  :root {
    --float-inset: 1.25rem;
  }

  .site-header {
    border-radius: 0 0 var(--float-radius) var(--float-radius);
  }

  .site-header__inner {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    width: 100%;
  }

  .site-header.nav-expanded {
    border-radius: 0 0 var(--float-radius) var(--float-radius);
  }

  .brand {
    order: 1;
  }

  .nav-actions {
    order: 2;
    margin-left: auto;
    justify-self: auto;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 16rem;
  }

  .nav-search {
    width: 100%;
  }

  .nav-toggle {
    display: inline-grid;
    order: 3;
    margin-left: 0;
    flex-shrink: 0;
  }

  .site-nav {
    order: 4;
    position: absolute;
    top: calc(100% + 0.55rem);
    left: 0;
    right: 0;
    z-index: 40;
    justify-self: stretch;
    background: #fffcf7;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 1.1rem;
    padding: 0.85rem 1rem 1rem;
    flex-direction: column;
    align-items: stretch;
    gap: 0.85rem;
    box-shadow: 0 16px 36px rgba(11, 31, 58, 0.14);
    transform: translateY(-0.5rem);
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transition: transform 0.25s var(--ease-out), opacity 0.25s var(--ease-out), visibility 0.25s;
  }

  .site-nav.is-open {
    transform: none;
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
  }

  .site-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .site-nav__list a {
    display: block;
    padding: 0.75rem 0.25rem;
    font-size: 1.125rem;
    font-weight: 600;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  }

  .site-nav__list a::after {
    display: none;
  }

  .mega-menu:not(.mega-menu--mobile) {
    display: none !important;
  }

  .site-header.mega-open {
    border-radius: 0 0 var(--float-radius) var(--float-radius);
  }

  .mega-menu--mobile.is-open {
    display: block;
    position: relative;
    margin: 0.15rem 0 0.35rem;
    padding: 0.35rem 2.4rem 0.55rem 0.55rem;
    border-left: 2px solid rgba(26, 63, 111, 0.18);
    max-height: min(60vh, 28rem);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .mega-menu--mobile .mega-menu__close {
    top: 0.15rem;
    right: 0.1rem;
    width: 1.85rem;
    height: 1.85rem;
    background: transparent;
  }

  .mega-menu--mobile .mega-menu__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
  }

  .mega-menu--mobile a.mega-menu__browse {
    align-self: flex-end;
    margin-top: 0.35rem;
    display: inline-flex;
    padding: 0.45rem 0.95rem;
    font-size: 0.8125rem;
    font-weight: 700;
  }

  .mega-menu--mobile .mega-menu__col--topic-collection > .mega-menu__node > .mega-menu__list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .mega-menu--mobile .mega-menu__list {
    gap: 0.35rem;
  }

  .mega-menu--mobile a {
    display: inline;
    padding: 0.15rem 0;
    font-size: 0.9375rem;
    font-weight: 600;
    border-bottom: 0;
  }

  .mega-menu--mobile .mega-menu__pillar {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 1rem;
  }

  .mega-menu--mobile .mega-menu__subject {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-slate-400);
    margin-bottom: 0.4rem;
  }

  .mega-menu--mobile .mega-menu__group {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-ink);
  }

  .mega-menu--mobile .mega-menu__node--d1 > .mega-menu__list {
    padding-left: 0.55rem;
    border-left: 2px solid rgba(15, 23, 42, 0.08);
  }

  .mega-menu--mobile .mega-menu__item--leaf {
    font-size: 0.8125rem;
    padding: 0.1rem 0;
  }
}

@media (max-width: 1024px) {
  .blog-catalog__layout,
  .courses-catalog__layout {
    grid-template-columns: 1fr;
  }

  .blog-sidebar {
    position: static;
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    padding-bottom: var(--space-5);
  }

  .blog-sidebar__nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.4rem;
    overflow-x: auto;
    padding-bottom: 0.15rem;
    scrollbar-width: thin;
  }

  .blog-cat {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
  }

  .blog-main {
    padding-top: var(--space-6);
  }

  .blog-featured__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .blog-featured__grid .blog-feature:last-child:nth-child(3) {
    grid-column: 1 / -1;
    max-width: 36rem;
    justify-self: center;
    width: 100%;
  }

  .blog-browse__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .blog-ask {
    grid-template-columns: 1fr;
  }

  .testimonials-bento {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .t-card,
  .t-card--tall {
    grid-column: span 3;
    grid-row: span 1;
  }

  .t-card--featured {
    grid-column: span 6;
    grid-row: span 1;
  }

  .t-card--wide {
    grid-column: span 6;
    grid-row: span 1;
  }

  .t-card--tall .t-card__media--video {
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  .courses-sidebar {
    position: static;
    top: auto;
    align-self: auto;
    height: auto;
    overflow: visible;
    padding: var(--space-4) var(--space-5);
    border-right: 0;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  }

  .catalog-filters .schedule-dates {
    grid-template-columns: 1fr 1fr;
  }

  .catalog-filters .schedule-dates__field input {
    height: 2.75rem;
  }

  .courses-sidebar__nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.4rem;
    overflow-x: auto;
    padding-bottom: 0.15rem;
    scrollbar-width: thin;
  }

  .courses-cat {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .courses-sidebar__all {
    display: none;
  }

  .courses-main {
    padding-top: var(--space-6);
  }

  .schedule-catalog__layout {
    grid-template-columns: 1fr;
  }

  .schedule-sidebar {
    position: static;
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  }

  .schedule-main {
    padding-inline: var(--space-5);
    --schedule-content-width: 100%;
  }

  .schedule-main__head,
  .schedule-notify {
    width: var(--schedule-content-width);
  }

  .schedule-day {
    --schedule-badge-size: 4.75rem;
    grid-template-columns: var(--schedule-badge-size) minmax(0, 1fr);
    gap: var(--space-3);
  }

  .schedule-day__badge {
    padding: var(--space-2);
  }

  .schedule-day__day {
    font-size: 1rem;
  }

  .schedule-course {
    padding: var(--space-4);
  }

  .schedule-course__head {
    flex-direction: column;
    gap: var(--space-2);
  }

  .schedule-course__facts {
    align-items: flex-start;
    text-align: left;
  }

  .schedule-card,
  .schedule-card--session {
    grid-template-columns: 1fr;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
  }

  .schedule-card__duration,
  .schedule-card__range,
  .schedule-card__price {
    white-space: normal;
  }

  .schedule-card__enquire {
    width: 100%;
  }

  .schedule-notify {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .schedule-notify__icon {
    margin-inline: auto;
  }

  .schedule-notify__btn {
    justify-self: center;
    width: 100%;
  }

  .schedule-benefits__grid {
    grid-template-columns: 1fr;
  }

  .courses-grid,
  .blog-browse__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .blog-featured__grid {
    grid-template-columns: 1fr;
  }

  .blog-featured__grid .blog-feature:last-child:nth-child(3) {
    grid-column: auto;
    max-width: none;
  }

  .grid--3,
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }

  .footer-cert {
    grid-column: 1 / -1;
  }

  .contact-layout,
  .split {
    grid-template-columns: 1fr;
  }

  .about-story__layout,
  .about-audience__layout,
  .about-faq__body {
    grid-template-columns: 1fr;
  }

  .about-visit__panel {
    grid-template-columns: 1fr;
    padding: var(--space-5);
  }

  .about-visit__media img {
    aspect-ratio: 16 / 9;
    max-height: none;
  }

  .about-visit__fact {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }

  .about-credentials__bento {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "intro intro"
      "hrd cidb"
      "mof autodesk";
  }

  .cred-tile--intro {
    min-height: 0;
  }

  .cred-tile--intro h2 {
    max-width: none;
  }

  .cred-tile__logo {
    min-height: 8.5rem;
  }

  .cred-tile__logo img {
    height: 5.25rem;
  }

  .cred-tile--autodesk .cred-tile__logo img {
    height: 3.75rem;
  }

  .about-faq__media {
    position: relative;
    height: auto !important;
    aspect-ratio: 16 / 10;
  }

  .about-faq__media-caption {
    flex-wrap: wrap;
  }

  .about-faq__a {
    padding-left: 0;
  }

  .about-pillars,
  .about-pillars--wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-story__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-values__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-values__grid > .about-value:nth-child(7) {
    grid-column: 1 / -1;
    width: min(100%, calc((100% - var(--space-5)) / 2));
    justify-self: center;
  }

  .in-house-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-formats__grid {
    grid-template-columns: 1fr;
  }

  .about-path__steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .about-industries__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-facilities__gallery {
    grid-template-columns: 1fr;
  }

  .about-facilities__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .form--contact .form-grid {
    grid-template-columns: 1fr;
  }

  .hero__stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    max-width: none;
  }

  .trust__certs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: var(--space-3);
  }

  .trust__certs li {
    min-height: 7rem;
    padding: var(--space-4) var(--space-3);
    border-radius: 1.1rem;
  }

  .trust__certs img {
    height: 4.5rem;
  }


  .mastery__grid {
    grid-template-columns: 1fr 1fr;
  }

  .mastery-card--featured {
    grid-column: span 2;
    min-height: 15rem;
  }

  .mastery-card--featured .mastery-card__body,
  .mastery-card--tile .mastery-card__body {
    max-width: min(20rem, 70%);
  }

  .contact-map__street {
    right: 0.85rem;
    bottom: 0.85rem;
    width: min(18rem, calc(100% - 1.75rem));
  }
}

@media (max-width: 768px) {
  .catalog-search {
    display: none;
  }

  .courses-main__head {
    position: sticky;
    top: 0;
    z-index: 90;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: var(--space-4);
    padding: 0.5rem 0.6rem;
    background: rgba(255, 252, 247, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 0.75rem;
    box-shadow: 0 2px 12px rgba(11, 31, 58, 0.06);
  }

  .courses-main__tools {
    width: 100%;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 0.5rem;
  }

  .courses-main__sort {
    margin-left: auto;
  }

  .courses-main__sort select {
    min-width: 0;
    font-size: 0.78rem;
    padding: 0.3rem 0.6rem;
  }

  .courses-main__count {
    white-space: nowrap;
    font-size: 0.75rem;
    flex-shrink: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .filter-drawer__toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    position: relative;
    border: 1px solid rgba(15, 23, 42, 0.15);
    border-radius: 999px;
    padding: 0.45rem 0.9rem;
    background: var(--color-surface);
    font-family: var(--font-nav);
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--color-navy-900);
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
  }

  .filter-drawer__toggle:hover {
    border-color: rgba(15, 23, 42, 0.3);
  }

  .filter-drawer__mobile-controls {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.75rem 1rem 1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    margin-bottom: 0.5rem;
  }

  .filter-drawer__mobile-controls .catalog-view-toggle {
    width: 100%;
  }

  .filter-drawer__mobile-controls .catalog-view-toggle__btn {
    flex: 1;
  }

  .filter-drawer__mobile-controls .courses-main__sort {
    width: 100%;
  }

  .filter-drawer__mobile-controls .courses-main__sort select {
    width: 100%;
  }

  .courses-main__head > .catalog-view-toggle {
    display: none;
  }

  .courses-main__tools .courses-main__sort {
    display: none;
  }

  .filter-drawer__toggle.has-active::after {
    content: "";
    position: absolute;
    top: 0.3rem;
    right: 0.35rem;
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: var(--color-gold-600, #d97706);
  }

  .filter-drawer__close {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--color-navy-900);
    cursor: pointer;
    transition: background 0.15s;
  }

  .filter-drawer__close:hover {
    background: rgba(15, 23, 42, 0.06);
  }

  .courses-sidebar {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1100;
    width: min(18rem, 85vw);
    height: 100vh;
    height: 100dvh;
    overflow-y: auto;
    padding: var(--space-6) var(--space-5) var(--space-7);
    background: var(--color-surface);
    border-right: 0;
    border-left: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
    transform: translateX(100%);
    transition: transform 0.3s ease;
    visibility: hidden;
  }

  .courses-sidebar.is-open {
    transform: translateX(0);
    visibility: visible;
  }

  .filter-drawer__backdrop {
    position: fixed;
    inset: 0;
    z-index: 1099;
    background: rgba(15, 23, 42, 0.35);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
  }

  .filter-drawer__backdrop.is-visible {
    display: block;
    opacity: 1;
    pointer-events: auto;
  }

  .courses-grid,
  .blog-browse__grid,
  .blog-article__more-grid,
  .blog-article__courses-grid {
    grid-template-columns: 1fr;
  }

  .testimonials-page__head {
    justify-content: flex-start;
  }

  .testimonials-category {
    width: 100%;
  }

  .testimonials-category__control {
    flex: 1;
    min-width: 0;
  }

  .testimonials-bento {
    grid-template-columns: 1fr;
  }

  .t-card,
  .t-card--featured,
  .t-card--wide,
  .t-card--tall {
    grid-column: span 1;
    grid-row: span 1;
  }

  .testimonials-cta__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .brand img {
    height: 2.5rem;
  }

  .brand {
    flex-shrink: 0;
    min-width: 0;
  }

  .about-hero,
  .contact-hero,
  .schedule-hero,
  .page-hero {
    --page-hero-h: 16.5rem;
    --page-hero-pad-top: calc(var(--header-h) + var(--space-6));
    --page-hero-pad-bottom: var(--space-6);
  }

  .contact-hero__content,
  .about-hero__content,
  .schedule-hero__content,
  .page-hero .container {
    text-align: center;
  }

  .page-hero h1,
  .schedule-hero h1,
  .about-hero__content h1,
  .contact-hero__content h1,
  .page-hero .lead,
  .schedule-hero__lead,
  .about-hero__content p,
  .contact-hero__content p {
    margin-inline: auto;
  }

  .about-credentials__bento {
    grid-template-columns: 1fr;
    grid-template-areas:
      "intro"
      "hrd"
      "cidb"
      "mof"
      "autodesk";
  }

  .cred-tile__logo {
    min-height: 8rem;
  }

  .cred-tile__logo img {
    height: 5.5rem;
    max-width: min(100%, 14rem);
  }

  .cred-tile--autodesk .cred-tile__logo img {
    height: 4rem;
    max-width: min(100%, 16rem);
  }

  .about-story,
  .about-approach,
  .about-credentials,
  .about-journey,
  .about-values,
  .about-formats,
  .about-path,
  .about-industries,
  .about-audience,
  .about-facilities,
  .about-faq,
  .about-visit {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .about-story__stats {
    gap: var(--space-3);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-pillars,
  .about-pillars--wide {
    grid-template-columns: 1fr;
  }

  .about-values__grid {
    grid-template-columns: 1fr;
  }

  .about-values__grid > .about-value:nth-child(7) {
    grid-column: auto;
    width: auto;
    justify-self: stretch;
  }

  .about-path__steps {
    grid-template-columns: 1fr;
  }

  .about-industries__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-facilities__grid {
    grid-template-columns: 1fr;
  }

  .in-house-gallery {
    grid-template-columns: 1fr;
  }

  .in-house-cards {
    grid-template-columns: 1fr;
  }

  .in-house-form__grid {
    grid-template-columns: 1fr;
  }

  .in-house-intro,
  .in-house-gallery-section,
  .in-house-outro {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .about-timeline__item {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }

  .about-timeline__year {
    min-width: auto;
  }

  .about-story__media {
    order: -1;
    border-radius: 1rem;
  }

  .about-cta {
    padding: var(--space-7) 0;
  }

  .about-cta__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .contact-main {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .contact-quick-actions {
    grid-template-columns: 1fr;
  }

  .contact-faq__head {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
  }

  .contact-map__street {
    display: none;
  }

  .contact-submit {
    min-height: 3.1rem;
  }

  #contact-form {
    scroll-margin-top: 6rem;
  }

  .grid--3,
  .grid--2,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .site-footer {
    margin: auto 0 0;
    border-radius: 1.5rem 1.5rem 0 0;
    padding: var(--space-7) 0 var(--space-5);
  }

  .wa-float {
    width: 4rem;
    height: 4rem;
    right: max(2.5rem, calc(env(safe-area-inset-right, 0px) + 2rem));
    bottom: max(2.5rem, calc(env(safe-area-inset-bottom, 0px) + 2rem));
  }

  .wa-float svg {
    width: 28px;
    height: 28px;
  }

  .footer-cert {
    grid-column: auto;
  }

  .hero {
    min-height: min(100svh, 40rem);
    align-items: center;
    padding-top: var(--header-h);
  }

  .hero__content {
    padding: var(--space-5) 0 var(--space-7);
    max-width: none;
  }

  .hero h1 {
    font-size: clamp(2.35rem, 8.5vw, 3.1rem);
  }

  .hero .lead {
    font-size: clamp(1.1rem, 3.2vw, 1.25rem);
  }

  .hero .btn {
    min-height: 3.2rem;
    padding: 0.85rem 1.35rem 0.85rem 1.45rem;
    font-size: 0.9rem;
    letter-spacing: 0.035em;
  }

  .hero__stats {
    margin-top: 0;
    padding: var(--space-4) 0;
  }

  .hero__stats .stat-card {
    padding: 0.35rem 0.85rem;
  }

  .hero__stats .stat-card__value {
    font-size: clamp(1.15rem, 4.5vw, 1.4rem);
  }

  .page-hero {
    padding: 0;
  }

  .btn-row {
    flex-direction: column;
    align-items: stretch;
  }

  .btn-row .btn {
    width: 100%;
    text-align: center;
  }

  .trust {
    padding-top: var(--space-6);
    padding-bottom: var(--space-7);
  }

  .trust__inner {
    gap: var(--space-5);
  }

  .trust__certs {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
  }

  .trust__certs li {
    min-height: 6.5rem;
    padding: var(--space-4) var(--space-3);
    border-radius: 1.1rem;
  }

  .trust__certs li:nth-child(even) {
    transform: none;
  }

  .trust__certs img {
    height: 4.25rem;
  }

  .audience-routes {
    padding-top: var(--space-6);
    padding-bottom: var(--space-7);
  }

  .audience-routes .section__head {
    margin-bottom: var(--space-5);
  }

  .audience-route__card {
    padding: var(--space-4);
  }

  .mastery {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .mastery__head {
    flex-direction: column;
    align-items: flex-start;
  }

  .mastery__actions {
    width: 100%;
  }

  .mastery__select {
    flex: 1 1 auto;
  }

  .mastery__select-control {
    flex: 1 1 auto;
    min-width: 0;
  }

  .mastery__grid {
    grid-template-columns: 1fr;
  }

  .mastery-card,
  .mastery-card--featured {
    grid-column: auto;
    min-height: 14rem;
  }

  .mastery-card--featured .mastery-card__media,
  .mastery-card--tile .mastery-card__media {
    left: 0;
  }

  .mastery-card--featured .mastery-card__media::before {
    background: linear-gradient(180deg, transparent 18%, rgba(11, 31, 58, 0.78) 100%);
  }

  .mastery-card--tile .mastery-card__media::before {
    background: linear-gradient(180deg, transparent 22%, rgba(255, 255, 255, 0.94) 100%);
  }

  .mastery-card--featured .mastery-card__body,
  .mastery-card--tile .mastery-card__body {
    max-width: none;
    justify-content: flex-end;
    background: transparent;
    padding: 1.15rem 1.2rem 1.25rem;
  }

  .content-hub__grid {
    grid-template-columns: 1fr;
  }

  .content-hub {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .content-hub__head {
    flex-direction: column;
    align-items: flex-start;
  }

  .success {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .success::before,
  .success::after {
    filter: blur(72px);
    opacity: 0.22;
  }

  .success__head {
    margin-bottom: var(--space-4);
  }
}

@media (max-width: 480px) {
  :root {
    --float-inset: 1rem;
  }

  .site-header__inner {
    gap: 0.5rem;
    padding: 0.4rem 0.65rem 0.45rem 0.55rem;
  }

  .brand img {
    height: 2.15rem;
  }

  .nav-actions {
    max-width: none;
    flex: 1 1 auto;
  }

  .nav-search {
    height: 2.45rem;
    padding: 0 0.35rem 0 0.3rem;
  }

  .nav-search__submit {
    width: 1.85rem;
    height: 1.85rem;
  }

  .nav-search__submit svg {
    width: 0.95rem;
    height: 0.95rem;
  }

  .nav-search input {
    font-size: 0.8125rem;
  }

  .nav-toggle {
    width: 2.25rem;
    height: 2.25rem;
  }

  .nav-toggle__icon {
    width: 1.1rem;
    height: 1.1rem;
  }

  .hero h1 {
    font-size: clamp(2rem, 8.5vw, 2.5rem);
  }

  .hero .lead {
    font-size: clamp(1.05rem, 3.5vw, 1.15rem);
  }

  .hero__stats {
    margin-top: 0;
  }

  .section {
    padding: var(--space-7) 0;
  }

  #course-catalog-combined .courses-main {
    padding-inline: var(--space-3);
  }

  .catalog-view-toggle {
    width: 100%;
  }

  .courses-main__tools {
    flex-wrap: wrap;
  }

  .courses-main__sort select {
    min-width: 0;
    width: 100%;
  }

  .courses-sidebar {
    padding-inline: var(--space-3);
  }

  .course-card__media img {
    aspect-ratio: 16 / 9;
  }
}

@media (max-width: 350px) {
  .trust__certs {
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }

  .trust__certs li {
    min-height: 6rem;
  }

  .trust__certs img {
    height: 4rem;
  }
}

/* —— Course category pages (Type A / Type B) —— */
.category-app {
  min-height: 50vh;
}

.category-section-head {
  margin-bottom: var(--space-6);
  max-width: 42rem;
}

.category-section-head h2 {
  margin: 0 0 var(--space-3);
}

.category-section-head .lead {
  margin: 0;
  color: var(--color-muted);
}

.category-section-head--light h2 {
  color: var(--color-on-brand);
}

/* Editorial blueprint hero — distinct from homepage photo bleed */
.category-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--color-ink);
  background:
    linear-gradient(155deg, #f7f9fc 0%, #eef3f8 42%, #e6edf5 100%);
  padding: calc(var(--header-h) + var(--space-7)) 0 var(--space-8);
  min-height: clamp(28rem, 72vh, 40rem);
  display: grid;
  align-items: center;
}

.category-hero__atmosphere {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.category-hero__grid {
  position: absolute;
  inset: -10% -5%;
  background-image:
    linear-gradient(rgba(18, 48, 86, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 48, 86, 0.055) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 70% 65% at 30% 40%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 70% 65% at 30% 40%, #000 20%, transparent 75%);
  animation: category-grid-drift 28s linear infinite;
}

.category-hero__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
  opacity: 0.55;
}

.category-hero__glow--a {
  width: min(42vw, 28rem);
  height: min(42vw, 28rem);
  top: -8%;
  right: 8%;
  background: rgba(230, 180, 34, 0.22);
}

.category-hero__glow--b {
  width: min(50vw, 34rem);
  height: min(50vw, 34rem);
  bottom: -18%;
  left: -8%;
  background: rgba(18, 48, 86, 0.12);
}

.category-hero--b .category-hero__glow--a {
  background: rgba(26, 63, 111, 0.18);
  right: auto;
  left: 55%;
}

.category-hero--b .category-hero__glow--b {
  background: rgba(230, 180, 34, 0.16);
  left: auto;
  right: -6%;
}

.category-hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(16rem, 0.85fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: end;
}

.category-hero--solo .category-hero__inner {
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
}

.category-hero--solo .category-hero__copy {
  max-width: 44rem;
}

.category-hero__media {
  margin: 0;
  align-self: center;
  justify-self: end;
  width: min(100%, 28rem);
  animation: none;
}

.category-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  max-height: clamp(18rem, 42vh, 28rem);
  object-fit: cover;
  border-radius: 0;
  box-shadow: 0 24px 48px rgba(11, 31, 58, 0.18);
  outline: 1px solid rgba(18, 48, 86, 0.08);
  outline-offset: 6px;
}

.category-hero__copy {
  max-width: 40rem;
  animation: none;
}

.category-breadcrumb,
.category-hero__crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  min-height: 1.5rem;
  font-family: var(--font-nav);
  font-size: 0.82rem;
  margin-bottom: var(--space-5);
  color: var(--color-slate-600);
}

.category-breadcrumb a,
.category-hero__crumb a {
  color: var(--color-navy-800);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.25s var(--ease-out);
}

.category-breadcrumb a:hover,
.category-hero__crumb a:hover {
  border-bottom-color: var(--color-gold-500);
}

.about-hero .category-breadcrumb,
.contact-hero .category-breadcrumb,
.page-hero .category-breadcrumb {
  color: rgba(255, 255, 255, 0.72);
}

.about-hero .category-breadcrumb a,
.contact-hero .category-breadcrumb a,
.page-hero .category-breadcrumb a {
  color: var(--color-white);
}

.about-hero .category-breadcrumb a:hover,
.contact-hero .category-breadcrumb a:hover,
.page-hero .category-breadcrumb a:hover {
  border-bottom-color: var(--color-gold-400);
}

.testimonials-page .category-breadcrumb,
.blog-main > .category-breadcrumb,
.courses-main > .category-breadcrumb {
  margin-bottom: var(--space-5);
}

.course-intro__content > .category-breadcrumb {
  margin-bottom: var(--space-4);
}

.category-hero h1 {
  font-family: var(--font-display);
  font-size: clamp(2.55rem, 5.6vw, 4.15rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0 0 var(--space-4);
  color: var(--color-navy-900);
  max-width: 12.5ch;
  text-wrap: balance;
  position: relative;
}

.category-hero h1::after {
  content: "";
  display: block;
  width: 3.5rem;
  height: 3px;
  margin-top: var(--space-4);
  background: linear-gradient(90deg, var(--color-gold-500), transparent);
}

.category-hero--a h1::after {
  display: none;
}

.category-hero--b h1::after {
  background: linear-gradient(90deg, var(--color-navy-700), var(--color-gold-500));
}

.category-hero__tagline {
  max-width: 34rem;
  margin: 0 0 var(--space-6);
  font-size: clamp(1.05rem, 1.7vw, 1.25rem);
  line-height: 1.55;
  color: var(--color-slate-600);
}

.category-hero__ctas {
  gap: 0.85rem;
  margin-bottom: var(--space-5);
}

.category-hero__ctas .btn {
  min-height: 3.1rem;
  font-family: var(--font-nav);
  font-weight: 600;
  letter-spacing: 0.03em;
}

.category-hero__ctas .btn--secondary {
  background: transparent;
  color: var(--color-navy-900);
  border-color: rgba(11, 31, 58, 0.35);
}

.category-hero__ctas .btn--secondary:hover {
  background: var(--color-navy-900);
  color: var(--color-on-brand);
  border-color: var(--color-navy-900);
}

.category-hero__ctas .btn__arrow {
  transition: transform 0.35s var(--ease-out);
}

.category-hero__ctas .btn:hover .btn__arrow {
  transform: translateX(4px);
}

.category-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0;
}

.category-hero__badges span {
  font-family: var(--font-nav);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-navy-800);
  padding: 0.35rem 0;
  border-bottom: 2px solid rgba(230, 180, 34, 0.55);
}

@keyframes category-grid-drift {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-48px, -48px, 0);
  }
}

.category-trust {
  background: var(--color-navy-900);
  color: var(--color-white);
  padding: var(--space-4) 0;
  border-top: 1px solid rgba(230, 180, 34, 0.35);
}

.category-trust__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 500;
  justify-content: space-between;
}

.category-trust__list li {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}

.category-trust__mark {
  width: 0.45rem;
  height: 0.45rem;
  background: var(--color-gold-500);
  flex-shrink: 0;
}

.category-context {
  background:
    radial-gradient(ellipse 60% 50% at 100% 0%, rgba(230, 180, 34, 0.08), transparent 55%),
    var(--color-white);
}

.category-context__layout {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: minmax(12rem, 0.75fr) minmax(0, 1.4fr);
  align-items: start;
}

.category-context__layout--with-media {
  grid-template-areas:
    "head body"
    "media body";
  grid-template-rows: auto 1fr;
  align-items: stretch;
  column-gap: var(--space-6);
  row-gap: var(--space-6);
}

.category-context__layout--with-media .category-section-head {
  grid-area: head;
}

.category-context__layout--with-media .category-context__body {
  grid-area: body;
}

.category-context__layout--with-media .category-context__media {
  grid-area: media;
}

.category-context__layout--center-copy {
  grid-template-areas:
    "head ."
    "media body";
  grid-template-rows: auto auto;
  align-items: start;
}

.category-context__layout--center-copy .category-context__media {
  aspect-ratio: 1 / 1;
}

.category-context__layout--center-copy .category-context__body {
  align-self: center;
}

.category-context__layout .category-section-head {
  margin-bottom: 0;
}

.category-context__layout .category-section-head h2 {
  margin: 0;
  font-size: clamp(2rem, 3.6vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.category-context__lead {
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 2vw, 1.45rem);
  line-height: 1.45;
  color: var(--color-navy-900);
  margin: 0 0 var(--space-5);
}

.category-context__body p + p {
  margin-top: var(--space-4);
}

.category-context__body p:not(.category-context__lead) {
  color: var(--color-muted);
  max-width: 40rem;
}

.category-context__media {
  margin: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--color-navy-800);
  box-shadow: 0 18px 40px rgba(11, 31, 58, 0.14);
}

.category-context__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.category-audience {
  background:
    linear-gradient(180deg, var(--color-surface) 0%, #eef2f7 100%);
}

.category-audience__grid {
  display: grid;
  gap: clamp(1.5rem, 4vw, 3rem);
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  align-items: start;
}

.category-audience__col {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-4) clamp(1rem, 2.5vw, 1.75rem);
  padding: clamp(1.5rem, 3vw, 2.25rem) 0 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.category-audience__col--individual {
  padding-right: clamp(0.5rem, 2vw, 1.5rem);
}

.category-audience__col--corporate {
  border-left: 1px solid rgba(18, 48, 86, 0.12);
  padding-left: clamp(1rem, 3vw, 2rem);
}

.category-audience__index {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.03em;
  color: rgba(18, 48, 86, 0.48);
  align-self: start;
}

.category-audience__col--corporate .category-audience__index {
  color: rgba(200, 155, 20, 0.82);
}

.category-audience__body {
  min-width: 0;
}

.category-audience__label {
  margin: 0 0 var(--space-2);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-gold-600);
}

.category-audience__col--corporate .category-audience__label {
  color: var(--color-navy-800);
}

.category-audience h3 {
  font-family: var(--font-display);
  margin: 0 0 var(--space-4);
  font-size: clamp(1.85rem, 3.4vw, 2.5rem);
  line-height: 1.12;
  max-width: 14ch;
}

.category-audience ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.85rem;
}

.category-audience li {
  position: relative;
  padding-left: 1.15rem;
  color: var(--color-slate-600);
  line-height: 1.45;
}

.category-audience li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.4rem;
  height: 0.4rem;
  background: var(--color-gold-500);
}

.category-triggers {
  background:
    radial-gradient(ellipse 60% 50% at 8% 0%, rgba(230, 180, 34, 0.1), transparent 55%),
    radial-gradient(ellipse 45% 40% at 100% 100%, rgba(255, 255, 255, 0.04), transparent 50%),
    linear-gradient(180deg, #0e2744 0%, var(--color-navy-900) 100%);
  color: var(--color-on-brand);
}

.category-triggers__grid {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: minmax(12.5rem, 15rem) repeat(auto-fit, minmax(12rem, 1fr));
  align-items: stretch;
}

.category-triggers__prompt {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-4) var(--space-2) 0;
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  min-height: 100%;
}

.category-triggers__prompt h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.85rem, 3.2vw, 2.5rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.12;
  color: var(--color-on-brand);
  max-width: 8ch;
}

.category-triggers__hint {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.55);
  max-width: 16rem;
}

.category-trigger {
  position: relative;
  text-align: left;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-4);
  align-items: start;
  min-height: 100%;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.055) 0%, rgba(255, 255, 255, 0.02) 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: inherit;
  padding: var(--space-5);
  cursor: pointer;
  isolation: isolate;
  transition:
    border-color 0.3s var(--ease-out),
    background 0.3s var(--ease-out),
    box-shadow 0.3s var(--ease-out),
    transform 0.3s var(--ease-out);
}

.category-trigger::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: transparent;
  transition: background 0.3s var(--ease-out);
}

.category-trigger:hover {
  border-color: rgba(255, 255, 255, 0.2);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.035) 100%);
  transform: translateY(-1px);
}

.category-trigger[aria-pressed="true"] {
  border-color: rgba(230, 180, 34, 0.4);
  background: linear-gradient(165deg, rgba(230, 180, 34, 0.14) 0%, rgba(230, 180, 34, 0.05) 100%);
  box-shadow:
    0 12px 32px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transform: none;
}

.category-trigger[aria-pressed="true"]::before {
  background: var(--color-gold-500);
}

.category-trigger:focus-visible {
  outline: 2px solid var(--color-gold-500);
  outline-offset: 3px;
}

.category-trigger__marker {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  margin-top: 0.28rem;
  border: 1.5px solid rgba(255, 255, 255, 0.28);
  border-radius: 50%;
  background: transparent;
  box-shadow: inset 0 0 0 0 transparent;
  transition:
    border-color 0.3s var(--ease-out),
    background 0.3s var(--ease-out),
    box-shadow 0.3s var(--ease-out);
}

.category-trigger:hover .category-trigger__marker {
  border-color: rgba(230, 180, 34, 0.7);
}

.category-trigger[aria-pressed="true"] .category-trigger__marker {
  border-color: var(--color-gold-500);
  background: var(--color-gold-500);
  box-shadow: inset 0 0 0 2.5px #0e2744;
}

.category-trigger__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
  padding-top: 0.05rem;
}

.category-trigger h3 {
  font-family: var(--font-display);
  margin: 0;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--color-on-brand);
}

.category-trigger p {
  margin: 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.9rem;
  line-height: 1.55;
  font-weight: 400;
}

.category-trigger[aria-pressed="true"] h3 {
  color: #fff;
}

.category-trigger[aria-pressed="true"] p {
  color: rgba(255, 255, 255, 0.72);
}

@media (max-width: 1100px) {
  .category-triggers__grid {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  }

  .category-triggers__prompt {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-2) var(--space-4);
    padding: 0 0 var(--space-4);
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .category-triggers__prompt h2 {
    max-width: none;
  }

  .category-triggers__hint {
    flex-basis: 100%;
    max-width: none;
  }
}

@media (max-width: 640px) {
  .category-triggers__grid {
    grid-template-columns: 1fr;
  }
}

.category-path {
  background:
    radial-gradient(ellipse 50% 40% at 0% 50%, rgba(230, 180, 34, 0.07), transparent 60%),
    var(--color-white);
}

.category-path > .container {
  padding-block: var(--space-2);
}

.category-path #category-path {
  margin-top: 0;
}

.category-courses {
  background: var(--color-surface);
}

.category-courses__head {
  margin-bottom: var(--space-6);
}

.category-courses__head .lead {
  max-width: 42rem;
}

.category-courses__level-head {
  margin-bottom: var(--space-5);
  max-width: 44rem;
}

.category-courses__level-badge {
  margin: 0 0 var(--space-2);
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-navy-800);
}

.category-courses__level-badge--specialist {
  color: var(--color-gold-600);
}

.category-courses__level-head h3 {
  font-family: var(--font-display);
  margin: 0 0 var(--space-3);
  font-size: clamp(1.35rem, 2.2vw, 1.65rem);
}

.category-courses__level-entry,
.category-courses__level-outcome {
  margin: 0 0 var(--space-2);
  color: var(--color-slate-600);
  line-height: 1.5;
}

.category-courses__level-outcome {
  margin-bottom: 0;
}

.category-courses__group--path,
.category-courses__group--specialist {
  scroll-margin-top: calc(var(--header-h) + 1rem);
}

.category-courses__specialist-grid {
  display: grid;
  gap: var(--space-6);
}

.category-courses__specialist-branch h4 {
  font-family: var(--font-display);
  margin: 0 0 var(--space-2);
  font-size: 1.15rem;
}

.category-course-card__path-meta {
  display: grid;
  gap: var(--space-3);
  margin: 0;
  font-size: 0.92rem;
}

.category-course-card__path-meta > div {
  display: grid;
  gap: 0.2rem;
}

.category-course-card__path-meta dt {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-muted);
}

.category-course-card__path-meta dd {
  margin: 0;
  color: var(--color-slate-600);
  line-height: 1.45;
}

.category-course-card__path-outcome dd {
  color: var(--color-text);
}

.category-courses__group {
  margin-top: var(--space-7);
  scroll-margin-top: calc(var(--header-h) + 1rem);
}

.category-courses__group:first-child {
  margin-top: 0;
}

.category-courses__group > h3 {
  font-family: var(--font-display);
  margin: 0 0 var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  font-size: clamp(1.75rem, 3.1vw, 2.3rem);
  line-height: 1.2;
}

.category-courses__subgroup {
  margin-top: var(--space-6);
  scroll-margin-top: calc(var(--header-h) + 1rem);
}

.category-courses__subgroup:first-of-type {
  margin-top: 0;
}

.category-courses__subgroup-title {
  font-family: var(--font-nav);
  margin: 0 0 var(--space-4);
  padding-bottom: 0;
  border-bottom: 0;
  font-size: clamp(0.85rem, 1.4vw, 0.95rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.3;
  color: var(--color-muted);
  text-align: left;
}

.category-course-card h3,
.category-course-card h4 {
  font-family: var(--font-display);
  margin: 0;
  padding-bottom: 0;
  border-bottom: 0;
  font-size: 1.2rem;
}

.category-courses__grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(auto-fill, minmax(19.5rem, 1fr));
}

.category-courses .course-card {
  scroll-margin-top: calc(var(--header-h) + 1rem);
}

.category-courses .course-card.is-trigger-match,
.category-courses .course-card.is-path-recommend {
  border-color: var(--color-gold-500);
  box-shadow:
    inset 0 0 0 1px rgba(230, 180, 34, 0.45),
    var(--shadow-md);
}

.category-course-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5);
  background: var(--color-white);
  border-top: 3px solid var(--color-navy-700);
  box-shadow: var(--shadow-sm);
  scroll-margin-top: calc(var(--header-h) + 1rem);
  transition:
    transform 0.3s var(--ease-out),
    box-shadow 0.3s var(--ease-out),
    border-color 0.3s var(--ease-out);
}

.category-course-card > div {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  flex: 1;
}

.category-course-card--beginner {
  border-top-color: #3d7ea6;
}

.category-course-card--intermediate {
  border-top-color: var(--color-navy-700);
}

.category-course-card--advanced {
  border-top-color: var(--color-navy-700);
}

.category-course-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.category-course-card.is-trigger-match,
.category-course-card.is-path-recommend {
  border-color: transparent;
  border-top-color: var(--color-gold-500);
  box-shadow:
    inset 0 0 0 1px rgba(230, 180, 34, 0.45),
    var(--shadow-md);
  background: linear-gradient(180deg, rgba(230, 180, 34, 0.1), var(--color-white) 40%);
}

.category-course-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  font-family: var(--font-nav);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-muted);
}

.category-course-card__meta span {
  border: 0;
  padding: 0;
}

.category-course-card__meta .category-course-card__hrdf {
  border: 0;
  color: var(--color-success);
  background: transparent;
}

.category-course-card__level {
  color: var(--color-navy-800);
}

.category-course-card h3 a {
  color: inherit;
  text-decoration: none;
}

.category-course-card h3 a:hover {
  color: var(--color-navy-700);
}

.category-course-card p {
  margin: 0;
  color: var(--color-muted);
  flex: 1;
  font-size: 0.95rem;
}

.category-course-card__link {
  font-family: var(--font-nav);
  font-weight: 700;
  color: var(--color-navy-800);
  text-decoration: none;
  letter-spacing: 0.02em;
  margin-top: auto;
  padding-top: var(--space-3);
  border-top: 0;
}

.category-course-card__link:hover {
  color: var(--color-gold-600);
}

.category-courses__empty {
  padding: var(--space-5) 0;
}

.category-course-card__footer {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
  justify-content: space-between;
}

.category-empty {
  color: var(--color-muted);
}

.category-split {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: minmax(12rem, 0.7fr) minmax(0, 1.4fr);
  align-items: start;
}

.category-split .category-section-head {
  margin-bottom: 0;
}

.category-outcomes {
  background: var(--color-white);
  border-bottom: 1px solid rgba(18, 48, 86, 0.08);
}

.category-outcomes__grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.category-outcomes__block p {
  margin: 0;
  padding-left: var(--space-5);
  border-left: 3px solid var(--color-gold-500);
  line-height: 1.6;
  font-size: 1.05rem;
  color: var(--color-slate-600);
}

.category-outcomes__block h3 {
  margin: 0 0 var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 1.8vw, 1.35rem);
  color: var(--color-navy-900);
}

.category-approach__link {
  margin-top: var(--space-4);
}

.category-approach__link a {
  font-family: var(--font-nav);
  font-weight: 700;
  color: var(--color-gold-500);
  text-decoration: none;
}

.category-approach__link a:hover {
  color: var(--color-gold-500);
}

.category-proof {
  background:
    linear-gradient(160deg, var(--color-navy-900) 0%, #0e2744 55%, var(--color-navy-800) 100%);
  color: var(--color-on-brand);
  padding: clamp(3.5rem, 8vw, 5.5rem) 0;
}

.category-proof__layout {
  display: grid;
  gap: var(--space-7);
}

.category-proof__quotes {
  display: flex;
  justify-content: flex-start;
}

.category-proof__quote {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-4);
  padding: 0;
  border: 0;
  align-items: start;
}

.category-proof__quote--solo {
  width: min(100%, 48rem);
  gap: var(--space-3);
  grid-template-columns: auto 1fr;
  align-items: start;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.category-proof__quote--solo .category-proof__portrait {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  border-width: 2px;
  outline: none;
  margin-bottom: 0;
}

.category-proof__quote--solo .category-proof__quote-body {
  padding-left: 0;
  line-height: 1.55;
}

.category-proof__quote--featured {
  grid-column: 1;
  grid-row: 1 / -1;
  gap: var(--space-5);
  grid-template-columns: 1fr;
  padding-right: clamp(0.5rem, 3vw, 2rem);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  align-content: start;
}

.category-proof__quotes:has(> :only-child) {
  grid-template-columns: minmax(0, 36rem);
}

.category-proof__quotes:has(> :only-child) .category-proof__quote--featured {
  border-right: 0;
  padding-right: 0;
}

.category-proof__quote:not(.category-proof__quote--featured) {
  padding-top: var(--space-2);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.category-proof__quote:not(.category-proof__quote--featured):last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.category-proof__portrait {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  border: 2px solid rgba(230, 180, 34, 0.55);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.category-proof__quote--featured .category-proof__portrait {
  width: clamp(7rem, 16vw, 10rem);
  height: clamp(7rem, 16vw, 10rem);
  border-radius: 0.25rem 2.75rem 0.25rem 2.75rem;
  border-width: 0;
  outline: 1px solid rgba(230, 180, 34, 0.45);
  outline-offset: 5px;
  margin-bottom: var(--space-2);
}

.category-proof__portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.category-proof__quote-body {
  min-width: 0;
}

.category-proof__quote:not(.category-proof__quote--solo) p {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.92);
}

.category-proof__quote.category-proof__quote--solo p {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 2.8vw, 2.1rem);
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.92);
}

.category-proof__quote--featured p {
  font-size: clamp(1.25rem, 2.2vw, 1.65rem);
  line-height: 1.4;
}

.category-proof__quote:not(.category-proof__quote--solo) footer {
  display: grid;
  gap: 0.15rem;
  font-family: var(--font-nav);
  font-size: 0.88rem;
}

.category-proof__quote.category-proof__quote--solo footer {
  display: grid;
  gap: 0.15rem;
  font-family: var(--font-nav);
  font-size: 0.95rem;
}

.category-proof__quote strong {
  color: var(--color-gold-500);
}

.category-proof__quote span {
  color: rgba(255, 255, 255, 0.65);
}

.category-proof__logos {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  align-items: center;
  margin: var(--space-7) 0 0;
  padding: var(--space-5) 0 0;
  list-style: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.category-proof__logos img {
  max-height: 2.25rem;
  width: auto;
  opacity: 0.7;
  filter: grayscale(1) brightness(1.4);
}

.category-hrdf {
  background: var(--color-navy-900);
  color: var(--color-white);
}

.category-hrdf__inner {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1.4fr) auto;
  align-items: center;
}

.category-hrdf h2 {
  color: inherit;
  margin: 0 0 var(--space-3);
}

.category-hrdf p {
  margin: 0;
  max-width: 40rem;
  color: rgba(255, 255, 255, 0.85);
}

.category-hrdf .btn--secondary {
  background: transparent;
  color: var(--color-on-brand);
  border-color: rgba(255, 255, 255, 0.45);
}

.category-hrdf .btn--secondary:hover {
  background: rgba(255, 255, 255, 0.1);
  color: var(--color-on-brand);
}

.category-faq {
  background: var(--color-white);
}

.category-faq .about-faq__item {
  border-bottom: 1px solid var(--color-border);
}

.category-blog {
  background: var(--color-surface);
}

.category-blog__grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.category-blog__card {
  text-decoration: none;
  color: inherit;
}

.category-blog__card a {
  display: grid;
  gap: var(--space-3);
  color: inherit;
  text-decoration: none;
  height: 100%;
}

.category-blog__card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform 0.45s var(--ease-out);
}

.category-blog__card a:hover img {
  transform: scale(1.03);
}

.category-blog__card h3 {
  font-family: var(--font-display);
  margin: 0;
  font-size: 1.1rem;
}

.category-blog__card p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.95rem;
}

.category-nudge {
  padding: var(--space-8) 0;
  background: var(--color-surface);
  border-top: 1px solid rgba(18, 48, 86, 0.08);
}

.category-nudge__inner {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  align-items: center;
  justify-content: space-between;
}

.category-nudge h2 {
  font-family: var(--font-display);
  margin: 0 0 var(--space-2);
}

.category-nudge p {
  margin: 0;
  max-width: 36rem;
  color: var(--color-muted);
}

.category-not-found {
  padding-top: calc(var(--header-h) + var(--space-8));
}

/* Path navigator */
.path-nav__layout {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.25rem);
  grid-template-columns: 1fr;
  align-items: start;
}

.path-nav__main {
  padding-top: 0;
}

.path-nav__heading {
  font-family: var(--font-display);
  margin: 0 0 var(--space-5);
  font-size: clamp(1.35rem, 2vw, 1.6rem);
}

.path-nav__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(2.25rem, 4vw, 3.25rem) var(--space-4);
  position: relative;
}

.path-nav__steps::before {
  content: none;
}

.path-nav__step {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-1) var(--space-2) 0;
  border: 0;
  background: transparent;
  transition: color 0.25s var(--ease-out);
}

.path-nav__step:not(:last-child)::after {
  content: none;
}

.path-nav__step.is-recommended {
  color: var(--color-navy-900);
}

.path-nav__step.is-recommended::after {
  color: rgba(230, 180, 34, 0.85);
}

#path-step-applied-skills::after,
#path-step-advanced-delivery::after {
  content: none;
}

.path-nav__step-index {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--color-gold-500);
  color: var(--color-navy-900);
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 700;
  position: relative;
  z-index: 1;
}

.path-nav__step-level {
  margin: 0 0 var(--space-2);
  font-family: var(--font-display);
  font-size: clamp(0.95rem, 1.5vw, 1.1rem);
  line-height: 1.3;
  color: var(--color-navy-900);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.path-nav__step-summary {
  margin: 0 0 var(--space-3);
  color: var(--color-muted);
}

.path-nav__step-label {
  font-family: var(--font-nav);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-navy-800);
  margin-right: 0.35rem;
}

.path-nav__step-entry,
.path-nav__branch-entry {
  margin: 0 0 var(--space-2);
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--color-slate-600);
}

.path-nav__step-courses,
.path-nav__branch-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.path-nav__step-courses a {
  display: inline-block;
  padding: 0.4rem 0.85rem;
  border: 1px solid rgba(245, 198, 24, 0.55);
  border-radius: 0.85rem;
  background: #ffd54a;
  color: var(--color-navy-900);
  font-family: var(--font-nav);
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.01em;
  text-decoration: none;
}

.path-nav__step-courses a:hover {
  background: #ffe066;
  color: var(--color-navy-900);
}

.path-nav__branch-links a {
  color: var(--color-navy-800);
  font-family: var(--font-nav);
  font-size: 0.92rem;
}

.path-nav__branches {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-border);
}

.path-nav__branches-title {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-size: 1.15rem;
}

.path-nav__branch-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-4);
}

.path-nav__branch {
  padding-left: var(--space-4);
  border-left: 3px solid var(--color-gold-500);
}

.path-nav__branch h5 {
  margin: 0 0 var(--space-2);
  font-family: var(--font-display);
  font-size: 1.05rem;
}

.path-nav__branch p {
  margin: 0 0 var(--space-2);
  color: var(--color-muted);
}

.path-nav__quiz {
  position: static;
  align-self: start;
  justify-self: center;
  width: 100%;
  max-width: 36rem;
  margin-inline: auto;
  padding: 0;
  color: var(--color-slate-700);
  background: var(--color-white);
  border: 0;
  overflow: visible;
}

.path-nav__quiz::after {
  display: none;
}

.path-nav__quiz-panel {
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-gold-500);
  background: var(--color-navy-900);
  color: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 24px rgba(11, 31, 58, 0.08);
}

.path-nav__quiz-toggle {
  margin: 0 0 var(--space-4);
  padding: 0.55rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 999px;
  background: transparent;
  color: var(--color-white);
  font-family: var(--font-nav);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.path-nav__quiz.is-collapsed .path-nav__result {
  display: none;
}

.path-nav__quiz-title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  color: var(--color-white);
}

.path-nav__quiz-prompt {
  margin: 0 0 var(--space-4);
  font-size: 0.9rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.82);
}

.path-nav__form {
  position: relative;
}

.path-nav__question {
  border: 0;
  margin: 0 0 var(--space-3);
  padding: 0 0 var(--space-3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.path-nav__question:last-of-type {
  border-bottom: 0;
  margin-bottom: var(--space-2);
  padding-bottom: 0;
}

.path-nav__question legend {
  font-weight: 600;
  font-size: 0.88rem;
  line-height: 1.4;
  margin-bottom: var(--space-2);
  color: var(--color-white);
}

.path-nav__option {
  display: flex;
  gap: var(--space-2);
  align-items: flex-start;
  margin-bottom: 0.45rem;
  cursor: pointer;
  font-size: 0.85rem;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.88);
}

.path-nav__option:hover {
  color: var(--color-white);
}

.path-nav__form-actions {
  margin-top: var(--space-3);
}

.path-nav__form-actions .btn {
  width: 100%;
  padding-block: 0.65rem;
  font-size: 0.88rem;
}

.path-nav__result {
  margin-top: var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.path-nav__result-eyebrow {
  margin: 0;
  color: var(--color-gold-500);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.path-nav__result-title {
  margin: 0.25rem 0 var(--space-2);
  font-family: var(--font-display);
}

.path-nav__quiz .btn--outline {
  color: var(--color-navy-900);
  border-color: var(--color-border-strong);
}

@media (max-width: 900px) {
  .category-hero__inner,
  .category-audience__grid,
  .category-context__layout,
  .category-outcomes__grid,
  .category-split,
  .category-hrdf__inner,
  .path-nav__layout,
  .category-proof__quotes {
    grid-template-columns: 1fr;
  }

  .category-hero {
    min-height: 0;
    padding-bottom: var(--space-7);
  }

  .category-hero h1 {
    max-width: none;
  }

  .category-hero__media {
    justify-self: stretch;
    width: 100%;
    max-width: 24rem;
    margin: 0 auto;
  }

  .category-context__layout--with-media,
  .category-context__layout--center-copy {
    grid-template-areas:
      "head"
      "media"
      "body";
    grid-template-rows: none;
  }

  .category-context__layout--center-copy .category-context__body {
    align-self: start;
  }

  .category-context__layout--center-copy .category-context__media {
    aspect-ratio: 4 / 3;
  }

  .category-context__media img {
    aspect-ratio: 4 / 3;
    height: auto;
  }

  .category-audience__col--corporate {
    border-left: 0;
    padding-left: 0;
  }

  .category-proof__quote--featured {
    grid-column: auto;
    grid-row: auto;
    padding-right: 0;
    padding-bottom: var(--space-5);
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .category-proof__quote--solo {
    grid-template-columns: auto 1fr;
    text-align: left;
    justify-items: start;
  }

  .path-nav__quiz {
    position: static;
    max-width: none;
  }

  .category-trust__list {
    justify-content: flex-start;
  }
}

@media (max-width: 1100px) {
  .path-nav__steps {
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }

  .path-nav__step {
    padding: var(--space-2) 0;
  }

  .path-nav__step:not(:last-child)::after {
    content: none;
  }
}

@media (max-width: 600px) {
  .category-hero__ctas {
    flex-direction: column;
    align-items: stretch;
  }

  .category-hero__ctas .btn {
    width: 100%;
    justify-content: center;
  }

  .category-nudge__inner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ── All-categories overview ── */

.all-cat {
  padding-block: var(--space-xl, 4rem) var(--space-2xl, 6rem);
}

.all-cat__head {
  text-align: center;
  margin-bottom: var(--space-lg, 3rem);
}

.all-cat__head h1 {
  font-family: var(--font-display, "Outfit", sans-serif);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.all-cat__head .lead {
  max-width: 40rem;
  margin-inline: auto;
  color: var(--clr-text-muted, #64748b);
}

.all-cat__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
  gap: var(--space-md, 2rem);
}

.all-cat__card {
  display: flex;
  flex-direction: column;
  background: var(--clr-surface, #fff);
  border: 1px solid var(--clr-border, #e2e8f0);
  border-radius: var(--radius-lg, 1rem);
  padding: var(--space-md, 2rem);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
  scroll-margin-top: 6rem;
}

.all-cat__card:hover {
  border-color: var(--clr-brand, #2563eb);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

.all-cat__card:target {
  border-color: var(--clr-brand, #2563eb);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.all-cat__type-badge {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.15em 0.6em;
  border-radius: 999px;
  margin-bottom: 0.75rem;
  background: var(--clr-brand-light, #eff6ff);
  color: var(--clr-brand, #2563eb);
}

.all-cat__card--b .all-cat__type-badge {
  background: #fef3c7;
  color: #92400e;
}

.all-cat__card-head h2 {
  font-family: var(--font-display, "Outfit", sans-serif);
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 0.5rem;
}

.all-cat__card-head h2 a {
  color: inherit;
  text-decoration: none;
}

.all-cat__card-head h2 a:hover {
  color: var(--clr-brand, #2563eb);
}

.all-cat__tagline {
  font-size: 0.88rem;
  color: var(--clr-text-muted, #64748b);
  line-height: 1.5;
  margin-bottom: 1rem;
}

.all-cat__courses {
  list-style: none;
  padding: 0;
  margin: 0 0 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.all-cat__course {
  font-size: 0.85rem;
  line-height: 1.4;
  padding: 0.35rem 0;
  border-bottom: 1px solid var(--clr-border, #e2e8f0);
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}

.all-cat__course:last-child {
  border-bottom: none;
}

.all-cat__course a {
  color: var(--clr-text, #1e293b);
  text-decoration: none;
}

.all-cat__course a:hover {
  color: var(--clr-brand, #2563eb);
}

.all-cat__course-level {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
  color: var(--clr-text-muted, #64748b);
}

.all-cat__course--more a {
  color: var(--clr-brand, #2563eb);
  font-weight: 500;
}

.all-cat__actions {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 0.75rem;
}

.all-cat__actions .btn--sm {
  font-size: 0.82rem;
  padding: 0.45em 1.1em;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal,
  html.js .reveal.reveal--pending:not(.is-visible) {
    opacity: 1;
    transform: none;
  }

  .category-hero__grid {
    animation: none;
  }
}