﻿/* ============================================================
   SKAYLE ACADEMY — v3 Design System
   Inspired by Masterclass · Maven · Coursera · Skillshare
   ============================================================ */

/* ── TOKENS ─────────────────────────────────────────────────── */
:root {
  /* Brand */
  --navy-900: #060e1a;
  --navy-800: #0b1829;
  --navy-700: #112236;
  --navy-600: #1a3352;
  --navy-500: #264d77;
  --navy-400: #3a6898;

  --gold-500: #e8a020;
  --gold-400: #f0b535;
  --gold-300: #f8ce6a;
  --gold-200: #fce9b8;
  --gold-dark: #b87800;

  --ivory-100: #fdfcf8;
  --ivory-200: #f7f3eb;
  --ivory-300: #ede8d8;

  --slate-100: #f1f5f9;
  --slate-200: #e2e8f0;
  --slate-300: #cbd5e1;
  --slate-400: #94a3b8;
  --slate-600: #475569;
  --slate-700: #334155;
  --slate-900: #0f172a;

  --white: #ffffff;
  --ink: #111827;


  /* Typography */
  --font: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;

  /* Spacing */
  --section-pad: clamp(64px, 7vw, 108px);

  /* Radii */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 100px;

  /* Shadows */
  --shadow-card: 0 1px 3px rgba(0,0,0,.07), 0 4px 12px rgba(0,0,0,.06);
  --shadow-hover: 0 8px 32px rgba(0,0,0,.14), 0 2px 8px rgba(0,0,0,.08);
  --shadow-float: 0 24px 64px rgba(0,0,0,.18), 0 8px 24px rgba(0,0,0,.10);

  /* Transitions */
  --ease: cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(0,0,.2,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
}

/* ── RESET ───────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 120px; -webkit-text-size-adjust: 100%; }
body {
  font: 400 17px/1.75 var(--font);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* Custom cursor removed */
.cursor-dot, .cursor-ring { display: none !important; }
img { display: block; max-width: 100%; }
button,input,textarea,select { font: inherit; }
button,a { -webkit-tap-highlight-color: transparent; cursor: pointer; }
a { color: inherit; text-decoration: none; }
button { border: none; background: none; color: inherit; }
h1,h2,h3,h4 { font-family: var(--font); line-height: 1.1; }

/* ── GRAIN TEXTURE ──────────────────────────────────────────── */
.hero,
.diff-section,
.testimonials-section,
.career-band,
.final-cta-wrap,
.section-coaching,
.emp-hiw-section,
.emp-testimonials,
.emp-contact-section {
  position: relative;
}
.hero::after,
.diff-section::after,
.testimonials-section::after,
.career-band::after,
.final-cta-wrap::after,
.section-coaching::after,
.emp-hiw-section::after,
.emp-testimonials::after,
.emp-contact-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity: 0.03;
  pointer-events: none;
  z-index: 0;
}
.hero > *,
.diff-section > *,
.testimonials-section > *,
.career-band > *,
.final-cta-wrap > *,
.section-coaching > *,
.emp-hiw-section > *,
.emp-testimonials > *,
.emp-contact-section > * {
  position: relative;
  z-index: 1;
}

/* ── LAYOUT ──────────────────────────────────────────────────── */
.section-shell { width: min(1180px, calc(100% - 80px)); margin-inline: auto; }

.skip-link {
  position: absolute; z-index: 9999; top: 8px; left: 8px;
  padding: 10px 18px; background: var(--navy-800); color: var(--white);
  font-size: 13px; font-weight: 600; border-radius: var(--r-sm);
  transform: translateY(-200%);
}
.skip-link:focus { transform: translateY(0); }

/* ── EYEBROW ─────────────────────────────────────────────────── */
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 16px 6px 10px;
  background: rgba(232,160,32,.1);
  border: 1px solid rgba(232,160,32,.25);
  border-radius: var(--r-pill);
  color: var(--gold-dark);
  font-size: 12px; font-weight: 700; letter-spacing: 1.1px; text-transform: uppercase;
}
.eyebrow-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold-500); flex-shrink: 0;
}
.eyebrow-light { background: rgba(232,160,32,.12); border-color: rgba(232,160,32,.25); color: var(--gold-300); }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 0 28px;
  border: 2px solid transparent;
  border-radius: var(--r-pill);
  font-size: 14px; font-weight: 700; letter-spacing: .1px;
  white-space: nowrap;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease), border-color .2s var(--ease);
}
.button:hover { transform: translateY(-2px); }
.button:active { transform: translateY(0); }

.btn-sm { min-height: 42px; padding: 0 22px; font-size: 13px; }

.btn-gold {
  background: var(--gold-500);
  color: var(--navy-900);
  border-color: transparent;
  box-shadow: 0 2px 12px rgba(232,160,32,.35);
}
.btn-gold:hover {
  box-shadow: 0 8px 28px rgba(232,160,32,.45);
  filter: brightness(1.05);
}

/* Navy — secondary primary */
.btn-primary {
  background: var(--navy-800);
  color: var(--white);
  border-color: var(--gold-500);
}
.btn-primary:hover {
  background: var(--navy-700);
  box-shadow: 0 8px 28px rgba(11,24,41,.3);
}

/* Plain navy */
.btn-navy {
  background: var(--navy-800);
  color: var(--white);
  border-color: var(--navy-800);
}
.btn-navy:hover {
  background: var(--navy-700);
  box-shadow: 0 8px 24px rgba(11,24,41,.25);
}

/* White — for dark sections */
.btn-white {
  background: var(--white);
  color: var(--navy-800);
  border-color: var(--white);
}
.btn-white:hover { background: var(--ivory-200); box-shadow: 0 8px 24px rgba(0,0,0,.15); }

/* Ghost — transparent on dark */
.btn-ghost {
  background: transparent;
  color: rgba(255,255,255,.88);
  border-color: rgba(255,255,255,.28);
}
.btn-ghost:hover { border-color: rgba(255,255,255,.65); background: rgba(255,255,255,.07); }

/* Ghost light — for navy sections */
.btn-ghost-light {
  background: transparent;
  color: var(--white);
  border-color: rgba(232,160,32,.45);
}
.btn-ghost-light:hover { border-color: var(--gold-500); background: rgba(232,160,32,.08); }

/* Outline button — light backgrounds */
.btn-outline {
  background: transparent;
  color: var(--navy-800);
  border: 1.5px solid var(--navy-800);
  display: inline-flex; align-items: center; gap: 8px;
}
.btn-outline::after {
  content: "→";
  display: inline-block;
  transition: transform .18s var(--ease);
}
.btn-outline:hover {
  border-color: var(--gold-500);
  color: var(--navy-800);
  background: rgba(232,160,32,.06);
}
.btn-outline:hover::after { transform: translateX(4px); }

/* ── TEXT LINK ───────────────────────────────────────────────── */
.text-link {
  display: inline-flex; align-items: center; gap: 7px;
  color: var(--navy-800); font-size: 14px; font-weight: 700;
  transition: gap .18s var(--ease);
}
.text-link span { color: var(--gold-dark); transition: transform .18s var(--ease); }
.text-link:hover { gap: 11px; }
.text-link:hover span { transform: translate(2px,-1px); }

/* ── SITE HEADER ─────────────────────────────────────────────── */
.site-header {
  position: sticky; top: 0; z-index: 200;
  height: 112px;
  background: var(--navy-800);
  border-bottom: 1px solid rgba(232,160,32,.15);
  transition: background .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.site-header.is-scrolled {
  background: rgba(11,24,41,.92);
  backdrop-filter: blur(16px) saturate(1.6);
  -webkit-backdrop-filter: blur(16px) saturate(1.6);
  border-bottom-color: rgba(232,160,32,.25);
  box-shadow: 0 4px 32px rgba(0,0,0,.25);
}

.nav-wrap {
  width: min(1320px, calc(100% - 80px));
  height: 100%; margin: auto;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}

.brand { display: inline-flex; align-items: center; flex-shrink: 0; transition: opacity .18s; }
.brand:hover { opacity: .85; }
.brand-logo { height: 96px; width: auto; object-fit: contain; }

.primary-nav { height: 100%; display: flex; align-items: center; gap: clamp(14px,2vw,30px); }

.primary-nav > a, .login-link {
  position: relative;
  color: rgba(255,255,255,.75); font-size: 14.5px; font-weight: 600;
  transition: color .18s var(--ease);
}
.primary-nav > a::after {
  content: "";
  position: absolute; bottom: -4px; left: 0; right: 0; height: 1.5px;
  background: var(--gold-400);
  transform: scaleX(0); transform-origin: left;
  transition: transform .2s var(--ease);
}
.primary-nav > a:hover, .login-link:hover { color: var(--white); }
.primary-nav > a:hover::after { transform: scaleX(1); }

/* ── Coaching nav dropdown ─────────────────────────────────── */
.primary-nav .nav-drop-wrap { position: relative; display: inline-flex; align-items: center; align-self: stretch; }
.primary-nav .nav-drop-wrap > a {
  position: relative; color: rgba(255,255,255,.75); font-size: 14.5px; font-weight: 600;
  transition: color .18s var(--ease);
}
.primary-nav .nav-drop-wrap > a::after {
  content: ""; position: absolute; bottom: -4px; left: 0; right: 0; height: 1.5px;
  background: var(--gold-400); transform: scaleX(0); transform-origin: left;
  transition: transform .2s var(--ease);
}
.primary-nav .nav-drop-wrap:hover > a,
.primary-nav .nav-drop-wrap:focus-within > a { color: var(--white); }
.primary-nav .nav-drop-wrap:hover > a::after,
.primary-nav .nav-drop-wrap:focus-within > a::after { transform: scaleX(1); }
.nav-drop {
  position: absolute; top: calc(100% + 14px); left: 50%;
  transform: translateX(-50%) translateY(-8px);
  background: #0C1730; border: 1px solid rgba(232,160,32,.25);
  border-radius: 14px; padding: 6px; min-width: 240px;
  opacity: 0; pointer-events: none;
  transition: opacity .18s ease, transform .18s ease; z-index: 300;
}
.nav-drop-wrap:hover .nav-drop,
.nav-drop-wrap:focus-within .nav-drop { opacity: 1; pointer-events: all; transform: translateX(-50%) translateY(0); }
.nav-drop a {
  display: flex; align-items: center; gap: 9px; padding: 11px 14px;
  border-radius: 9px; font-size: 13.5px; font-weight: 500;
  color: rgba(255,255,255,.72); white-space: nowrap;
  transition: background .14s, color .14s;
}
.nav-drop a:hover { background: rgba(232,160,32,.1); color: var(--gold-400,#F0BB45); }
.nav-drop a.drop-featured { font-weight: 700; color: var(--gold-400,#F0BB45); }
.nav-drop-badge {
  font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  background: rgba(232,160,32,.18); color: var(--gold-400,#F0BB45);
  padding: 2px 7px; border-radius: 100px; margin-left: auto;
}

/* Active nav page indicator */
.primary-nav a[aria-current="page"],
.primary-nav .nav-drop-wrap > a[aria-current="page"] { color: var(--white) !important; }
.primary-nav a[aria-current="page"]::after,
.primary-nav .nav-drop-wrap > a[aria-current="page"]::after { transform: scaleX(1) !important; }

/* Coaching dropdown chevron — visible on all screens */
.drop-arrow { display: inline-flex; align-items: center; margin-left: 4px; opacity: .55; transition: transform .22s ease, opacity .18s ease; }
.nav-drop-wrap:hover .drop-arrow, .nav-drop-wrap:focus-within .drop-arrow { opacity: 1; transform: rotate(180deg); }

.nav-actions { display: flex; align-items: center; gap: 20px; margin-left: 10px; }
.login-link { color: rgba(255,255,255,.6); }

/* Mobile toggle */
.menu-toggle {
  display: none;
  width: 44px; height: 44px;
  align-content: center; justify-items: center; gap: 6px;
  border: 1px solid rgba(232,160,32,.3); border-radius: var(--r-sm);
  background: transparent;
}
.menu-toggle span { width: 20px; height: 1.5px; background: var(--white); transition: transform .22s var(--ease); }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

/* ── HERO ────────────────────────────────────────────────────── */
.hero {
  position: relative; overflow: hidden;
  background: var(--navy-800);
  color: var(--white);
  padding-bottom: 0;
}

.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: none;
  pointer-events: none;
  z-index: 0;
}

.hero-inner {
  position: relative; z-index: 2;
  width: min(1180px, calc(100% - 80px)); margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.08fr;
  align-items: center;
  gap: 48px;
  padding-block: 80px 90px;
}

/* Hero copy */
.hero-copy { padding: 8px 0; }

.hero h1 {
  margin: 22px 0 24px;
  font-size: clamp(52px, 7vw, 96px);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -3.5px;
  color: var(--white);
}

.hero h1 em {
  font-style: normal;
  color: var(--gold-400);
}

.hero-lede {
  max-width: 500px;
  margin-bottom: 36px;
  color: rgba(255,255,255,.72);
  font-size: 18px; line-height: 1.75; font-weight: 400;
}

/* Action buttons row */
.hero-actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }

/* Inline stats below buttons */
.hero-stats {
  display: flex; align-items: center; gap: 0;
  margin-top: 40px;
  padding-top: 28px;
  border-top: 1px solid rgba(232,160,32,.18);
}

.hero-stat { text-align: left; }
.hero-stat strong {
  display: block;
  font-size: 26px; font-weight: 800; line-height: 1;
  color: var(--white);
  letter-spacing: -.5px;
}
.hero-stat span { display: block; margin-top: 4px; font-size: 13px; color: rgba(255,255,255,.55); font-weight: 500; }

.hero-stat-divider {
  width: 1px; height: 36px;
  background: rgba(232,160,32,.2);
  margin: 0 28px;
  flex-shrink: 0;
}

/* Hero visual — modern UI card mockup */
.hero-visual { position: relative; }

.hero-card-shell {
  background: rgba(255,255,255,.97);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-float), 0 0 0 1px rgba(232,160,32,.15), 0 32px 80px rgba(0,0,0,.5);
  color: var(--ink);
}

/* Mac-style topbar */
.hc-topbar {
  display: flex; align-items: center; gap: 6px;
  padding: 14px 18px;
  background: var(--slate-100);
  border-bottom: 1px solid var(--slate-200);
}
.hc-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.hc-dot--red    { background: #ff5f57; }
.hc-dot--yellow { background: #ffbd2e; }
.hc-dot--green  { background: #28c841; }
.hc-title {
  margin-left: 10px; flex: 1; text-align: center;
  font-size: 11px; font-weight: 700; color: var(--slate-400); letter-spacing: .3px;
}

/* Card body */
.hc-body { display: grid; grid-template-columns: 1fr 220px; }

.hc-file-panel {
  padding: 22px 22px 18px;
  border-right: 1px solid var(--slate-200);
}

.hc-file-header {
  margin-bottom: 16px;
  font-size: 8px; font-weight: 800; letter-spacing: 1.6px;
  color: var(--slate-400); text-transform: uppercase;
}

.hc-file-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px;
  border-radius: var(--r-sm);
  margin-bottom: 6px;
  transition: background .15s;
}
.hc-file-row--active { background: #f7f3eb; }

.hc-step {
  width: 26px; height: 26px; display: grid; place-items: center; flex-shrink: 0;
  border-radius: 50%; border: 1.5px solid var(--gold-500);
  font-size: 9px; font-weight: 800; color: var(--navy-800);
}
.hc-file-row--active .hc-step { background: var(--gold-500); border-color: var(--gold-500); color: var(--navy-900); }

.hc-step-info { flex: 1; }
.hc-step-info strong { display: block; font-size: 12px; font-weight: 700; color: var(--navy-800); }
.hc-step-info span   { font-size: 12px; color: var(--slate-400); }

.hc-badge {
  padding: 3px 9px; border-radius: var(--r-pill); font-size: 11px; font-weight: 700; flex-shrink: 0;
}
.hc-badge--green { background: #dcfce7; color: #166534; }
.hc-badge--amber { background: #fef9c3; color: #854d0e; }
.hc-badge--slate { background: var(--slate-100); color: var(--slate-600); }

.hc-divider { height: 1px; background: var(--slate-200); margin: 14px 0; }

.hc-note {
  display: flex; align-items: center; gap: 7px;
  font-size: 12px; color: var(--slate-400);
}
.hc-note svg { fill: var(--slate-400); flex-shrink: 0; }

.hc-widget { padding: 16px; }

/* Case widget inside hc-widget */
.case-widget {
  padding: 14px;
  border: 1px solid var(--slate-200);
  border-top: 2px solid var(--gold-500);
  border-radius: var(--r-sm);
  background: var(--white);
}
.case-kicker {
  display: block; margin-bottom: 10px;
  font-size: 7.5px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase;
  color: var(--slate-400);
}
.case-tabs {
  display: flex; gap: 3px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--slate-200);
}
.case-tab {
  padding: 5px 8px; border-radius: var(--r-sm);
  font-size: 9.5px; font-weight: 600; color: var(--slate-400);
  transition: all .15s;
}
.case-tab:hover, .case-tab.is-active { background: var(--ivory-200); color: var(--navy-800); }
.case-tab.is-active { box-shadow: inset 0 -2px var(--gold-500); }
.case-title {
  display: block; margin-top: 10px;
  font-size: 11.5px; font-weight: 800; color: var(--navy-800); line-height: 1.4;
}
.case-description { min-height: 30px; margin: 4px 0 6px; font-size: 9.5px; color: var(--slate-600); line-height: 1.5; }
.case-footnote { font-size: 8px; color: var(--slate-400); }

/* Card footer */
.hc-footer {
  display: flex; justify-content: space-between; align-items: center;
  padding: 11px 18px;
  background: var(--slate-900);
  color: rgba(255,255,255,.45);
  font-size: 8px; font-weight: 700; letter-spacing: 1.2px;
}
.hc-live { display: flex; align-items: center; gap: 7px; }

.live-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--gold-500);
  box-shadow: 0 0 0 3px rgba(232,160,32,.2);
  animation: pulse 2s infinite;
}

/* Hero badge strip */
.hero-badge {
  position: absolute; right: 0; bottom: -18px;
  display: flex; align-items: center; gap: 12px;
  padding: 13px 20px;
  background: var(--gold-500);
  color: var(--navy-900);
  font-size: 10.5px; font-weight: 800; letter-spacing: .2px;
  border-radius: var(--r-md) 0 0 var(--r-md);
  box-shadow: 0 8px 24px rgba(232,160,32,.4);
}
.badge-arrow { font-size: 14px; }

/* Scroll hint */
.hero-scroll-hint {
  position: absolute; bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 28px; height: 52px;
  border: 1.5px solid rgba(232,160,32,.3); border-radius: 14px;
  display: flex; justify-content: center; padding-top: 8px;
  z-index: 2;
  opacity: .6;
  margin-bottom: 24px;
}
.hero-scroll-hint span {
  width: 4px; height: 10px; background: var(--gold-400); border-radius: 2px;
  animation: scroll-pulse 2s infinite;
}

/* ── STATS STRIP ─────────────────────────────────────────────── */
.stats-strip {
  background: var(--navy-900);
  border-bottom: 1px solid rgba(232,160,32,.12);
}

.stats-inner {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: nowrap;
  min-height: 88px;
  gap: 0;
}

.stat-block {
  flex: 1;
  padding: 20px 16px;
  text-align: center;
}
.stat-block strong {
  display: block;
  font-size: clamp(24px, 2.8vw, 40px); font-weight: 800; line-height: 1;
  color: var(--gold-400);
  letter-spacing: -1px;
}
.stat-block span {
  display: block; margin-top: 6px;
  font-size: 14px; font-weight: 600; color: rgba(255,255,255,.55);
}

.stat-divider {
  width: 1px; height: 52px; background: rgba(232,160,32,.15); flex-shrink: 0;
}

.stats-strip-icon {
  height: 48px; width: auto; object-fit: contain; margin-right: 28px; opacity: .7; flex-shrink: 0;
}

/* ── SECTIONS BASE ───────────────────────────────────────────── */
.section { padding-block: var(--section-pad); }

/* ── HEADING ROW ─────────────────────────────────────────────── */
.heading-row {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 60px;
  margin-bottom: 52px;
}

.section-heading h2,
.approach-intro h2,
.coaching-copy h2,
.career-copy h2,
.employer-copy h2 {
  margin: 16px 0 0;
  color: var(--navy-800);
  font-size: clamp(34px, 3.8vw, 54px);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -2px;
}

.heading-row > p {
  max-width: 420px; margin-bottom: 0;
  color: var(--slate-600); font-size: 17px; line-height: 1.75;
}

/* ── COURSES ─────────────────────────────────────────────────── */
.section-courses { background: var(--ivory-100); padding-block: var(--section-pad); }

/* Course finder bar */
.course-finder {
  display: flex; justify-content: space-between; align-items: center; gap: 22px;
  margin: -10px 0 32px;
  padding: 18px 0;
  border-block: 1px solid rgba(232,160,32,.12);
}

.course-filter-label {
  display: flex; flex-direction: column; gap: 3px;
  color: rgba(255,255,255,.75); font-size: 12px; font-weight: 700;
  white-space: nowrap;
}
.course-count { color: var(--slate-400); font-size: 10px; font-weight: 500; }

.course-filters { display: flex; flex-wrap: wrap; gap: 8px; }

.filter-chip {
  min-height: 36px; padding: 0 16px;
  border: 1.5px solid rgba(255,255,255,.15);
  border-radius: var(--r-pill);
  background: rgba(255,255,255,.05); color: rgba(255,255,255,.65);
  font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all .18s var(--ease);
}
.filter-chip:hover { border-color: rgba(232,160,32,.5); color: var(--gold-400); background: rgba(232,160,32,.08); }
.filter-chip.is-active { border-color: var(--gold-500); background: rgba(232,160,32,.15); color: var(--gold-400); }

/* Course grid */
.course-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

/* ── COURSE CARDS ────────────────────────────────────────────── */
.course-card {
  display: flex; flex-direction: column;
  background: var(--white);
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1.5px solid var(--slate-200);
  box-shadow: 0 2px 12px rgba(11,24,41,.06);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease);
  position: relative;
  cursor: pointer;
}
/* Colored top accent bar per course type */
.course-card::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  border-radius: var(--r-xl) var(--r-xl) 0 0;
  opacity: 0; transition: opacity .3s var(--ease);
}

.course-card:hover { border-color: rgba(232,160,32,.3); transform: translateY(-8px); box-shadow: 0 24px 60px rgba(11,24,41,.13), 0 0 0 1px rgba(232,160,32,.15); background: var(--ivory-100); }
.course-card:hover::before { opacity: 1; }
.course-card[hidden] { display: none; }

/* Card body */
.card-body { flex: 1; display: flex; flex-direction: column; padding: 28px 26px 24px; position: relative; }

/* Top row: tag + number */
.card-top-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.card-num { font-size: 11px; font-weight: 700; color: rgba(255,255,255,.3); letter-spacing: .04em; transition: color .25s; }
.course-card:hover .card-num { color: var(--slate-400); }

.course-tag {
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 20px;
  transition: background .25s, color .25s;
}
.course-card .course-tag { color: var(--navy-800); background: rgba(11,24,41,.07); }
.course-card:hover .course-tag { background: rgba(232,160,32,.12); color: var(--gold-dark); }

.course-card h3 {
  margin-bottom: 10px;
  color: var(--navy-800);
  font-size: 20px; font-weight: 800; line-height: 1.25; letter-spacing: -.5px;
  transition: color .2s;
}
.course-card:hover h3 { color: var(--navy-900); }

.card-body > p {
  margin-bottom: 18px;
  color: var(--slate-500); font-size: 15px; line-height: 1.75;
  flex: 1;
}

/* Topic chips */
.card-topics {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: 18px;
}
.card-topics span {
  padding: 4px 10px; border-radius: 20px;
  border: 1px solid var(--slate-200);
  font-size: 11px; font-weight: 600; color: var(--slate-500);
  transition: border-color .25s, color .25s, background .25s;
}
.course-card:hover .card-topics span { border-color: var(--slate-300); color: var(--slate-600); background: var(--white); }
.course-card:hover .card-topics span:first-child { border-color: rgba(232,160,32,.45); color: var(--gold-dark); background: rgba(232,160,32,.08); }

.course-meta {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding-top: 14px;
  border-top: 1px solid var(--slate-100);
  transition: border-color .25s;
}
.course-card:hover .course-meta { border-color: var(--slate-200); }
.course-meta span {
  padding: 4px 12px; border-radius: var(--r-pill);
  background: var(--ivory-200);
  color: var(--slate-500); font-size: 12px; font-weight: 600;
  transition: background .25s;
}
.course-card:hover .course-meta span { background: var(--ivory-300, #ede9e0); }

/* ── CARD ACTION BUTTONS ─────────────────────────────────────── */
.card-actions {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 10px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--slate-100);
}

.card-btn {
  display: flex; align-items: center; justify-content: center;
  gap: 6px;
  padding: 11px 18px;
  border-radius: var(--r-pill);
  font-size: 13px; font-weight: 700;
  letter-spacing: .01em;
  cursor: pointer;
  transition: transform .22s var(--ease-spring), box-shadow .22s var(--ease), background .2s, color .2s, border-color .2s;
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  border: none;
  font-family: inherit;
}
.card-btn:hover { transform: translateY(-3px) scale(1.03); }
.card-btn:active { transform: translateY(0) scale(.98); }

/* Reserve button — uniform navy/gold */
.card-btn--reserve {
  color: var(--white);
  background: var(--navy-800);
  width: 100%;
}
.card-btn--reserve:hover { background: var(--gold-500); color: var(--navy-800); box-shadow: 0 6px 20px rgba(232,160,32,.35); }

/* Learn more button — outlined */
.card-btn--learn {
  background: transparent;
  border: 1.5px solid var(--slate-200);
  color: var(--slate-600);
}
.card-btn--learn:hover {
  border-color: var(--gold-500);
  color: var(--navy-800);
  background: rgba(232,160,32,.08);
}

/* legacy — keep for course pages */
.course-link { display: none; }

.courses-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 30px; color: var(--slate-400); font-size: 12px;
}
.courses-foot-cta {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 28px;
  background: var(--navy-800);
  color: var(--white);
  border-radius: var(--r-pill);
  font-size: 14px; font-weight: 700;
  cursor: pointer; border: none; font-family: inherit;
  text-decoration: none;
  transition: background .2s, transform .22s var(--ease-spring), box-shadow .2s;
}
.courses-foot-cta .cta-arrow {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px;
  background: rgba(255,255,255,.12);
  border-radius: 50%;
  font-size: 13px;
  transition: transform .22s var(--ease-spring), background .2s;
}
.courses-foot-cta:hover { background: var(--navy-700); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(11,24,41,.2); }
.courses-foot-cta:hover .cta-arrow { transform: translateX(3px); background: var(--gold-500); color: var(--navy-900); }

/* ── CAREER BAND ─────────────────────────────────────────────── */
.career-band {
  background: var(--navy-800);
  color: var(--white);
  padding-block: var(--section-pad);
  position: relative; overflow: hidden;
}

.career-band::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
}

.career-band-inner {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: space-between; gap: 52px;
}

.career-band-copy { max-width: 480px; }
.career-band-copy h2 {
  margin: 18px 0 16px; color: var(--white);
  font-size: clamp(28px, 3vw, 42px); font-weight: 800;
  line-height: 1.2; letter-spacing: -1.5px;
}
.career-band-copy h2 span {
  color: var(--gold-400);
}
.career-band-copy p {
  max-width: 430px; margin-bottom: 28px;
  color: rgba(255,255,255,.6); font-size: 14px; line-height: 1.85;
}

/* Pathway steps — vertical stacked cards */
.pathway { display: flex; flex-direction: column; gap: 0; flex: 0 0 400px; max-width: 400px; }

.path-step {
  display: flex; align-items: flex-start; gap: 18px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r-xl); padding: 24px 26px;
  transition: background .25s, border-color .25s, transform .25s var(--ease);
}
.path-step:hover { background: rgba(255,255,255,.09); border-color: rgba(232,160,32,.3); transform: translateX(6px); }
.path-step-icon {
  width: 54px; height: 54px; flex-shrink: 0;
  background: rgba(232,160,32,.12); border: 1px solid rgba(232,160,32,.25);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: var(--gold-400);
}
.path-step-body { flex: 1; }
.path-step-num { display: block; font-size: 11px; font-weight: 800; letter-spacing: .1em; color: rgba(232,160,32,.55); margin-bottom: 7px; }
.path-step-body h3 { color: var(--white); font-size: 18px; font-weight: 800; margin: 0 0 8px; line-height: 1.3; letter-spacing: -.3px; }
.path-step-body p { color: rgba(255,255,255,.58); font-size: 14px; line-height: 1.72; margin: 0; }
.path-connector { width: 1px; height: 18px; background: rgba(232,160,32,.25); margin-left: 52px; }

/* ── APPROACH ────────────────────────────────────────────────── */
.section-approach { padding-block: var(--section-pad); background: var(--white); }

.approach-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 10%; align-items: center; }

.approach-intro h2 { font-size: clamp(32px, 3.6vw, 48px); margin-bottom: 20px; }
.approach-intro > p { max-width: 360px; margin-bottom: 24px; color: var(--slate-600); font-size: 16px; line-height: 1.85; }

.approach-list article {
  display: grid; grid-template-columns: 40px 1fr 24px; gap: 16px; align-items: start;
  padding: 26px 0; border-bottom: 1px solid var(--slate-200);
  transition: padding-inline .18s var(--ease);
}
.approach-list article:first-child { border-top: 1px solid var(--slate-200); }

.approach-no { padding-top: 2px; color: var(--gold-dark); font-size: 10px; font-weight: 800; }
.approach-list h3 { margin-bottom: 8px; color: var(--navy-800); font-size: 18px; font-weight: 700; letter-spacing: -.3px; }
.approach-list p { margin: 0; color: var(--slate-600); font-size: 15px; line-height: 1.8; }
.approach-arrow { color: var(--slate-400); font-size: 16px; padding-top: 2px; }

/* ── COACHING ────────────────────────────────────────────────── */
.section-coaching { padding-block: var(--section-pad); background: var(--ivory-200); }

.coaching-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 10%; align-items: center; }

.coaching-art {
  position: relative; min-height: 400px; display: grid; place-items: center;
  background: var(--ivory-300); border-radius: var(--r-xl); overflow: hidden;
}
.coaching-art::before, .coaching-art::after {
  content: ""; position: absolute; border: 1px solid rgba(11,24,41,.08); border-radius: 50%;
}
.coaching-art::before { width: 280px; height: 280px; }
.coaching-art::after  { width: 380px; height: 380px; }

.coach-card {
  position: relative; z-index: 1;
  width: 255px; min-height: 292px; padding: 20px 22px 16px;
  background: var(--white);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-float);
  transform: rotate(-4deg);
}
.coach-card-top, .coach-footer {
  display: flex; justify-content: space-between;
  color: var(--slate-400); font-size: 8px; font-weight: 700; letter-spacing: 1.1px;
}
.coach-dot { width: 8px; height: 8px; border-radius: 50%; background: #6ea87c; }
.coach-title {
  margin-top: 36px; color: var(--navy-800);
  font: 800 28px/1.15 var(--font); letter-spacing: -1.2px;
}
.coach-title em { color: var(--gold-dark); font-style: normal; }
.coach-lines { display: grid; gap: 9px; margin: 22px 0 20px; }
.coach-lines i { width: 100%; height: 1px; background: var(--slate-200); }
.coach-lines i:last-child { width: 58%; }
.coach-footer { padding-top: 12px; border-top: 1px solid var(--slate-200); font-size: 7px; }

.coach-sticker {
  position: absolute; z-index: 2; top: 44px; right: 26px;
  width: 94px; height: 94px; display: grid; place-content: center;
  border-radius: 50%; background: var(--navy-800); border: 1.5px solid var(--gold-500);
  color: var(--white); font-size: 9px; font-weight: 700; line-height: 1.5;
  text-align: center; letter-spacing: .8px; transform: rotate(9deg);
}
.coach-sticker span { position: absolute; top: 7px; right: 13px; color: var(--gold-400); font-size: 15px; }

.coaching-copy h2 { font-size: clamp(28px, 3.2vw, 42px); margin-bottom: 18px; }
.coaching-copy > p { color: var(--slate-600); font-size: 14px; line-height: 1.9; }

.check-list { display: grid; gap: 12px; margin: 22px 0 28px; padding: 0; list-style: none; }
.check-list li {
  display: flex; align-items: center; gap: 11px;
  color: var(--navy-800); font-size: 14px; font-weight: 500;
}
.check-list li::before {
  content: "";
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; flex-shrink: 0;
  background: rgba(232,160,32,.12); border: 1.5px solid var(--gold-500);
  border-radius: var(--r-sm);
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%238a6d2a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center;
}

.coaching-copy > small { display: block; margin-top: 16px; color: var(--slate-400); font-size: 12px; }

/* ── COACHING TEASER ────────────────────────────────────────── */
.coaching-teaser-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.coaching-teaser-copy h2 { font-size: clamp(26px, 3vw, 40px); margin-bottom: 14px; }
.coaching-teaser-copy p { color: var(--slate-600); font-size: 15px; line-height: 1.85; margin-bottom: 28px; }

/* Coaching teaser right card */
.ctv-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: var(--r-xl); padding: 28px 30px; }
.ctv-card-label { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(232,160,32,.7); margin-bottom: 18px; }
.ctv-list { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-direction: column; gap: 13px; }
.ctv-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: rgba(255,255,255,.78); line-height: 1.5; }
.ctv-list li svg { flex-shrink: 0; margin-top: 1px; color: var(--gold-400); }
.ctv-footer { display: flex; gap: 24px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.08); }
.ctv-stat strong { display: block; font-size: 22px; font-weight: 800; color: var(--white); letter-spacing: -.5px; }
.ctv-stat span { font-size: 12px; color: rgba(255,255,255,.5); }

/* ── DIFF PILLARS (Why Skayle redesign) ─────────────────────── */
.diff-section { padding-block: var(--section-pad); background: var(--navy-800); }
.diff-header { max-width: 640px; margin: 0 auto 56px; text-align: center; }
.diff-header .eyebrow { justify-content: center; }
.diff-header h2 { color: var(--white); font-size: clamp(28px, 3.5vw, 46px); margin-bottom: 16px; }
.diff-header h2 em { color: var(--gold-400); font-style: normal; }
.diff-intro { color: rgba(255,255,255,.65); font-size: 15px; line-height: 1.85; }
.diff-pillars {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px;
  margin-bottom: 48px;
}
.diff-pillar {
  padding: 32px 28px 36px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--r-xl);
  transition: background .25s, border-color .25s, transform .28s var(--ease), box-shadow .28s var(--ease);
  cursor: default;
  position: relative;
  overflow: hidden;
}
.diff-pillar::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(232,160,32,.07);
  opacity: 0;
  transition: opacity .35s;
  pointer-events: none;
}
.diff-pillar:hover { background: rgba(232,160,32,.07); border-color: rgba(232,160,32,.3); transform: translateY(-6px); box-shadow: 0 16px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(232,160,32,.2); }
.diff-pillar:hover::after { opacity: 1; }
.diff-pillar-icon {
  width: 52px; height: 52px; display: grid; place-items: center;
  background: rgba(232,160,32,.1); border: 1px solid rgba(232,160,32,.2);
  border-radius: 14px; color: var(--gold-400); margin-bottom: 22px;
  transition: background .25s, border-color .25s, transform .25s var(--ease), box-shadow .25s;
}
.diff-pillar:hover .diff-pillar-icon { background: rgba(232,160,32,.18); border-color: rgba(232,160,32,.45); transform: scale(1.12) rotate(-4deg); box-shadow: 0 4px 16px rgba(232,160,32,.25); }
.diff-pillar-icon svg { width: 24px; height: 24px; transition: transform .25s var(--ease); }
.diff-pillar:hover .diff-pillar-icon svg { transform: scale(1.08); }
.diff-pillar strong { display: block; color: var(--white); font-size: 16px; font-weight: 700; line-height: 1.35; margin-bottom: 12px; transition: color .2s; }
.diff-pillar:hover strong { color: rgba(255,255,255,1); }
.diff-pillar p { color: rgba(255,255,255,.55); font-size: 13px; line-height: 1.85; margin: 0; transition: color .2s; }
.diff-pillar:hover p { color: rgba(255,255,255,.72); }
.diff-cta-row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ── CAREERS TEASER ─────────────────────────────────────────── */
.careers-teaser-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.careers-teaser-copy h2 { font-size: clamp(26px, 3vw, 40px); margin-bottom: 14px; }
.careers-teaser-copy p { color: rgba(255,255,255,.65); font-size: 15px; line-height: 1.85; margin-bottom: 28px; }

/* Careers teaser right grid */
.cav-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cav-item { background: rgba(255,255,255,.04); border: 1px solid rgba(232,160,32,.12); border-radius: var(--r-xl); padding: 20px 18px; transition: border-color .3s, transform .3s var(--ease-bounce), box-shadow .3s; }
.cav-item:hover { border-color: rgba(232,160,32,.4); transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,.3), 0 0 30px rgba(232,160,32,.07); }
.cav-icon { width: 40px; height: 40px; border-radius: var(--r-md); background: rgba(232,160,32,.1); display: flex; align-items: center; justify-content: center; color: var(--gold-400); margin-bottom: 12px; }
.cav-item strong { display: block; font-size: 14px; font-weight: 700; color: var(--white); margin-bottom: 6px; }
.cav-item p { font-size: 13px; color: rgba(255,255,255,.6); line-height: 1.65; margin: 0; }

/* ── CAREERS ─────────────────────────────────────────────────── */
.career-section { padding-block: var(--section-pad); background: var(--ivory-100); }

.career-layout { display: grid; grid-template-columns: 1fr .92fr; align-items: center; gap: 10%; }

.career-copy h2 { font-size: clamp(32px, 4vw, 50px); margin-bottom: 18px; }
.career-copy > p { max-width: 465px; color: var(--slate-600); font-size: 14px; line-height: 1.9; }

.career-actions { display: flex; gap: 20px; align-items: center; margin-top: 28px; flex-wrap: wrap; }

.fine-print { max-width: 440px; margin-top: 22px; color: var(--slate-400); font-size: 12px; line-height: 1.75; }

.career-card {
  position: relative; min-height: 370px; overflow: hidden; padding: 32px;
  background: var(--ivory-200);
  border-radius: var(--r-xl);
  border: 1px solid var(--ivory-300);
  box-shadow: var(--shadow-card);
}
.career-card::before {
  content: ""; position: absolute;
  width: 290px; height: 290px; right: -72px; top: 24px;
  border-radius: 50%; border: 1px solid var(--ivory-300);
  box-shadow: 0 0 0 36px rgba(255,255,255,.55), 0 0 0 72px rgba(255,255,255,.3);
}
.career-card::after {
  content: ""; position: absolute;
  width: 110px; height: 110px; top: 110px; right: 80px;
  background: var(--gold-500); opacity: .12; transform: rotate(45deg);
  border-radius: var(--r-sm);
}
.career-card-label { position: relative; z-index: 1; color: var(--slate-400); font-size: 9px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; }
.career-card-title { position: relative; z-index: 2; margin-top: 54px; color: var(--navy-800); font: 800 36px/1.1 var(--font); letter-spacing: -1.5px; }
.career-card-title span { color: var(--gold-dark); }
.career-card-bottom { position: absolute; z-index: 2; left: 32px; right: 32px; bottom: 26px; display: flex; align-items: center; gap: 12px; color: var(--slate-600); font-size: 12px; line-height: 1.5; }
.career-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--ivory-300); border: 2px solid var(--gold-400); color: var(--navy-800); font-size: 9px; font-weight: 800; flex-shrink: 0; }
.career-card-arrow { margin-left: auto; color: var(--gold-dark); font-size: 20px; }
.career-card-stamp { position: absolute; z-index: 2; top: 36px; right: 28px; color: var(--slate-400); font-size: 8px; font-weight: 700; letter-spacing: 1.5px; line-height: 1.7; text-align: right; }

/* ── EMPLOYERS ───────────────────────────────────────────────── */
.employer-section { padding-block: var(--section-pad); background: var(--ivory-100); }

.employer-layout { display: grid; grid-template-columns: 155px 1fr 1fr; gap: 50px; align-items: center; }

.employer-symbol { position: relative; width: 148px; height: 156px; display: grid; place-items: center; }
.employer-symbol svg { width: 136px; fill: none; stroke: var(--slate-300); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.employer-symbol span { position: absolute; top: 58px; left: 52px; color: var(--gold-dark); font-size: 8px; font-weight: 800; letter-spacing: 1.8px; line-height: 1.5; text-align: center; text-transform: uppercase; }

.employer-copy h2 { font-size: clamp(22px, 2.6vw, 32px); margin-bottom: 16px; }
.employer-copy > p { margin-bottom: 20px; font-size: 14px; color: var(--slate-600); }
.employer-note { max-width: 420px; margin-top: 16px; color: var(--slate-400); font-size: 12px; line-height: 1.75; }

.employer-process { border-left: 1px solid var(--slate-200); padding-left: 40px; }
.employer-process > div { display: flex; align-items: center; gap: 18px; padding: 12px 0; }
.employer-process span { color: var(--gold-dark); font-size: 11px; font-weight: 800; }
.employer-process p { margin: 0; color: var(--navy-800); font: 700 13px/1.45 var(--font); }

/* ── RESOURCES ───────────────────────────────────────────────── */
.resource-section { padding-block: var(--section-pad); background: var(--white); }

.resource-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }

.resource-card {
  display: block; background: var(--white);
  border: 1.5px solid var(--slate-200); border-radius: var(--r-lg); overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.resource-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-hover); }

.resource-type { display: flex; justify-content: space-between; padding: 16px 20px 12px; color: var(--slate-400); font-size: 9px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase; }
.resource-type span { color: var(--gold-dark); font-size: 14px; }

.resource-graphic { position: relative; height: 158px; display: flex; align-items: center; justify-content: center; gap: 10px; overflow: hidden; }
.graphic-one { background: var(--ivory-200); }
.graphic-one > span { padding: 9px 11px; border: 1.5px solid var(--ivory-300); color: var(--navy-800); font-size: 9px; font-weight: 800; letter-spacing: .8px; border-radius: var(--r-sm); }
.graphic-one > b { color: var(--gold-dark); font-size: 16px; }

.graphic-two { background: #edf4ee; }
.route { display: flex; align-items: center; gap: 10px; color: var(--navy-800); font-size: 9px; font-weight: 800; letter-spacing: .8px; }
.route i { width: 24px; height: 1.5px; background: var(--gold-400); }

.graphic-three { background: #f5ece4; }
.big-question { color: var(--gold-300); font: 800 100px/1 var(--font); }
.graphic-three div { display: grid; gap: 6px; }
.graphic-three div b { color: var(--navy-800); font-size: 9px; letter-spacing: 1px; }
.graphic-three div i { width: 80px; height: 1px; background: var(--ivory-300); }

.resource-graphic em { position: absolute; bottom: 14px; left: 20px; color: var(--slate-400); font-size: 7.5px; font-style: normal; font-weight: 700; letter-spacing: 1.3px; text-transform: uppercase; }

.resource-card h3 { min-height: 50px; margin: 18px 20px 10px; color: var(--navy-800); font-size: 16px; font-weight: 800; line-height: 1.45; letter-spacing: -.3px; }
.read-link { display: flex; justify-content: space-between; align-items: center; margin: 0 20px 20px; color: var(--slate-600); font-size: 12px; font-weight: 700; }
.read-link b { color: var(--gold-dark); font-size: 16px; }

/* ── FAQ ─────────────────────────────────────────────────────── */
.faq-section { padding-block: var(--section-pad); background: var(--ivory-100); }

.faq-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 10%; }

.faq-intro--sticky { position: sticky; top: 100px; align-self: start; }
.faq-intro h2 { margin: 16px 0 16px; color: var(--navy-800); font-size: clamp(36px, 3.8vw, 52px); font-weight: 800; letter-spacing: -2px; }
.faq-intro p { max-width: 265px; margin-bottom: 28px; color: var(--slate-600); font-size: 14px; line-height: 1.8; }

/* Animated "Let's get started" CTA */
.btn-ask-us {
  position: relative; display: inline-flex; align-items: center; gap: 10px;
  background: var(--navy-800); color: var(--white);
  border: none; border-radius: var(--r-pill);
  padding: 14px 24px; font-size: 15px; font-weight: 700;
  cursor: pointer; font-family: inherit;
  transition: background .2s, transform .2s var(--ease), box-shadow .2s;
}
.btn-ask-us:hover { background: var(--gold-500); color: var(--navy-800); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(232,160,32,.35); }
.btn-ask-us svg { transition: transform .2s var(--ease); }
.btn-ask-us:hover svg { transform: translateX(4px); }
.btn-ask-us-ring {
  position: absolute; inset: -6px; border-radius: 999px;
  border: 2px solid rgba(232,160,32,.4);
  animation: ask-pulse 2.4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes ask-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0; transform: scale(1.18); }
}

.faq-item { border-top: 1px solid var(--slate-200); }
.faq-item:last-child { border-bottom: 1px solid var(--slate-200); }

.faq-item summary {
  position: relative; padding: 22px 40px 22px 0;
  color: var(--navy-800); font: 700 14px/1.5 var(--font);
  cursor: pointer; list-style: none; transition: color .18s;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "+"; position: absolute; top: 18px; right: 0;
  color: var(--gold-dark); font: 400 24px/1 var(--font);
  transition: transform .22s var(--ease);
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item[open] summary { color: var(--gold-dark); }

.faq-item p { max-width: 600px; margin: 0 40px 22px 0; color: var(--slate-600); font-size: 14px; line-height: 1.85; }

/* ── FINAL CTA ───────────────────────────────────────────────── */
.final-cta-wrap { padding-block: 0 80px; background: var(--white); }

.final-cta {
  position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: space-between; gap: 52px;
  min-height: 300px; padding: 64px 8%;
  background: var(--navy-800);
  color: var(--white);
  border-radius: var(--r-xl);
}

.final-cta::before {
  content: ""; position: absolute; inset: 0;
  pointer-events: none;
}

.final-cta-copy { position: relative; z-index: 1; max-width: 480px; }
.final-cta-copy h2 {
  margin: 16px 0 10px; color: var(--white);
  font-size: clamp(28px, 3.2vw, 42px); font-weight: 800; letter-spacing: -1.5px;
}
.final-cta-copy p { color: rgba(255,255,255,.6); font-size: 14px; }

.final-cta-actions { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 12px; min-width: 200px; }

/* ── SITE FOOTER ─────────────────────────────────────────────── */
.site-footer { padding-top: 64px; background: var(--navy-900); color: var(--white); }

.footer-main {
  display: grid; grid-template-columns: 1.5fr .7fr .7fr 1fr; gap: 44px;
  padding-bottom: 56px;
  border-bottom: 1px solid rgba(232,160,32,.12);
}

.brand-logo-foot { height: 96px; width: auto; object-fit: contain; object-position: left top; }

.footer-brand > p { margin: 18px 0 0; color: rgba(255,255,255,.45); font-size: 13px; line-height: 1.85; }

.footer-column { display: grid; align-content: start; gap: 10px; }
.footer-column b { margin-bottom: 8px; color: var(--white); font-size: 13px; font-weight: 700; }
.footer-column a { color: rgba(255,255,255,.5); font-size: 13px; transition: color .18s; }
.footer-column a:hover { color: var(--gold-400); }

.footer-signoff { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; color: rgba(232,160,32,.4); font-size: 9px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }
.footer-signoff div { color: var(--white); font: 600 15px/1 var(--font); letter-spacing: 0; text-transform: none; }
.footer-signoff b { margin-left: 5px; color: var(--gold-400); }

.footer-bottom {
  min-height: 56px; display: flex; justify-content: space-between; align-items: center;
  gap: 24px; color: rgba(255,255,255,.3); font-size: 12px;
}
.footer-bottom a { color: rgba(255,255,255,.55); font-weight: 600; font-size: 12px; transition: color .18s; white-space: nowrap; }
.footer-bottom a:hover { color: var(--gold-400); }
.footer-social { display: flex; gap: 10px; margin-top: 22px; }
.footer-social-link { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.45); transition: background .2s, border-color .2s, color .2s; flex-shrink: 0; }
.footer-social-link:hover { background: rgba(232,160,32,.18); border-color: rgba(232,160,32,.45); color: var(--gold-400); }
.footer-social-link svg { width: 18px; height: 18px; fill: currentColor; stroke: none; }

/* ── DIALOGS ─────────────────────────────────────────────────── */
.info-dialog {
  width: min(760px, calc(100% - 32px)); max-height: min(88vh, 700px); overflow-y: auto;
  padding: 36px 40px 40px; border: none; border-radius: var(--r-xl);
  color: var(--ink); box-shadow: var(--shadow-float);
  position: relative;
}
.info-dialog::backdrop { background: rgba(6,14,26,.75); backdrop-filter: blur(6px); }

.dialog-header { padding-right: 32px; margin-bottom: 28px; }
.dialog-header h2 { margin: 12px 0 10px; color: var(--navy-800); font-size: 28px; font-weight: 800; line-height: 1.2; letter-spacing: -1px; }
.dialog-header > p { color: var(--slate-600); font-size: 14px; line-height: 1.82; margin-bottom: 8px; }
.dialog-audience { color: var(--slate-600); font-size: 13px; line-height: 1.7; }
.dialog-audience strong { color: var(--navy-800); }

.dialog-body { display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: start; padding-top: 24px; border-top: 1px solid var(--slate-200); }
.dialog-left { display: flex; flex-direction: column; gap: 18px; }
.dialog-right h3 { margin: 0 0 14px; color: var(--navy-800); font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.dialog-right ul { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 16px; margin: 0; padding: 0; list-style: none; }
.dialog-right li { display: flex; align-items: flex-start; gap: 7px; color: var(--slate-600); font-size: 13px; line-height: 1.5; }
.dialog-right li::before { content: ''; display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); flex-shrink: 0; margin-top: 5px; }

.dialog-note { padding: 14px 16px; background: var(--ivory-100); border-radius: var(--r-sm); border-left: 3px solid var(--gold-500); color: var(--slate-600); font-size: 12px; line-height: 1.75; }

.dialog-close {
  position: absolute; top: 16px; right: 18px;
  width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: var(--r-sm); background: var(--slate-100); color: var(--slate-600);
  font-size: 20px; line-height: 1; transition: background .15s;
}
.dialog-close:hover { background: var(--slate-200); }

@media (max-width: 600px) {
  .dialog-body { grid-template-columns: 1fr; }
  .dialog-right ul { grid-template-columns: 1fr; }
  .info-dialog { padding: 28px 20px; }
}
.form-dialog { width: min(490px, calc(100% - 32px)); }
.form-dialog form { display: grid; }
.form-dialog label { margin: 14px 0 6px; color: var(--navy-800); font-size: 12.5px; font-weight: 700; }
.form-dialog label span { color: var(--slate-400); font-weight: 400; }
.form-dialog input, .form-dialog select, .form-dialog textarea {
  width: 100%; min-height: 44px; padding: 10px 14px;
  border: 1.5px solid var(--slate-300); border-radius: var(--r-sm);
  background: var(--white); color: var(--ink); font-size: 14px; outline: none;
  transition: border-color .18s, box-shadow .18s;
}
.form-dialog textarea { resize: vertical; }
.form-dialog input:focus, .form-dialog select:focus, .form-dialog textarea:focus {
  border-color: var(--gold-500); box-shadow: 0 0 0 3px rgba(232,160,32,.15);
}
.form-dialog form .button { justify-self: start; margin-top: 24px; }
.form-disclaimer { margin: 14px 0 0; color: var(--slate-400); font-size: 12px; }

.form-success { padding: 14px 16px; border-left: 3px solid #4ade80; border-radius: var(--r-sm); background: #f0fdf4; color: #166534; font-size: 13px; line-height: 1.75; }
.message-preview pre { overflow-wrap: anywhere; white-space: pre-wrap; padding: 14px 16px; border: 1px solid var(--slate-200); border-radius: var(--r-sm); background: var(--ivory-100); color: var(--slate-600); font: 13px/1.75 var(--font); }
.message-preview .button { margin-top: 16px; }

/* ── FOCUS ───────────────────────────────────────────────────── */
:focus-visible { outline: 2.5px solid var(--gold-500); outline-offset: 3px; border-radius: 3px; }

/* ── ANIMATIONS ──────────────────────────────────────────────── */
.motion-ready .reveal {
  opacity: 0; transform: translateY(18px);
  transition: opacity .55s var(--ease-out), transform .55s var(--ease-out);
}
.motion-ready .reveal.is-visible { opacity: 1; transform: translateY(0); }

@keyframes rise-in {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(52,211,153,.2); }
  50%      { box-shadow: 0 0 0 6px rgba(52,211,153,.05); }
}
@keyframes scroll-pulse {
  0%   { transform: translateY(0); opacity: 1; }
  60%  { transform: translateY(14px); opacity: 0; }
  61%  { transform: translateY(0); opacity: 0; }
  100% { opacity: 1; }
}

/* ── RESPONSIVE 1080px ───────────────────────────────────────── */
@media (max-width: 1080px) {
  .primary-nav { gap: 16px; }
  .primary-nav > a, .login-link { font-size: 12.5px; }
  .nav-actions { gap: 14px; }
  .hero-inner { gap: 36px; }
  .course-grid { grid-template-columns: repeat(2,1fr); }
  .career-band-inner { gap: 40px; }
  .path-line { width: 20px; margin-inline: 10px; }
  .employer-layout { grid-template-columns: 120px 1fr .85fr; gap: 30px; }
  .employer-symbol { transform: scale(.85); transform-origin: left center; }
  .stat-block { padding: 24px 40px; }
  .course-finder { align-items: flex-start; flex-direction: column; gap: 10px; }
}

/* ── RESPONSIVE 768px ────────────────────────────────────────── */
@media (max-width: 768px) {
  .section-shell { width: calc(100% - 40px); }

  /* Header */
  .site-header { height: 88px; }
  .nav-wrap { width: calc(100% - 40px); }
  .brand-logo { height: 72px; }
  .menu-toggle { display: grid; }
  .primary-nav {
    position: absolute; top: 88px; left: 0; right: 0; height: auto;
    display: none; padding: 14px 20px 26px;
    border-bottom: 1px solid rgba(232,160,32,.15);
    background: var(--navy-800);
    box-shadow: 0 20px 40px rgba(0,0,0,.25);
  }
  .primary-nav.is-open { display: grid; gap: 0; }
  .primary-nav > a, .login-link { padding: 14px 0; border-bottom: 1px solid rgba(232,160,32,.08); font-size: 14px; }
  .primary-nav > a::after { display: none; }
  .nav-actions { justify-content: space-between; margin: 18px 0 0; }
  /* Mobile coaching dropdown */
  .primary-nav .nav-drop-wrap { display: block; align-self: unset; border-bottom: 1px solid rgba(232,160,32,.08); }
  .primary-nav .nav-drop-wrap > a { padding: 14px 0; border-bottom: none; width: 100%; display: flex; justify-content: space-between; align-items: center; }
  .primary-nav .nav-drop-wrap > a::after { display: none; }
  .drop-arrow { display: flex; align-items: center; transition: transform .22s ease; }
  .nav-drop-wrap.is-open .drop-arrow { transform: rotate(180deg); }
  .nav-drop-wrap .nav-drop { position: static !important; transform: none !important; opacity: 0; pointer-events: none; max-height: 0; overflow: hidden; transition: max-height .3s ease, opacity .3s ease; border-radius: 9px; background: rgba(255,255,255,.04); padding: 0 !important; border: none; min-width: 0; }
  .nav-drop-wrap.is-open .nav-drop { opacity: 1; pointer-events: all; max-height: 300px; padding: 6px !important; margin-bottom: 8px; }

  /* Hero */
  .hero-inner { grid-template-columns: 1fr; gap: 40px; padding-block: 60px 80px; }
  .hero h1 { font-size: clamp(42px, 11vw, 62px); letter-spacing: -2.5px; }
  .hero-lede { font-size: 15px; }
  .hero-stats { margin-top: 32px; padding-top: 24px; }
  .hero-stat strong { font-size: 22px; }
  .hero-scroll-hint { display: none; }

  /* Stats strip */
  .stats-inner { overflow-x: auto; justify-content: flex-start; }
  .stat-block { flex: 0 0 auto; min-width: 110px; padding: 16px 12px; }
  .stat-block strong { font-size: 22px; }
  .stat-block span { font-size: 11px; }
  .stat-divider { height: 28px; }

  /* Intent hooks — stack to 1-col on tablet */
  .intent-hooks { grid-template-columns: 1fr; }

  /* Why Skayle pillars */
  .diff-pillars { grid-template-columns: repeat(2, 1fr); }
  .diff-cta-row { flex-direction: column; align-items: flex-start; }

  /* Sections */
  --section-pad: 72px;
  .section { padding-block: 72px; }
  .heading-row { display: block; margin-bottom: 34px; }
  .heading-row > p { margin: 18px 0 0; }

  /* Courses */
  .course-grid { grid-template-columns: 1fr; gap: 16px; }
  .courses-foot { flex-wrap: wrap; gap: 12px; }

  /* Career band */
  .career-band { padding-block: 64px; }
  .career-band-inner { flex-direction: column; gap: 44px; }
  .pathway { justify-content: center; }

  /* Approach */
  .approach-layout { grid-template-columns: 1fr; gap: 38px; }

  /* Coaching */
  .coaching-layout { grid-template-columns: 1fr; gap: 40px; }
  .coaching-art { min-height: 340px; }
  .coach-sticker { right: calc(50% - 158px); }

  /* Diff pillars */
  .diff-pillars { grid-template-columns: repeat(2, 1fr); }

  /* Careers */
  .career-layout { grid-template-columns: 1fr; gap: 38px; }
  .career-card { min-height: 330px; }

  /* Employers */
  .employer-layout { grid-template-columns: 80px 1fr; gap: 18px; }
  .employer-symbol { width: 100px; transform: scale(.7); transform-origin: left center; margin-right: -14px; }
  .employer-process { grid-column: 1/3; display: flex; justify-content: space-between; gap: 12px; padding: 20px 0 0; border-left: none; border-top: 1px solid var(--slate-200); }
  .employer-process > div { gap: 10px; padding: 4px 0; }
  .employer-process p { font-size: 12px; }

  /* Resources */
  .resource-grid { grid-template-columns: 1fr; gap: 16px; }
  .resource-card { display: grid; grid-template-columns: 1fr 1fr; }
  .resource-type { grid-column: 1/3; }
  .resource-graphic { grid-row: 2/4; height: 162px; }
  .resource-card h3 { min-height: 0; align-self: flex-end; margin: 12px 14px; font-size: 14px; }
  .read-link { align-self: flex-start; margin: 0 14px 14px; }

  /* FAQ */
  .faq-layout { grid-template-columns: 1fr; gap: 32px; }
  .faq-intro h2 { font-size: 34px; }
  .faq-intro--sticky { position: static; }

  /* Coaching + Careers 2-col */
  .coaching-teaser-wrap,
  .careers-teaser-wrap { grid-template-columns: 1fr; gap: 40px; }
  .cav-grid { grid-template-columns: 1fr 1fr; }

  /* Final CTA */
  .final-cta { flex-direction: column; align-items: flex-start; padding: 44px 32px; }
  .final-cta-actions { width: 100%; }
  .final-cta-copy h2 { font-size: 30px; }

  /* Footer */
  .footer-main { grid-template-columns: 1fr 1fr; gap: 34px 24px; }
  .footer-signoff { align-items: flex-start; gap: 22px; }
  .footer-bottom { flex-wrap: wrap; padding-block: 16px; gap: 10px 18px; }
  .footer-bottom span:nth-child(2) { order: 1; flex-basis: 100%; }
  .brand-logo-foot { height: 76px; }
}

/* ── RESPONSIVE 520px ────────────────────────────────────────── */
@media (max-width: 520px) {
  .diff-pillars { grid-template-columns: 1fr; }
}

/* ── RESPONSIVE 440px ────────────────────────────────────────── */
@media (max-width: 440px) {
  .section-shell { width: calc(100% - 32px); }
  .nav-wrap { width: calc(100% - 32px); }
  .hero-inner { padding-inline: 16px; }
  .hero h1 { font-size: 40px; letter-spacing: -2px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .button { justify-content: center; }
  .hero-stats { flex-wrap: wrap; gap: 16px; }
  .hero-stat-divider { display: none; }
  .diff-pillars { grid-template-columns: 1fr; }
  .employer-layout { grid-template-columns: 1fr; }
  .employer-symbol { display: none; }
  .employer-process { grid-column: 1; }
  .resource-card { grid-template-columns: 44% 1fr; }
  .final-cta { padding: 36px 24px; }
  .hc-body { grid-template-columns: 1fr; }
  .hc-widget { display: none; }
}

/* ── REDUCED MOTION ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
  .motion-ready .reveal,
  .motion-ready .reveal.is-visible { opacity: 1; transform: none; transition: none; }
}

/* ============================================================
   TESTIMONIALS (home page)
   ============================================================ */
/* ── COACHING TEASER ────────────────────────────────────────── */
.section-coaching { background: var(--navy-800); }
.section-coaching .coaching-teaser-wrap { align-items: center; }
.section-coaching .eyebrow { color: var(--gold-400); }
.section-coaching .eyebrow-dot { background: var(--gold-400); }
.coaching-teaser-copy h2 { color: var(--white); font-size: clamp(26px, 3vw, 40px); font-weight: 800; letter-spacing: -1.5px; margin: 14px 0 16px; }
.coaching-teaser-copy p { color: rgba(255,255,255,.7); font-size: 16px; line-height: 1.78; margin-bottom: 28px; }

/* ── CAREERS TEASER ─────────────────────────────────────────── */
.careers-teaser-copy h2 { color: var(--white); font-size: clamp(26px, 3vw, 40px); font-weight: 800; letter-spacing: -1.5px; margin: 14px 0 16px; }
.careers-teaser-copy p { color: rgba(255,255,255,.65); font-size: 16px; line-height: 1.78; margin-bottom: 28px; }

/* ── TESTIMONIALS ────────────────────────────────────────────── */
.testimonial-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

.testimonial-card {
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 32px 30px 28px;
  background: var(--white);
  border: 1px solid var(--slate-200); border-top: 3px solid var(--gold-500);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
}

.testimonial-card p {
  margin: 0 0 24px;
  color: var(--navy-800); font-size: 15px; line-height: 1.82; font-weight: 400;
  quotes: "\201C" "\201D";
}
.testimonial-card p::before { content: open-quote; color: var(--gold-500); font-size: 32px; line-height: 0; vertical-align: -12px; margin-right: 4px; }

.testimonial-card cite { font-style: normal; display: flex; flex-direction: column; gap: 2px; }
.tc-name { color: var(--navy-800); font-size: 13px; font-weight: 700; }
.tc-location { color: var(--slate-400); font-size: 12px; font-weight: 500; }

@media (max-width: 768px) {
  .testimonial-grid { grid-template-columns: 1fr; gap: 16px; }
}

/* ============================================================
   COURSE LANDING PAGES
   ============================================================ */

/* ── Breadcrumb ─────────────────────────────────────────────── */
.course-breadcrumb {
  padding: 14px 0;
  background: var(--navy-800);
  border-bottom: 1px solid rgba(232,160,32,.1);
}
.course-breadcrumb-inner {
  width: min(1180px, calc(100% - 80px)); margin: 0 auto;
  display: flex; align-items: center; gap: 8px;
  color: rgba(255,255,255,.45); font-size: 12px; font-weight: 600;
}
.course-breadcrumb-inner a { color: rgba(232,160,32,.7); transition: color .18s; }
.course-breadcrumb-inner a:hover { color: var(--gold-400); }
.course-breadcrumb-inner span { color: rgba(255,255,255,.25); }

/* ── Course Hero ────────────────────────────────────────────── */
.course-hero {
  position: relative; overflow: hidden;
  background: var(--navy-900); color: var(--white);
  padding-block: 80px 76px;
}
.course-hero::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
}

.ch-inner {
  position: relative; z-index: 2;
  width: min(1180px, calc(100% - 80px)); margin: 0 auto;
  display: grid; grid-template-columns: 1fr .55fr; align-items: center; gap: 40px;
}

.ch-copy { padding: 8px 0; }

.course-badge {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 16px 6px 10px;
  background: rgba(232,160,32,.1);
  border: 1px solid rgba(232,160,32,.25);
  border-radius: var(--r-pill);
  color: var(--gold-300); font-size: 10px; font-weight: 800; letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 24px;
}
.cb-pip { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); flex-shrink: 0; }
.cb-dot { color: rgba(232,160,32,.3); font-size: 12px; }

.course-hero h1 {
  font-size: clamp(44px, 5.5vw, 72px);
  font-weight: 800; line-height: 1.08; letter-spacing: -2.5px;
  color: var(--white); margin-bottom: 22px;
}
.course-hero h1 em {
  font-style: normal;
  color: var(--gold-400);
}

.ch-sub {
  max-width: 540px; margin-bottom: 36px;
  color: rgba(255,255,255,.65); font-size: 16px; line-height: 1.82; font-weight: 400;
}

.ch-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 36px; }

.ch-quick-stats {
  display: flex; flex-wrap: wrap; gap: 10px;
  padding-top: 28px; border-top: 1px solid rgba(232,160,32,.18);
}
.cqs-item {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 14px; border-radius: var(--r-pill);
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.75); font-size: 12px; font-weight: 600;
  opacity: 0; transform: translateY(10px);
  animation: cqs-in .45s var(--ease) forwards;
  transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
  cursor: default;
}
.cqs-item:hover { background: rgba(232,160,32,.12); border-color: rgba(232,160,32,.4); transform: translateY(-2px); box-shadow: 0 4px 16px rgba(232,160,32,.15); }
.ch-quick-stats .cqs-item:nth-child(1) { animation-delay: .1s; }
.ch-quick-stats .cqs-item:nth-child(2) { animation-delay: .2s; }
.ch-quick-stats .cqs-item:nth-child(3) { animation-delay: .3s; }
.ch-quick-stats .cqs-item:nth-child(4) { animation-delay: .4s; }
@keyframes cqs-in {
  to { opacity: 1; transform: translateY(0); }
}
.cqs-item b { color: var(--white); }

/* Decorative large number on hero right */
.ch-deco {
  position: relative; display: flex; justify-content: center; align-items: center;
}
.ch-deco-num {
  font-size: clamp(140px, 18vw, 260px);
  font-weight: 800; line-height: 1; letter-spacing: -10px;
  color: rgba(255,255,255,.04); user-select: none;
  position: relative; z-index: 0;
}
.ch-course-pill {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  z-index: 1; text-align: center;
  padding: 22px 28px; min-width: 200px;
  background: rgba(255,255,255,.06); border: 1.5px solid rgba(232,160,32,.3);
  border-radius: var(--r-xl); backdrop-filter: blur(12px);
}
.ch-course-pill-label { display: block; color: var(--gold-400); font-size: 9px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 10px; }
.ch-course-pill-icon {
  width: 56px; height: 56px; margin: 0 auto 12px;
  display: grid; place-items: center;
  background: rgba(232,160,32,.12); border-radius: var(--r-md);
  border: 1px solid rgba(232,160,32,.2);
}
.ch-course-pill-icon svg { width: 28px; fill: none; stroke: var(--gold-400); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ch-course-pill-name { display: block; color: var(--white); font-size: 13px; font-weight: 700; letter-spacing: -.2px; }
.ch-course-pill-count { display: block; margin-top: 4px; color: rgba(255,255,255,.4); font-size: 12px; }

/* ── Course Trust Bar ───────────────────────────────────────── */
.course-trust-bar {
  background: var(--navy-900);
  border-bottom: 1px solid rgba(232,160,32,.1);
}
.ctb-inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0;
  min-height: 52px;
}
.ctb-item {
  padding: 12px 28px;
  color: rgba(255,255,255,.5); font-size: 11.5px; font-weight: 600; letter-spacing: .2px;
  display: flex; align-items: center; gap: 8px;
}
.ctb-item b { color: var(--gold-400); }
.ctb-dot { color: rgba(232,160,32,.25); font-size: 14px; }

/* ── Outcomes ───────────────────────────────────────────────── */
.outcomes-section { background: var(--white); }
.outcomes-intro { max-width: 640px; margin-bottom: 52px; }
.outcomes-intro h2 { margin: 16px 0 0; color: var(--navy-800); font-size: clamp(32px, 3.6vw, 48px); font-weight: 800; letter-spacing: -2px; }

.outcomes-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

.outcome-card {
  padding: 32px 28px 28px;
  background: var(--ivory-100);
  border: 1.5px solid var(--ivory-300); border-radius: var(--r-lg);
  transition: transform .22s var(--ease), border-color .22s, box-shadow .22s;
}
.outcome-card:hover { transform: translateY(-4px); border-color: var(--gold-300); box-shadow: var(--shadow-hover); }

.oc-number { margin-bottom: 20px; color: var(--gold-dark); font-size: 12px; font-weight: 800; letter-spacing: 1.5px; }

.outcome-card h3 {
  margin-bottom: 12px; color: var(--navy-800);
  font-size: 20px; font-weight: 800; line-height: 1.2; letter-spacing: -.5px;
}
.outcome-card p { color: var(--slate-600); font-size: 14px; line-height: 1.85; }

/* ── Curriculum ─────────────────────────────────────────────── */
.curriculum-section { background: var(--ivory-100); }

.curric-layout {
  display: grid; grid-template-columns: 320px 1fr; gap: 72px; align-items: start;
}

.curric-intro .eyebrow { margin-bottom: 14px; }
.curric-intro h2 { margin-bottom: 24px; color: var(--navy-800); font-size: clamp(28px, 3vw, 40px); font-weight: 800; letter-spacing: -1.5px; }
.curric-intro p { margin-bottom: 28px; color: var(--slate-600); font-size: 14px; line-height: 1.85; }

.curric-stats { display: flex; gap: 28px; flex-wrap: wrap; margin-bottom: 32px; }
.curric-stat { text-align: left; }
.curric-stat b { display: block; font-size: 36px; font-weight: 800; color: var(--navy-800); letter-spacing: -1.5px; line-height: 1; }
.curric-stat b span { font-size: 24px; color: var(--gold-dark); }
.curric-stat small { display: block; margin-top: 4px; color: var(--slate-600); font-size: 12px; font-weight: 600; }

/* Module accordion */
.curric-modules { display: grid; gap: 8px; }

.curric-module {
  background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--r-md);
  overflow: hidden;
  transition: border-color .18s;
}
.curric-module.is-open { border-color: var(--gold-400); }

.cm-header {
  display: flex; align-items: center; gap: 14px;
  width: 100%; padding: 18px 20px;
  cursor: pointer; text-align: left;
  background: none; color: var(--navy-800);
  transition: background .15s;
}
.cm-header:hover { background: var(--ivory-100); }
.curric-module.is-open .cm-header { background: var(--ivory-200); }

.cm-num {
  flex-shrink: 0; width: 28px; height: 28px;
  display: grid; place-items: center;
  border-radius: 50%; border: 1.5px solid var(--slate-300);
  color: var(--slate-600); font-size: 9.5px; font-weight: 800;
  transition: border-color .18s, color .18s, background .18s;
}
.curric-module.is-open .cm-num { border-color: var(--gold-500); background: var(--gold-500); color: var(--navy-900); }

.cm-title { flex: 1; font-size: 14px; font-weight: 700; line-height: 1.4; }
.cm-count { flex-shrink: 0; color: var(--slate-400); font-size: 12px; font-weight: 600; }
.cm-chevron {
  flex-shrink: 0; width: 22px; height: 22px;
  display: grid; place-items: center;
  color: var(--slate-400); font-size: 18px; line-height: 1;
  transition: transform .22s var(--ease);
}
.curric-module.is-open .cm-chevron { transform: rotate(45deg); color: var(--gold-dark); }

.cm-lessons {
  display: none;
  padding: 0 20px 18px 62px;
  list-style: none;
}
.curric-module.is-open .cm-lessons { display: block; }

.cm-lessons li {
  padding: 8px 0;
  color: var(--slate-600); font-size: 13px; line-height: 1.5;
  border-bottom: 1px solid var(--slate-200);
  display: flex; align-items: center; gap: 10px;
}
.cm-lessons li:last-child { border-bottom: none; }
.cm-lessons li::before {
  content: "";
  flex-shrink: 0; width: 5px; height: 5px; border-radius: 50%;
  background: var(--gold-400);
}

/* ── Who It's For ───────────────────────────────────────────── */
.audience-section { background: var(--white); }

.audience-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; align-items: start; }

.audience-intro h2 { margin: 16px 0 16px; color: var(--navy-800); font-size: clamp(28px, 3.2vw, 40px); font-weight: 800; letter-spacing: -1.5px; }
.audience-intro p { color: var(--slate-600); font-size: 14px; line-height: 1.85; }

.persona-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

.persona-card {
  padding: 22px 20px;
  border: 1.5px solid var(--slate-200); border-radius: var(--r-lg);
  background: var(--white);
  transition: border-color .2s, box-shadow .2s, transform .2s var(--ease);
}
.persona-card:hover { border-color: var(--gold-400); box-shadow: var(--shadow-card); transform: translateY(-3px); }
.persona-card.is-not-for { opacity: .6; background: var(--ivory-100); }

.pc-icon {
  width: 40px; height: 40px; margin-bottom: 14px;
  display: grid; place-items: center;
  background: var(--ivory-200); border-radius: var(--r-sm);
  color: var(--navy-800); font-size: 18px;
}
.pc-role { display: block; margin-bottom: 6px; color: var(--navy-800); font-size: 13.5px; font-weight: 700; }
.pc-desc { color: var(--slate-600); font-size: 12px; line-height: 1.7; }

.not-for-note {
  margin-top: 24px; padding: 16px 18px;
  background: var(--ivory-100); border-radius: var(--r-md);
  border-left: 3px solid var(--slate-300);
  color: var(--slate-600); font-size: 13px; line-height: 1.75;
}
.not-for-note strong { color: var(--navy-800); display: block; margin-bottom: 4px; }

/* ── Instructor ─────────────────────────────────────────────── */
.instructor-section { background: var(--navy-800); color: var(--white); }

.instructor-layout {
  display: grid; grid-template-columns: 280px 1fr; gap: 60px; align-items: center;
}

.instructor-portrait {
  position: relative; width: 280px; height: 320px;
  background: var(--navy-700); border-radius: var(--r-xl);
  display: grid; place-items: center; overflow: hidden;
  border: 1px solid rgba(232,160,32,.2);
}
.instructor-portrait-deco {
  text-align: center; padding: 40px;
}
.instructor-portrait-deco span { display: block; font-size: 64px; line-height: 1; opacity: .15; }
.instructor-portrait-deco b { display: block; margin-top: 12px; color: var(--gold-400); font: 800 18px/1.2 var(--font); letter-spacing: -0.5px; }
.instructor-portrait-deco small { display: block; margin-top: 6px; color: rgba(255,255,255,.35); font-size: 12px; font-weight: 600; letter-spacing: 1px; }
.instructor-portrait-badge {
  position: absolute; bottom: 16px; left: 16px; right: 16px;
  padding: 10px 14px; background: rgba(232,160,32,.15); border: 1px solid rgba(232,160,32,.25); border-radius: var(--r-sm);
  color: var(--gold-400); font-size: 9px; font-weight: 800; letter-spacing: 1.2px; text-align: center;
}

.instructor-bio h2 { margin: 18px 0 10px; color: var(--white); font-size: clamp(28px, 3vw, 36px); font-weight: 800; letter-spacing: -1.2px; }
.instructor-bio p { color: rgba(255,255,255,.6); font-size: 14px; line-height: 1.85; margin-bottom: 18px; }
.instructor-bio p:last-of-type { margin-bottom: 28px; }

.instructor-credentials { display: flex; flex-wrap: wrap; gap: 8px; }
.instructor-cred {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 14px; border-radius: var(--r-pill);
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.65); font-size: 11.5px; font-weight: 600;
}
.instructor-cred::before { content: "✓"; color: var(--gold-400); font-size: 10px; }

/* ── Course Social Proof ────────────────────────────────────── */
.course-proof-section { background: var(--ivory-100); }

.proof-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 0; margin-bottom: 52px;
  border: 1px solid var(--slate-200); border-radius: var(--r-lg); overflow: hidden;
}
.proof-stat {
  padding: 32px 28px; text-align: center;
  background: var(--white);
  border-right: 1px solid var(--slate-200);
}
.proof-stat:last-child { border-right: none; }
.proof-stat strong { display: block; font-size: 40px; font-weight: 800; line-height: 1; color: var(--gold-dark); letter-spacing: -1.5px; }
.proof-stat span { display: block; margin-top: 6px; color: var(--slate-600); font-size: 12px; font-weight: 600; }

/* ── Course FAQ ─────────────────────────────────────────────── */
/* (reuses existing .faq-section styles) */

/* ── Reserve / Enrollment ───────────────────────────────────── */
.reserve-section { background: var(--navy-900); color: var(--white); }

.reserve-inner {
  display: grid; grid-template-columns: 1fr 420px; gap: 72px; align-items: center;
}

.reserve-copy h2 { margin: 18px 0 14px; color: var(--white); font-size: clamp(30px, 3.6vw, 46px); font-weight: 800; letter-spacing: -1.8px; line-height: 1.12; }
.reserve-copy p { color: rgba(255,255,255,.6); font-size: 15px; line-height: 1.8; }

.reserve-card {
  background: var(--white); color: var(--ink);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.15);
}
.rc-header {
  padding: 24px 28px;
  background: var(--navy-800);
  border-bottom: 1px solid rgba(232,160,32,.18);
}
.rc-label { color: rgba(255,255,255,.5); font-size: 9px; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase; margin-bottom: 8px; }
.rc-course-name { color: var(--white); font-size: 17px; font-weight: 800; line-height: 1.3; letter-spacing: -.3px; }

.rc-body { padding: 28px; }

.rc-includes { list-style: none; display: grid; gap: 10px; margin-bottom: 24px; }
.rc-includes li {
  display: flex; align-items: center; gap: 10px;
  color: var(--navy-800); font-size: 13.5px; font-weight: 500;
}
.rc-includes li::before { content: "✓"; display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; flex-shrink: 0; background: #dcfce7; border-radius: 50%; color: #166534; font-size: 9px; font-weight: 800; }

.rc-urgency {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px; padding: 12px 16px;
  background: #fef9c3; border: 1px solid #fde047; border-radius: var(--r-sm);
  color: #854d0e; font-size: 12px; font-weight: 700;
}
.rc-urgency-dot { width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; flex-shrink: 0; animation: pulse 2s infinite; }

.rc-cta { width: 100%; margin-bottom: 12px; justify-content: center; }

.rc-note { text-align: center; color: var(--slate-400); font-size: 11px; line-height: 1.65; }

/* ── Course page responsive ─────────────────────────────────── */
@media (max-width: 1024px) {
  .ch-inner { grid-template-columns: 1fr; }
  .ch-deco { display: none; }
  .curric-layout { grid-template-columns: 1fr; gap: 40px; }
  .outcomes-grid { grid-template-columns: repeat(2, 1fr); }
  .audience-layout { grid-template-columns: 1fr; gap: 40px; }
  .instructor-layout { grid-template-columns: 1fr; gap: 36px; }
  .instructor-portrait { width: 100%; height: 200px; }
  .proof-stats { grid-template-columns: repeat(2, 1fr); }
  .proof-stat:nth-child(2) { border-right: none; }
  .proof-stat:nth-child(3) { border-right: 1px solid var(--slate-200); border-top: 1px solid var(--slate-200); }
  .proof-stat:nth-child(4) { border-right: none; border-top: 1px solid var(--slate-200); }
  .reserve-inner { grid-template-columns: 1fr; gap: 44px; }
  .reserve-card { max-width: 500px; }
}

@media (max-width: 768px) {
  .course-breadcrumb-inner { width: calc(100% - 40px); }
  .ch-inner { width: calc(100% - 40px); padding-block: 56px 64px; }
  .course-hero h1 { font-size: 42px; letter-spacing: -2px; }
  .ch-actions { flex-direction: column; align-items: stretch; }
  .ch-actions .button { justify-content: center; }
  .ctb-inner { justify-content: flex-start; }
  .ctb-dot { display: none; }
  .ctb-item { padding: 8px 16px; }
  .outcomes-grid { grid-template-columns: 1fr; }
  .persona-grid { grid-template-columns: 1fr; }
  .proof-stats { grid-template-columns: repeat(2, 1fr); }
  .reserve-inner { grid-template-columns: 1fr; }
  .reserve-card { max-width: 100%; }
}

@media (max-width: 440px) {
  .proof-stats { grid-template-columns: 1fr 1fr; }
}

/* ── COUNTER ANIMATION ───────────────────────────────────────── */
.count-up { display: inline-block; }

/* ── MARQUEE ─────────────────────────────────────────────────── */
.marquee-wrap {
  overflow: hidden;
  background: var(--navy-900);
  padding: 14px 0;
  border-block: 1px solid rgba(232,160,32,.15);
}
.marquee-track {
  display: flex; gap: 56px; width: max-content;
  animation: marquee-scroll 28s linear infinite;
}
.marquee-track:hover { animation-play-state: paused; }
.marquee-item {
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
  font-size: 13px; font-weight: 600; color: rgba(255,255,255,.5);
  white-space: nowrap;
}
.marquee-item strong { color: var(--gold-400); }
.marquee-sep { color: rgba(232,160,32,.3); }
@keyframes marquee-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── CAREER PATHS ────────────────────────────────────────────── */
.paths-section { background: var(--ivory-100); padding-block: var(--section-pad); }
.paths-intro { max-width: 640px; margin-bottom: 56px; }
.paths-intro h2 { margin: 10px 0 16px; }
.paths-intro p { font-size: 17px; color: var(--slate-600); line-height: 1.75; }
.paths-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.path-card {
  display: flex; flex-direction: column; gap: 0;
  background: var(--white);
  border: 1px solid var(--slate-200);
  border-radius: var(--r-xl);
  overflow: hidden;
  transition: box-shadow .25s var(--ease), transform .25s var(--ease);
}
.path-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.path-card-top {
  padding: 32px 32px 24px;
  background: var(--navy-800);
  position: relative; overflow: hidden;
}
.path-card-top::before { display: none; }
.path-card-num {
  font-size: 72px; font-weight: 800; line-height: 1;
  color: rgba(232,160,32,.12);
  position: absolute; right: 20px; top: 10px;
  letter-spacing: -3px;
}
.path-card-icon {
  width: 52px; height: 52px; display: grid; place-items: center;
  background: rgba(232,160,32,.12);
  border: 1px solid rgba(232,160,32,.25);
  border-radius: var(--r-md);
  margin-bottom: 18px; position: relative; z-index: 1;
}
.path-card-icon svg { width: 26px; stroke: var(--gold-400); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.path-card-label {
  font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--gold-400); margin-bottom: 8px; position: relative; z-index: 1;
}
.path-card-title {
  font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -.5px;
  color: var(--white); position: relative; z-index: 1;
}
.path-card-body { padding: 28px 32px 32px; flex: 1; display: flex; flex-direction: column; gap: 16px; }
.path-card-desc { font-size: 16px; color: var(--slate-600); line-height: 1.7; }
.path-card-outcomes { list-style: none; display: flex; flex-direction: column; gap: 8px; margin: 0; }
.path-card-outcomes li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 15px; color: var(--slate-700); line-height: 1.5;
}
.path-card-outcomes li::before {
  content: "✓"; flex-shrink: 0;
  width: 20px; height: 20px; border-radius: 50%;
  background: rgba(232,160,32,.1); border: 1px solid rgba(232,160,32,.25);
  display: grid; place-items: center;
  font-size: 11px; font-weight: 800; color: var(--gold-dark);
  margin-top: 1px;
}
.path-card-cta {
  margin-top: auto;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}

@media (max-width: 860px) { .paths-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .path-card-top { padding: 24px; } .path-card-body { padding: 20px 24px 24px; } }

/* ── CASE STUDIES ────────────────────────────────────────────── */
.case-studies-section { background: var(--navy-800); padding-block: var(--section-pad); }
.case-studies-section .eyebrow { color: var(--gold-400); }
.case-studies-section h2 { color: var(--white); max-width: 640px; }
.case-studies-section > .section-shell > p { color: var(--slate-300); max-width: 560px; margin-top: 12px; margin-bottom: 52px; font-size: 17px; line-height: 1.6; }
.cs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.cs-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r-lg);
  padding: 32px 28px;
  display: flex; flex-direction: column; gap: 20px;
  transition: background .2s, border-color .2s;
}
.cs-card:hover { background: rgba(255,255,255,.07); border-color: rgba(232,160,32,.25); }
.cs-type { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-400); }
.cs-scenario { font-size: 18px; font-weight: 700; color: var(--white); line-height: 1.35; }
.cs-challenge { font-size: 14px; color: var(--slate-300); line-height: 1.6; }
.cs-divider { height: 1px; background: rgba(255,255,255,.08); margin: 0; }
.cs-outcome-label { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-300); margin-bottom: 6px; }
.cs-outcome-text { font-size: 15px; color: var(--slate-200); line-height: 1.5; }
.cs-tag { display: inline-block; font-size: 12px; font-weight: 600; color: var(--gold-400); background: rgba(232,160,32,.12); border: 1px solid rgba(232,160,32,.2); border-radius: var(--r-pill); padding: 4px 12px; margin-top: auto; }
.cs-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; }

@media (max-width: 1024px) { .cs-grid { grid-template-columns: 1fr; gap: 20px; } }
@media (max-width: 768px) { .cs-card { padding: 24px 20px; } }

/* ── INTENT HOOK STRIP ───────────────────────────────────────── */
.intent-strip {
  background: var(--navy-800);
  padding: 48px 0;
  position: relative; overflow: hidden;
}
.intent-strip::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
}
.intent-strip-inner {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; gap: 24px;
}
.intent-strip-label {
  font-size: 12px; font-weight: 700; letter-spacing: 1.1px; text-transform: uppercase;
  color: var(--gold-400);
}
.intent-hooks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.intent-hook {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 16px 20px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(232,160,32,.18);
  border-radius: var(--r-lg);
  font-size: 15px; font-weight: 600; color: rgba(255,255,255,.82);
  cursor: pointer;
  transition: background .2s, border-color .2s, color .2s, transform .2s var(--ease);
  text-decoration: none;
}
.intent-hook:hover {
  background: rgba(232,160,32,.1);
  border-color: rgba(232,160,32,.45);
  color: var(--white);
  transform: translateY(-2px);
}
.intent-hook-text { flex: 1; }
.intent-hook-arrow { color: var(--gold-400); font-size: 18px; flex-shrink: 0; }

/* ── BLOG SECTION ────────────────────────────────────────────── */
.blog-section { background: var(--ivory-200); padding-block: var(--section-pad); }
.blog-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 52px; }
.blog-header-left h2 { max-width: 560px; margin-top: 8px; }
.blog-header-right { flex-shrink: 0; }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.blog-card {
  background: var(--white);
  border: 1px solid var(--slate-200);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: box-shadow .2s, transform .2s;
}
.blog-card:hover { box-shadow: 0 8px 40px rgba(11,24,41,.1); transform: translateY(-2px); }
.bc-visual {
  height: 160px;
  background: var(--navy-800);
  display: flex; align-items: flex-end; padding: 20px;
  position: relative; overflow: hidden;
}
.bc-visual::after { content: ""; position: absolute; inset: 0; background: rgba(6,14,26,.55); }
.bc-visual-num { position: absolute; top: 16px; right: 20px; font-size: 80px; font-weight: 800; color: rgba(255,255,255,.06); line-height: 1; font-style: italic; }
.bc-category {
  position: relative; z-index: 1;
  font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold-400); background: rgba(232,160,32,.15); border: 1px solid rgba(232,160,32,.3);
  border-radius: var(--r-pill); padding: 4px 12px;
}
.bc-body { padding: 24px 24px 20px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.bc-meta { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--slate-400); }
.bc-meta span { display: flex; align-items: center; gap: 4px; }
.bc-title { font-size: 17px; font-weight: 700; color: var(--ink); line-height: 1.4; flex: 1; }
.bc-excerpt { font-size: 14px; color: var(--slate-600); line-height: 1.6; }
.bc-link { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--navy-800); text-decoration: none; padding: 16px 24px; border-top: 1px solid var(--slate-200); transition: color .15s; }
.bc-link:hover { color: var(--gold-500); }
.bc-link b { margin-left: auto; }
.blog-foot { display: flex; align-items: center; justify-content: center; margin-top: 40px; gap: 16px; text-align: center; flex-direction: column; }
.blog-foot p { color: var(--slate-600); font-size: 15px; max-width: 480px; }

@media (max-width: 1024px) { .blog-grid { grid-template-columns: 1fr; } .blog-header { flex-direction: column; align-items: flex-start; } }
@media (max-width: 768px) { .bc-visual { height: 120px; } }

/* ── RELATED COURSES STRIP ───────────────────────────────────── */
.related-courses-section { background: var(--slate-100); padding-block: 72px; }
.related-courses-section .eyebrow { color: var(--navy-800); }
.related-courses-section h2 { margin-block: 8px 12px; }
.related-courses-section > .section-shell > p { color: var(--slate-600); font-size: 16px; max-width: 520px; margin-bottom: 36px; }
.related-strip { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.related-card {
  background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--r-lg);
  padding: 28px 24px 52px; display: flex; flex-direction: column; gap: 6px;
  text-decoration: none; color: inherit; position: relative;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.related-card:hover { border-color: var(--gold-500); box-shadow: 0 8px 32px rgba(11,24,41,.1); transform: translateY(-2px); }
.related-card::after { content: "→"; position: absolute; bottom: 24px; right: 24px; font-size: 18px; color: var(--gold-500); transition: transform .2s; }
.related-card:hover::after { transform: translateX(4px); }
.rc-tag2 { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 4px; }
.rc-name2 { font-size: 17px; font-weight: 700; color: var(--navy-800); line-height: 1.3; }
.rc-meta2 { font-size: 13px; color: var(--slate-500); margin-top: 4px; }

/* ── HOW IT WORKS ────────────────────────────────────────────── */
.how-it-works-section { background: var(--navy-800); padding-block: 80px; }
.how-it-works-section .eyebrow { color: var(--gold-400); }
.how-it-works-section h2 { color: var(--white); margin-block: 8px 48px; max-width: 560px; }
.hiw-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; position: relative; }
/* Line runs from centre of col 1 to centre of col 3 (each = 1/6 and 5/6 of total width) */
.hiw-steps::before { content: ""; position: absolute; top: 28px; left: calc(100%/6); right: calc(100%/6); height: 1px; background: rgba(232,160,32,.25); z-index: 0; }
.hiw-step { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; position: relative; z-index: 1; padding-inline: 24px; }
.hiw-step:first-child { padding-left: 0; }
.hiw-step:last-child { padding-right: 0; }
.hiw-num { width: 56px; height: 56px; border-radius: 50%; background: rgba(232,160,32,.15); border: 1px solid rgba(232,160,32,.3); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; color: var(--gold-400); letter-spacing: .04em; }
.hiw-step h3 { font-size: 17px; font-weight: 700; color: var(--white); }
.hiw-step p { font-size: 14px; color: var(--slate-300); line-height: 1.6; }
@media (max-width: 768px) {
  .related-strip { grid-template-columns: 1fr; }
  .hiw-steps { grid-template-columns: 1fr; gap: 32px; }
  .hiw-steps::before { display: none; }
}

/* ── LOGO TRUST STRIP ─────────────────────────────────────────── */
.logo-strip { background: var(--ivory-200); padding: 40px 0 44px; border-bottom: 1px solid rgba(232,160,32,.1); }
.logo-strip-label { text-align: center; font-size: 12px; font-weight: 700; letter-spacing: .1em; color: rgba(255,255,255,.4); text-transform: uppercase; margin-bottom: 28px; }
.logo-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 24px; }
.logo-badge { display: flex; align-items: center; gap: 8px; padding: 12px 24px; background: rgba(255,255,255,.04); border: 1.5px solid rgba(232,160,32,.15); border-radius: 40px; font-size: 15px; font-weight: 700; color: rgba(255,255,255,.7); letter-spacing: .01em; white-space: nowrap; transition: border-color .2s, box-shadow .2s, background .2s; }
.logo-badge:hover { border-color: rgba(232,160,32,.45); box-shadow: 0 2px 16px rgba(232,160,32,.15); background: rgba(232,160,32,.06); }
.logo-badge-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--gold-500); flex-shrink: 0; }
.logo-badge-accent { color: var(--gold-400); }

/* ── TESTIMONIALS ─────────────────────────────────────────────── */
.testimonials-section { background: var(--navy-900); padding-block: var(--section-pad); }
.tc-header-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 36px; flex-wrap: wrap; }
.tc-header-text .eyebrow { color: rgba(232,160,32,.75); }
.tc-header-text h2 { color: var(--white); font-size: clamp(28px, 4vw, 44px); margin-top: 12px; margin-bottom: 0; }
.tc-header-text em { color: var(--gold-400); font-style: normal; }
.tc-nav { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.tc-arrow { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.2); background: none; color: var(--white); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: border-color .18s, background .18s; }
.tc-arrow:hover:not(:disabled) { border-color: var(--gold-500); background: rgba(232,160,32,.1); }
.tc-arrow:disabled { opacity: .3; cursor: default; }
.tc-count { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.45); min-width: 36px; text-align: center; }
.tc-carousel-wrap { overflow: hidden; }
.tc-carousel { display: flex; gap: 22px; transition: transform .45s cubic-bezier(.4,0,.2,1); will-change: transform; }
.testimonial-card { flex: 0 0 calc(33.333% - 15px); min-width: 0; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.09); border-radius: var(--r-xl); padding: 30px 26px; display: flex; flex-direction: column; gap: 18px; transition: border-color .25s, background .25s, transform .25s var(--ease); }
.testimonial-card:hover { background: rgba(255,255,255,.08); border-color: rgba(232,160,32,.28); transform: translateY(-4px); box-shadow: 0 12px 36px rgba(0,0,0,.35); }
.testimonial-stars { display: flex; gap: 3px; }
.testimonial-stars span { color: var(--gold-500); font-size: 15px; }
.testimonial-card .testimonial-quote { font-size: 15px; line-height: 1.78; color: rgba(255,255,255,.82); font-style: italic; flex: 1; }
.testimonial-card .testimonial-quote::before { content: "\201C"; font-size: 44px; line-height: 1; color: rgba(232,160,32,.28); display: block; margin-bottom: -10px; font-style: normal; }
.testimonial-author { display: flex; align-items: center; gap: 14px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.08); margin-top: auto; }
.testimonial-avatar { width: 42px; height: 42px; border-radius: 50%; background: rgba(232,160,32,.15); border: 1px solid rgba(232,160,32,.3); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; color: var(--gold-400); flex-shrink: 0; }
.testimonial-name { font-size: 14px; font-weight: 700; color: var(--white); line-height: 1.3; }
.testimonial-role { font-size: 12px; color: var(--slate-400); margin-top: 2px; }
.tc-location { font-size: 12px; font-weight: 600; color: rgba(232,160,32,.65); margin-top: 3px; }
.testimonials-cta { text-align: center; margin-top: 40px; }
.testimonials-cta p { color: var(--slate-400); font-size: 16px; margin-bottom: 20px; }

/* ── MULTI-STEP FORM ──────────────────────────────────────────── */
.form-dialog {
  max-width: 600px; width: calc(100vw - 40px);
  padding: 0; border-radius: var(--r-2xl);
  border: none; background: var(--white);
  box-shadow: 0 32px 80px rgba(11,24,41,.35);
  /* centering — position:fixed + inset:0 + margin:auto works in all modern browsers */
  position: fixed !important;
  inset: 0 !important;
  margin: auto !important;
  /* constrain height so body scrolls, topbar stays visible */
  height: fit-content;
  max-height: min(92vh, 760px);
  overflow: hidden;
}
.mf-shell { display: flex; flex-direction: column; height: 100%; max-height: inherit; }
.mf-topbar { background: var(--navy-900); padding: 18px 24px 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); flex-shrink: 0; min-height: 64px; }
.mf-topbar .dialog-close { position: static; top: auto; right: auto; color: rgba(255,255,255,.55); font-size: 22px; line-height: 1; padding: 4px 8px; border-radius: 6px; background: none; }
.mf-topbar .dialog-close:hover { background: rgba(255,255,255,.1); color: var(--white); }
.mf-progress-wrap { display: flex; align-items: center; gap: 12px; }
.mf-dots { display: flex; gap: 8px; }
.mf-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.2); transition: background .25s, transform .25s; }
.mf-dot.is-active { background: var(--gold-500); transform: scale(1.3); }
.mf-dot.is-done { background: rgba(232,160,32,.5); }
.mf-step-label { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.4); letter-spacing: .06em; }
.mf-body { padding: 22px 24px 20px; flex: 1; overflow-y: auto; }
.mf-step { animation: mf-fadein .3s var(--ease) both; position: relative; }
@keyframes mf-fadein { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.mf-step .eyebrow { font-size: 11px; letter-spacing: .1em; color: var(--gold-dark); margin-bottom: 10px; display: block; }
.mf-step h2 { font-size: clamp(20px, 3vw, 24px); color: var(--navy-900); margin-bottom: 6px; }
.mf-step > p { font-size: 14px; color: var(--slate-500); margin-bottom: 18px; }

/* Role cards (step 1) */
.mf-role-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.mf-role-card { background: var(--ivory-100); border: 2px solid var(--slate-200); border-radius: var(--r-lg); padding: 16px 14px; text-align: left; cursor: pointer; transition: border-color .2s, background .2s, transform .2s var(--ease), box-shadow .2s; display: flex; flex-direction: column; gap: 5px; }
.mf-role-card:hover { border-color: rgba(232,160,32,.5); background: var(--white); transform: translateY(-2px); box-shadow: 0 6px 24px rgba(11,24,41,.1); }
.mf-role-card.is-selected { border-color: var(--gold-500); background: rgba(232,160,32,.06); }
.mf-role-icon { width: 44px; height: 44px; margin-bottom: 10px; display: flex; align-items: center; justify-content: center; background: rgba(232,160,32,.12); border-radius: var(--r-md); flex-shrink: 0; }
.mf-role-icon svg { width: 24px; height: 24px; stroke: var(--gold-dark); }
.mf-role-card strong { font-size: 15px; font-weight: 700; color: var(--navy-900); }
.mf-role-card span { font-size: 13px; color: var(--slate-500); line-height: 1.5; }

/* Goal buttons (step 2) */
.mf-goal-grid { display: flex; flex-direction: column; gap: 8px; margin: 14px 0 18px; }
.mf-goal-btn { background: var(--ivory-100); border: 1.5px solid var(--slate-200); border-radius: var(--r-lg); padding: 13px 18px; text-align: left; font-size: 14px; font-weight: 600; color: var(--navy-800); cursor: pointer; transition: border-color .2s, background .2s, transform .15s var(--ease); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mf-goal-btn::after { content: "→"; font-size: 16px; color: var(--gold-dark); flex-shrink: 0; transition: transform .2s; }
.mf-goal-btn:hover { border-color: rgba(232,160,32,.5); background: var(--white); transform: translateX(4px); }
.mf-goal-btn:hover::after { transform: translateX(4px); }

/* ── GLOBAL FORM SYSTEM ─────────────────────────────────────── */
.mf-field { display: flex; flex-direction: column; gap: 6px; }
.mf-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* Labels */
.mf-field label,
#contact-form label,
.form-dialog label {
  font-size: 11px; font-weight: 800; color: var(--navy-800);
  text-transform: uppercase; letter-spacing: .08em; line-height: 1;
}
.mf-field label span, #contact-form label span, .form-dialog label span { font-weight: 400; text-transform: none; color: var(--slate-400); letter-spacing: 0; }

/* Inputs, selects, textareas */
.mf-field input, .mf-field select, .mf-field textarea,
#contact-form input, #contact-form select, #contact-form textarea,
.form-dialog input, .form-dialog select, .form-dialog textarea {
  width: 100%; min-height: 48px; padding: 12px 16px;
  border: 1.5px solid #DDE2EA; border-radius: 10px;
  background: #F8FAFB; color: var(--navy-900);
  font-size: 14px; font-family: inherit;
  outline: none; box-sizing: border-box;
  transition: border-color .15s, box-shadow .15s, background .15s;
  -webkit-appearance: none; appearance: none;
}
.mf-field input:hover, .mf-field select:hover, .mf-field textarea:hover,
#contact-form input:hover, #contact-form select:hover, #contact-form textarea:hover,
.form-dialog input:hover, .form-dialog select:hover, .form-dialog textarea:hover {
  border-color: #B8C0CC;
}
.mf-field input:focus, .mf-field select:focus, .mf-field textarea:focus,
#contact-form input:focus, #contact-form select:focus, #contact-form textarea:focus,
.form-dialog input:focus, .form-dialog select:focus, .form-dialog textarea:focus {
  border-color: var(--gold-500); box-shadow: 0 0 0 4px rgba(232,160,32,.14);
  background: var(--white);
}
.mf-field input::placeholder, #contact-form input::placeholder, .form-dialog input::placeholder,
.mf-field textarea::placeholder, #contact-form textarea::placeholder, .form-dialog textarea::placeholder { color: #9BA5B4; }
.mf-field textarea, #contact-form textarea { min-height: 96px; resize: vertical; line-height: 1.6; }
.mf-field select, #contact-form select, .form-dialog select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7896' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 40px;
}

/* Course page simple form */
#contact-form { display: flex; flex-direction: column; gap: 16px; }
#contact-form .btn-gold { width: 100%; justify-content: center; font-size: 15px; padding: 15px 24px; margin-top: 4px; }

/* Form grid rows (2-col) */
.form-grid-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* Back button */
.mf-back { background: none; border: none; padding: 0; font-size: 14px; font-weight: 600; color: var(--slate-400); cursor: pointer; transition: color .2s; display: inline-flex; align-items: center; gap: 6px; }
.mf-back:hover { color: var(--navy-800); }
.mf-btn-row { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; gap: 12px; }
.mf-next-btn { padding: 12px 28px; font-size: 15px; font-weight: 700; }

/* Step 3 situation styles */
/* .mf-ctx visibility controlled by JS via hidden attribute */
.mf-choice-label { font-size: 13px; font-weight: 700; color: var(--navy-700); margin-bottom: 10px; margin-top: 4px; }
.mf-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 4px; }
.mf-choice-grid--3 { grid-template-columns: repeat(3, 1fr); }
.mf-choice { border: 1.5px solid var(--slate-200); background: var(--white); border-radius: var(--r-lg); padding: 14px 14px; font-size: 14px; font-weight: 600; color: var(--navy-800); text-align: left; cursor: pointer; transition: border-color .15s, background .15s; line-height: 1.35; }
.mf-choice:hover { border-color: rgba(232,160,32,.6); background: rgba(232,160,32,.04); }
.mf-choice.is-selected { border-color: var(--gold-500); background: rgba(232,160,32,.1); color: var(--navy-900); box-shadow: 0 0 0 1px rgba(232,160,32,.3); }
.mf-step-illo { position: absolute; top: 24px; right: 24px; opacity: .18; pointer-events: none; }
.mf-step-illo svg { width: 72px; height: 72px; }

/* Success step */
.mf-success { text-align: center; padding: 20px 0 8px; }
.mf-success-icon { width: 72px; height: 72px; border-radius: 50%; background: rgba(232,160,32,.1); border: 2px solid var(--gold-500); display: flex; align-items: center; justify-content: center; font-size: 28px; color: var(--gold-dark); margin: 0 auto 20px; }
.mf-success h2 { font-size: 28px; color: var(--navy-900); margin-bottom: 12px; }
.mf-success p { font-size: 16px; color: var(--slate-500); max-width: 380px; margin: 0 auto 28px; }
.mf-success .spots-note { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--gold-dark); background: rgba(232,160,32,.08); border: 1px solid rgba(232,160,32,.2); border-radius: 40px; padding: 8px 16px; margin-bottom: 24px; }

/* Small class badge */
.small-class-badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(232,160,32,.08); border: 1px solid rgba(232,160,32,.25); border-radius: 40px; padding: 6px 14px; font-size: 13px; font-weight: 600; color: var(--gold-dark); margin-top: 12px; }
.small-class-badge::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--gold-500); animation: pulse 2s ease infinite; flex-shrink: 0; }
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.6; transform:scale(1.3); } }

/* Job placement strip */
.placement-strip { background: var(--navy-900); border: 1px solid rgba(232,160,32,.2); border-radius: var(--r-xl); padding: 24px 32px; margin-top: 24px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.placement-strip-icon { font-size: 32px; flex-shrink: 0; }
.placement-strip-copy strong { font-size: 18px; font-weight: 800; color: var(--white); display: block; margin-bottom: 4px; }
.placement-strip-copy span { font-size: 14px; color: var(--slate-300); }
.placement-strip-logos { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.placement-logo-pill { padding: 5px 12px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 20px; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.65); white-space: nowrap; }

@media (max-width: 768px) {
  .testimonials-grid { grid-template-columns: 1fr; }
  .mf-role-grid { grid-template-columns: 1fr; }
  .mf-field-row { grid-template-columns: 1fr; }
  .logo-row { gap: 6px 12px; }
  .placement-strip { flex-direction: column; align-items: flex-start; }
  .placement-strip-logos { margin-left: 0; }
}

/* ── ENHANCED INTERACTIVITY & VISUAL LIFE ─────────────────────── */

.section > * { position: relative; z-index: 1; }
.section > .section-shell { position: relative; z-index: 1; }

/* Glow effect on stat blocks */
.stat-block { position: relative; transition: transform .25s var(--ease); }
.stat-block:hover { transform: translateY(-4px); }
.stat-block strong { color: var(--navy-800); background: none; }

/* Course card glow on hover */
.course-card { transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.course-card:hover { border-color: rgba(232,160,32,.3); box-shadow: 0 24px 64px rgba(11,24,41,.14), 0 0 0 1px rgba(232,160,32,.12); }
.card-visual { position: relative; overflow: hidden; }
.card-visual::after { display: none; }

/* Approach article hover */
.approach-list article { transition: transform .25s var(--ease), background .25s, box-shadow .25s; border-radius: var(--r-lg); padding: 24px; margin: 0 -24px; }
.approach-list article:hover { background: var(--white); transform: translateY(-2px); box-shadow: 0 0 0 1.5px var(--gold-500), 0 6px 24px rgba(11,24,41,.08); }

/* Path card animation */
.path-card { transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.path-card:hover { transform: translateY(-6px); box-shadow: 0 20px 56px rgba(11,24,41,.18); border-color: rgba(232,160,32,.3); }
.path-card-top::before { display: none; }

/* Blog card visual upgrade */
.bc-visual { position: relative; overflow: hidden; }
.bc-visual::before { display: none; }
.blog-card { transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.blog-card:hover { transform: translateY(-8px); box-shadow: 0 24px 60px rgba(11,24,41,.12); }
.blog-card:hover .bc-link { color: var(--gold-dark); }

/* Case study card */
.cs-card { transition: transform .3s var(--ease), border-color .3s, background .3s; }
.cs-card:hover { transform: translateY(-6px); border-color: rgba(232,160,32,.3); background: rgba(255,255,255,.07); }

/* Testimonial card extra hover pop */
.testimonial-card { cursor: default; }
.testimonial-quote { position: relative; z-index: 1; }

/* Intent hook pulse animation */
.intent-hook { animation: none; }
.intent-hook:nth-child(1) { animation-delay: 0s; }
.intent-hook:nth-child(2) { animation-delay: .1s; }
.intent-hook:nth-child(3) { animation-delay: .2s; }
.intent-hook:nth-child(4) { animation-delay: .3s; }
.intent-hook:nth-child(5) { animation-delay: .4s; }

/* Hero badge float */
.hero-badge { animation: badge-float 4s ease-in-out infinite; }
@keyframes badge-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* Live dot pulse */
.live-dot { animation: live-pulse 1.4s ease infinite; }
@keyframes live-pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.5; transform:scale(1.5); } }

/* Scroll reveal — enhanced */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal:nth-child(2) { transition-delay: .08s; }
.reveal:nth-child(3) { transition-delay: .16s; }
.reveal:nth-child(4) { transition-delay: .24s; }
.reveal:nth-child(5) { transition-delay: .32s; }
.reveal:nth-child(6) { transition-delay: .40s; }

/* Logo badge entrance */
.logo-badge { transition: transform .2s var(--ease), border-color .2s, box-shadow .2s; }
.logo-badge:hover { transform: translateY(-3px) scale(1.03); }

/* Career band pathway steps */
.path-step { transition: transform .25s var(--ease); }
.path-step:hover { transform: translateY(-6px) scale(1.04); }

/* HiW step cards */
.hiw-step { transition: transform .25s var(--ease), box-shadow .25s; }
.hiw-step:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(11,24,41,.12); }

/* Resource card */
.resource-card { transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.resource-card:hover { transform: translateY(-8px); box-shadow: 0 20px 56px rgba(11,24,41,.12); border-color: rgba(232,160,32,.25); }

/* FAQ hover */
.faq-item summary { transition: color .2s, padding-left .2s; }
.faq-item summary:hover { color: var(--gold-dark); padding-left: 4px; }
.faq-item[open] summary { color: var(--gold-dark); }
.faq-item[open] { border-color: rgba(232,160,32,.3); background: rgba(232,160,32,.025); }

.hero-stat strong { color: var(--gold-400); }

/* Section dividers */
.section + .section::before { display: none; }
.careers-section { background: var(--ivory-100); }


/* ── INSTRUCTOR SECTION ─────────────────────────────────────── */
.instructor-wrap {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 48px;
  align-items: start;
}
.instructor-avatar {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: var(--navy-800);
  border: 3px solid var(--gold-500);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.instructor-initials {
  font-size: 32px;
  font-weight: 800;
  color: var(--gold-500);
  letter-spacing: 1px;
}
.instructor-bio h2 {
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 800;
  color: var(--navy-900);
  margin: 12px 0 6px;
}
.instructor-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--gold-dark);
  margin: 0 0 20px;
  letter-spacing: .02em;
}
.instructor-story {
  font-size: 16px;
  line-height: 1.75;
  color: var(--navy-700);
  margin: 0 0 16px;
  max-width: 680px;
}
@media (max-width: 600px) {
  .instructor-wrap {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .instructor-avatar {
    width: 80px;
    height: 80px;
  }
  .instructor-initials {
    font-size: 22px;
  }
}

/* ── HERO H1 STANDARDIZATION ──────────────────────────────── */
.page-hero h1,
.employer-hero h1,
.coaching-hero h1,
.blog-hero h1 {
  font-size: clamp(44px, 5.5vw, 72px);
  font-weight: 800;
  line-height: 1.12;
}
.blog-article-hero h1,
.post-hero h1 {
  font-size: clamp(36px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.2;
}

/* ── COURSE CURRICULUM GRID ────────────────────────────────── */
.curriculum-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  margin-top: 48px;
  border: 1px solid var(--slate-200);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.curr-module {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  padding: 24px 28px;
  background: var(--white);
  border-right: 1px solid var(--slate-200);
  border-bottom: 1px solid var(--slate-200);
  transition: background .2s;
}
.curr-module:hover { background: var(--ivory-100); }
.curr-num {
  font-size: 11px;
  font-weight: 800;
  color: var(--gold-500);
  letter-spacing: .1em;
  min-width: 24px;
  padding-top: 3px;
  flex-shrink: 0;
}
.curr-content h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy-800);
  margin: 0 0 6px;
  line-height: 1.35;
}
.curr-content p {
  font-size: 13px;
  color: var(--slate-500);
  line-height: 1.65;
  margin: 0;
}
@media (max-width: 700px) {
  .curriculum-grid { grid-template-columns: 1fr; }
}

/* ── BLOG POST HERO H1 OVERRIDE ─────────────────────────────── */
.post-hero h1,
html .post-hero h1 {
  font-size: clamp(36px, 4.5vw, 54px) !important;
  line-height: 1.18 !important;
}

/* ── TESTIMONIAL BROKERAGE TAG ──────────────────────────────── */
.tc-brokerage {
  display: block;
  font-size: 11px;
  color: rgba(232,160,32,.55);
  font-weight: 500;
  letter-spacing: .03em;
  margin-top: 2px;
}

/* ── CAREER BAND — LIGHT TREATMENT ─────────────────────────── */
.career-band {
  background: var(--ivory-100) !important;
}
.career-band .eyebrow,
.career-band .eyebrow-light {
  color: var(--gold-dark);
}
.career-band .eyebrow-dot,
.career-band .eyebrow-light::before {
  background: var(--gold-dark);
}
.career-band h2 { color: var(--navy-900); }
.career-band h2 span { color: var(--navy-700); }
.career-band .career-band-copy > p { color: var(--slate-600); }
.career-band .path-step-body h3 { color: var(--navy-800); }
.career-band .path-step-body p { color: var(--slate-600) !important; }
.career-band .path-step-num { color: var(--gold-500); }
.career-band .path-step-icon {
  background: var(--navy-800);
  color: var(--white);
  border-color: rgba(11,24,41,.12);
}
.career-band .path-connector { background: rgba(11,24,41,.12); }
.career-band .btn-white {
  background: var(--navy-800);
  color: var(--white);
  border-color: var(--navy-800);
}
.career-band .btn-white:hover {
  background: var(--gold-500);
  color: var(--navy-800);
  border-color: var(--gold-500);
}

/* ── POST QUICK ANSWER ─────────────────────────────────────── */
.post-quick-answer {
  background: var(--ivory-200, #f5f2ea);
  border-left: 3px solid var(--gold-500);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  padding: 18px 22px;
  margin: 0 0 32px;
}
.pqa-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--gold-dark);
  text-transform: uppercase;
  margin-bottom: 8px;
}
.post-quick-answer p {
  font-size: 15px;
  line-height: 1.65;
  color: var(--navy-800);
  margin: 0;
  font-weight: 500;
}
/* ── ENROLMENT SECTION ─────────────────────────────────────── */
.enrol-wrap { display: grid; grid-template-columns: 1fr 340px; gap: 64px; align-items: center; }
.enrol-card { background: rgba(255,255,255,.05); border: 1px solid rgba(232,160,32,.2); border-radius: 20px; padding: 32px; display: flex; flex-direction: column; gap: 18px; }
.enrol-item { display: flex; align-items: flex-start; gap: 12px; color: rgba(255,255,255,.8); font-size: 14px; line-height: 1.5; }
.enrol-item svg { flex-shrink: 0; margin-top: 1px; }
@media (max-width: 860px) { .enrol-wrap { grid-template-columns: 1fr; gap: 32px; } }

/* ═══════════════════════════════════════════════════════════════════════
   V4 — DARK NAVY + BRIGHT GOLD · TYPOGRAPHY · MOTION
   ═══════════════════════════════════════════════════════════════════════ */

/* ── TOKEN OVERRIDES ─────────────────────────────────────────────────── */
:root {
  --ivory-100: #070D1B;
  --ivory-200: #0C1730;
  --ivory-300: #111E35;
  --gold-500: #E8A020;
  --gold-400: #F0BB45;
  --gold-300: #F5D888;
  --gold-dark: #C07A10;
  --glow-gold: 0 0 40px rgba(232,160,32,.4), 0 0 80px rgba(232,160,32,.15);
  --glow-gold-sm: 0 0 20px rgba(232,160,32,.35);
  --glow-gold-xs: 0 0 12px rgba(232,160,32,.25);

  /* Flip text-only dark tokens to light for dark theme */
  --ink:      rgba(255,255,255,.82);
  --slate-600: rgba(255,255,255,.65);
  --slate-500: rgba(255,255,255,.55);
  --slate-400: rgba(255,255,255,.42);
  --slate-300: rgba(255,255,255,.25);
  --slate-200: rgba(255,255,255,.12);
  --white:    #ffffff;
  --ease-bounce: cubic-bezier(.34,1.56,.64,1);
  --ease-decel: cubic-bezier(0,.55,.45,1);
  /* slate-700 was dark (#334155) — flip to muted light */
  --slate-700: rgba(255,255,255,.55);
}

/* ── GLOBAL DARK BASE ────────────────────────────────────────────────── */
body { background: var(--ivory-100); color: rgba(255,255,255,.82); }

/* ── SECTION BACKGROUNDS ─────────────────────────────────────────────── */
.section-approach { background: var(--ivory-200) !important; }
.section-coaching { background: var(--ivory-100) !important; }
.faq-section { background: var(--ivory-200) !important; }
.final-cta-wrap { background: var(--ivory-100) !important; padding-top: 72px !important; padding-bottom: 80px !important; }

/* career-band: restore dark navy, remove earlier ivory override */
.career-band { background: #060e1a !important; }
.career-band h2 { color: var(--white) !important; }
.career-band h2 span { color: var(--gold-400) !important; }
.career-band .career-band-copy > p { color: rgba(255,255,255,.6) !important; }
.career-band .path-step-body h3 { color: var(--white) !important; }
.career-band .path-step-body p { color: rgba(255,255,255,.58) !important; }
.career-band .path-step-num { color: rgba(232,160,32,.55) !important; }
.career-band .path-step-icon { background: rgba(232,160,32,.12); border-color: rgba(232,160,32,.25); color: var(--gold-400); }
.career-band .path-connector { background: rgba(232,160,32,.2) !important; }
.career-band .btn-white { background: var(--gold-500) !important; color: #04080F !important; border-color: var(--gold-500) !important; }
.career-band .btn-white:hover { background: var(--gold-400) !important; box-shadow: var(--glow-gold-sm) !important; }

/* ── SECTION HEADINGS + TEXT (dark sections) ─────────────────────────── */
.section-head h2, .section-head h3,
.section-heading h2,
.faq-intro h2, .approach-intro h2,
.coaching-copy h2, .coaching-teaser-copy h2,
.heading-row h2 { color: var(--white) !important; }
.section-head p, .faq-intro p, .approach-intro > p,
.coaching-copy > p, .coaching-copy > small,
.coaching-teaser-copy p,
.heading-row > p { color: rgba(255,255,255,.65) !important; }

/* ── APPROACH LIST DARK ──────────────────────────────────────────────── */
.approach-list article { border-top-color: rgba(255,255,255,.1) !important; border-bottom-color: rgba(255,255,255,.1) !important; transition: padding-inline .2s var(--ease), background .2s !important; }
.approach-list article:hover { background: rgba(232,160,32,.04); padding-left: 12px; }
.approach-list h3 { color: var(--white) !important; }
.approach-list p  { color: rgba(255,255,255,.6) !important; }
.approach-no { color: rgba(232,160,32,.65) !important; }
.approach-arrow { color: rgba(255,255,255,.2) !important; }

/* ── COACHING ART + CHECK LIST DARK ─────────────────────────────────── */
.coaching-art { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(232,160,32,.12) !important; }
.coaching-art::before, .coaching-art::after { border-color: rgba(232,160,32,.08) !important; }
.check-list li { color: rgba(255,255,255,.8) !important; }
.check-list li::before { background-color: rgba(232,160,32,.12) !important; border-color: var(--gold-500) !important; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%23E8A020' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important; }

/* ── FAQ SECTION DARK ────────────────────────────────────────────────── */
/* FAQ card redesign */
.faq-item {
  border: 1px solid rgba(255,255,255,.08) !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.03) !important;
  overflow: hidden !important;
  transition: border-color .2s, background .2s, box-shadow .2s !important;
}
.faq-item:last-child { border-bottom: 1px solid rgba(255,255,255,.08) !important; }
.faq-item[open] {
  border-color: rgba(232,160,32,.4) !important;
  border-left: 3px solid var(--gold-500) !important;
  background: rgba(232,160,32,.04) !important;
  box-shadow: 0 4px 24px rgba(232,160,32,.08) !important;
}
.faq-item summary {
  color: rgba(255,255,255,.88) !important;
  padding: 20px 24px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
.faq-item summary:hover { color: var(--white) !important; padding-left: 28px !important; }
.faq-item[open] summary { color: var(--gold-400) !important; }
.faq-item summary::after { color: rgba(232,160,32,.7) !important; right: 24px !important; }
.faq-item p { color: rgba(255,255,255,.6) !important; padding: 0 24px 20px 24px !important; margin: 0 !important; }

/* ── COURSE CARDS DARK + BOUNCY HOVER ───────────────────────────────── */
.course-card { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(232,160,32,.12) !important; box-shadow: 0 4px 24px rgba(0,0,0,.25) !important; transition: transform .35s var(--ease-bounce), box-shadow .35s var(--ease), border-color .35s !important; position: relative !important; cursor: pointer !important; }
.course-card:hover { transform: translateY(-10px) scale(1.01) !important; border-color: rgba(232,160,32,.4) !important; box-shadow: 0 32px 64px rgba(0,0,0,.4), 0 0 80px rgba(232,160,32,.1) !important; }
/* Stretched link — raise overlay ABOVE card-body (which is position:relative) */
.card-link-overlay { position: absolute; inset: 0; z-index: 2 !important; border-radius: var(--r-xl); }
/* CTA button and any interactive element must sit above the overlay */
.card-footer-row { position: relative; z-index: 3; }
.card-actions { position: relative; z-index: 3; }

/* Card footer: meta left, button right */
.card-footer-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: auto !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  flex-wrap: wrap !important;
}
.card-footer-row .course-meta {
  border-top: none !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
}
/* Icon + number stat pills */
.cm-stat {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px 10px !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 100px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.55) !important;
  white-space: nowrap !important;
}
.cm-stat strong {
  color: rgba(255,255,255,.88) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  -webkit-text-fill-color: rgba(255,255,255,.88) !important;
}
.cm-stat svg {
  color: var(--gold-500) !important;
  flex-shrink: 0 !important;
}
.course-card:hover .cm-stat {
  border-color: rgba(232,160,32,.2) !important;
  background: rgba(232,160,32,.06) !important;
}
.course-card:hover .cm-stat svg { color: var(--gold-400) !important; }
.card-footer-row .card-btn--reserve {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
.course-card h3 { color: var(--white) !important; }
.course-card > p, .course-card .course-desc { color: rgba(255,255,255,.6) !important; }
.card-topics span { border-color: rgba(255,255,255,.12) !important; color: rgba(255,255,255,.5) !important; background: transparent !important; }
.card-topics span:first-child { border-color: rgba(232,160,32,.3) !important; color: var(--gold-400) !important; }
.course-card:hover .card-topics span:first-child { background: rgba(232,160,32,.12) !important; }
.course-meta span { background: rgba(255,255,255,.05) !important; color: rgba(255,255,255,.5) !important; }
.card-actions { border-top-color: rgba(255,255,255,.08) !important; }
.course-meta { border-top-color: rgba(255,255,255,.08) !important; }
.card-btn--learn { border-color: rgba(255,255,255,.15) !important; color: rgba(255,255,255,.65) !important; }
.card-btn--learn:hover { border-color: var(--gold-500) !important; color: var(--white) !important; background: rgba(232,160,32,.08) !important; }
/* Enrol now — gold filled by default */
.card-btn--reserve { background: var(--gold-500) !important; color: #04080F !important; border-color: transparent !important; text-decoration: none !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; }
.card-btn--reserve:hover { background: var(--gold-400) !important; color: #04080F !important; box-shadow: 0 8px 32px rgba(232,160,32,.5) !important; transform: translateY(-3px) scale(1.03) !important; }
.btn-arrow { display: inline-block; font-size: 1.1em; font-weight: 900; line-height: 1; transition: transform .25s var(--ease); }
.card-btn--reserve:hover .btn-arrow { transform: translateX(6px); }

/* ── EYEBROW UPGRADED ────────────────────────────────────────────────── */
.eyebrow { background: rgba(232,160,32,.1) !important; border-color: rgba(232,160,32,.3) !important; color: var(--gold-400) !important; letter-spacing: 1.5px !important; }
.eyebrow-light { color: var(--gold-300) !important; }
.eyebrow-dot { background: var(--gold-500) !important; animation: dot-pulse 2.2s ease-in-out infinite; }
@keyframes dot-pulse {
  0%, 100% { transform: scale(1); opacity: 1; box-shadow: none; }
  50% { transform: scale(1.6); opacity: .6; box-shadow: 0 0 8px rgba(232,160,32,.8); }
}

/* ── HERO TYPOGRAPHY ─────────────────────────────────────────────────── */
.hero h1 { font-weight: 900 !important; letter-spacing: -4px !important; }
.hero h1 em {
  color: var(--gold-500) !important;
  -webkit-text-fill-color: var(--gold-500) !important;
  font-style: normal !important;
  display: inline;
}
.hero-lede { color: rgba(255,255,255,.72) !important; font-size: 17px !important; }
.hero-stat strong { color: var(--gold-400) !important; text-shadow: var(--glow-gold-xs) !important; }
.hero-stat-divider { background: rgba(232,160,32,.2) !important; }
.hero-stats { border-top-color: rgba(232,160,32,.18) !important; }

/* ── HERO ANIMATED BACKGROUND ORBS ──────────────────────────────────── */
.hero::before {
  background: none !important;
  animation: none !important;
}

/* ── HERO CARD FLOAT ─────────────────────────────────────────────────── */
.hero-visual { animation: card-float 7s ease-in-out infinite; }
@keyframes card-float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-14px) rotate(.4deg); }
}
.hero-card-shell { box-shadow: 0 32px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(232,160,32,.18), 0 0 60px rgba(232,160,32,.07) !important; }

/* ── BUTTONS UPGRADED ────────────────────────────────────────────────── */
.btn-gold { background: var(--gold-500) !important; color: #04080F !important; box-shadow: 0 4px 20px rgba(232,160,32,.35) !important; font-weight: 800 !important; transition: transform .25s var(--ease-bounce), box-shadow .25s var(--ease), filter .2s !important; }
.btn-gold:hover { transform: translateY(-3px) scale(1.03) !important; box-shadow: 0 0 24px rgba(232,160,32,.6), 0 0 60px rgba(232,160,32,.25) !important; filter: brightness(1.06) !important; }
.btn-gold:active { transform: translateY(0) scale(.98) !important; box-shadow: var(--glow-gold-xs) !important; }
.btn-ghost-light { border-color: rgba(232,160,32,.45) !important; }
.btn-ghost-light:hover { border-color: var(--gold-500) !important; background: rgba(232,160,32,.1) !important; }

/* ── COUNT-UP STAT NUMBERS ───────────────────────────────────────────── */
.count-up { color: var(--gold-400) !important; font-weight: 900 !important; text-shadow: 0 0 30px rgba(232,160,32,.35) !important; }
.stat-block strong { color: var(--gold-400) !important; font-size: clamp(40px, 5vw, 64px) !important; font-weight: 900 !important; text-shadow: 0 0 40px rgba(232,160,32,.3) !important; }
.stat-block p { color: rgba(255,255,255,.55) !important; }

/* ── DIFF PILLARS BOUNCY ─────────────────────────────────────────────── */
.diff-pillar { transition: transform .3s var(--ease-bounce), box-shadow .3s var(--ease), border-color .3s, background .3s !important; }
.diff-pillar:hover { transform: translateY(-8px) scale(1.02) !important; background: rgba(232,160,32,.07) !important; border-color: rgba(232,160,32,.35) !important; box-shadow: 0 20px 48px rgba(0,0,0,.4), 0 0 0 1px rgba(232,160,32,.2) !important; }
.diff-pillar-icon { background: rgba(232,160,32,.1) !important; border-color: rgba(232,160,32,.22) !important; color: var(--gold-400) !important; transition: transform .3s var(--ease-bounce), background .3s, box-shadow .3s !important; }
.diff-pillar:hover .diff-pillar-icon { transform: scale(1.15) rotate(-5deg) !important; background: rgba(232,160,32,.18) !important; box-shadow: 0 4px 16px rgba(232,160,32,.3) !important; }
.diff-pillar h3 { color: var(--white) !important; }
.diff-pillar p { color: rgba(255,255,255,.6) !important; }
.diff-header h2 { font-weight: 900 !important; letter-spacing: -2.5px !important; }
.diff-header h2 em { color: var(--gold-400) !important; }

/* ── PATH STEPS BOUNCY ───────────────────────────────────────────────── */
.path-step { transition: transform .3s var(--ease-bounce), background .3s, border-color .3s, box-shadow .3s !important; }
.path-step:hover { transform: translateX(10px) scale(1.01) !important; background: rgba(255,255,255,.08) !important; border-color: rgba(232,160,32,.35) !important; box-shadow: 0 8px 40px rgba(0,0,0,.3), 0 0 40px rgba(232,160,32,.08) !important; }

/* ── TESTIMONIAL CARDS DARK ──────────────────────────────────────────── */
.tc-card { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(232,160,32,.12) !important; transition: transform .3s var(--ease-bounce), box-shadow .3s, border-color .3s !important; }
.tc-card:hover { transform: translateY(-6px) !important; border-color: rgba(232,160,32,.3) !important; box-shadow: 0 16px 40px rgba(0,0,0,.35), 0 0 40px rgba(232,160,32,.07) !important; }
.tc-text { color: rgba(255,255,255,.78) !important; }
.tc-name { color: var(--white) !important; }
.tc-role { color: rgba(255,255,255,.45) !important; }
.tc-header-text h2 { color: var(--white) !important; }
.tc-header-text p { color: rgba(255,255,255,.6) !important; }

/* ── INSTRUCTOR SECTION GLASS ────────────────────────────────────────── */
.instructor-wrap { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(232,160,32,.15) !important; border-radius: var(--r-xl) !important; padding: 48px !important; backdrop-filter: blur(8px) !important; }
.instructor-bio h2 { color: var(--white) !important; }
.instructor-story { color: rgba(255,255,255,.7) !important; line-height: 1.9 !important; }
.instructor-title { color: var(--gold-400) !important; }

/* ── CURRICULUM MODULE DARK ──────────────────────────────────────────── */
.curriculum-grid { border-color: rgba(232,160,32,.1) !important; }
.curr-module { background: rgba(255,255,255,.025) !important; border-right-color: rgba(232,160,32,.08) !important; border-bottom-color: rgba(232,160,32,.08) !important; transition: background .25s, transform .2s var(--ease) !important; }
.curr-module:hover { background: rgba(232,160,32,.06) !important; transform: scale(1.01) !important; }
.curr-content h3 { color: var(--white) !important; }
.curr-content p { color: rgba(255,255,255,.55) !important; }
.curr-num { color: var(--gold-500) !important; }

/* ── FINAL CTA CARD DARK ─────────────────────────────────────────────── */
.final-cta { background: #0b1829 !important; box-shadow: 0 0 80px rgba(232,160,32,.06), inset 0 1px 0 rgba(255,255,255,.06) !important; }
.final-cta::before { background: none !important; }

/* ── BLOG QUICK ANSWER DARK ──────────────────────────────────────────── */
.post-quick-answer { background: rgba(232,160,32,.06) !important; border-left-color: var(--gold-500) !important; }
.pqa-label { color: var(--gold-400) !important; }
.post-quick-answer p { color: rgba(255,255,255,.82) !important; }
.post-body { color: rgba(255,255,255,.78); }
.post-body h2, .post-body h3 { color: var(--white); }
.post-body a { color: var(--gold-400); }
.post-body a:hover { color: var(--gold-300); }
.blog-author-byline { color: rgba(255,255,255,.55) !important; }

/* ── SCROLL REVEAL UPGRADED ──────────────────────────────────────────── */
.reveal { opacity: 0 !important; transform: translateY(36px) !important; transition: opacity .75s var(--ease-decel), transform .75s var(--ease-decel) !important; }
.reveal.is-visible { opacity: 1 !important; transform: none !important; }
.reveal:nth-child(1) { transition-delay: 0s !important; }
.reveal:nth-child(2) { transition-delay: .12s !important; }
.reveal:nth-child(3) { transition-delay: .24s !important; }
.reveal:nth-child(4) { transition-delay: .36s !important; }
.reveal:nth-child(5) { transition-delay: .48s !important; }
.reveal:nth-child(6) { transition-delay: .60s !important; }

/* ── DIALOG DARK ─────────────────────────────────────────────────────── */
.info-dialog { background: var(--navy-700) !important; color: var(--white) !important; border: 1px solid rgba(232,160,32,.15) !important; }
.dialog-header h2 { color: var(--white) !important; }
.dialog-header > p, .dialog-audience { color: rgba(255,255,255,.65) !important; }
.dialog-audience strong { color: var(--white) !important; }
.dialog-body { border-top-color: rgba(255,255,255,.1) !important; }
.dialog-right h3 { color: var(--gold-400) !important; }
.dialog-right li { color: rgba(255,255,255,.7) !important; }
.dialog-note { background: rgba(232,160,32,.08) !important; color: rgba(255,255,255,.7) !important; }
.dialog-close { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.7) !important; }
.dialog-close:hover { background: rgba(255,255,255,.15) !important; }

/* ── MULTI-STEP FORM DARK ────────────────────────────────────────────── */
.form-dialog { background: var(--navy-800) !important; border: 1px solid rgba(232,160,32,.15) !important; }
.form-dialog label { color: rgba(255,255,255,.85) !important; }
.form-dialog input, .form-dialog select, .form-dialog textarea { background: rgba(255,255,255,.06) !important; border-color: rgba(255,255,255,.15) !important; color: var(--white) !important; }
.form-dialog input::placeholder { color: rgba(255,255,255,.35) !important; }
.form-dialog input:focus, .form-dialog select:focus, .form-dialog textarea:focus { border-color: var(--gold-500) !important; box-shadow: 0 0 0 3px rgba(232,160,32,.15) !important; }
.mf-role-btn, .mf-goal-btn { background: rgba(255,255,255,.05) !important; border-color: rgba(255,255,255,.12) !important; color: rgba(255,255,255,.8) !important; transition: transform .22s var(--ease-bounce), background .2s, border-color .2s !important; }
.mf-role-btn:hover, .mf-goal-btn:hover { background: rgba(232,160,32,.1) !important; border-color: rgba(232,160,32,.4) !important; color: var(--white) !important; transform: translateY(-2px) !important; }
.mf-role-btn.is-selected, .mf-goal-btn.is-selected { background: rgba(232,160,32,.15) !important; border-color: var(--gold-500) !important; color: var(--gold-400) !important; }
.mf-input, .mf-select, .mf-textarea { background: rgba(255,255,255,.06) !important; border-color: rgba(255,255,255,.15) !important; color: var(--white) !important; }
.mf-input:focus, .mf-select:focus, .mf-textarea:focus { border-color: var(--gold-500) !important; box-shadow: 0 0 0 3px rgba(232,160,32,.15) !important; }
.mf-input::placeholder { color: rgba(255,255,255,.3) !important; }

/* ── HEADER GOLD UPGRADE ─────────────────────────────────────────────── */
.site-header { border-bottom-color: rgba(232,160,32,.18) !important; }
.site-header.is-scrolled { background: rgba(7,13,27,.95) !important; border-bottom-color: rgba(232,160,32,.28) !important; box-shadow: 0 4px 40px rgba(0,0,0,.4) !important; }
.primary-nav > a::after { background: var(--gold-400) !important; }
.primary-nav > a:hover { color: var(--gold-300) !important; }

/* ── FOOTER REDESIGN ────────────────────────────────────────────────────── */
.site-footer { border-top: none !important; background: #04080F !important; }

/* ── Refer a Friend Card ── */
.footer-refer-wrap { padding: 56px 0 0; }
.footer-refer-card {
  position: relative;
  display: flex; align-items: center; gap: 28px; flex-wrap: wrap;
  background: linear-gradient(135deg, rgba(232,160,32,.11) 0%, rgba(232,160,32,.04) 55%, rgba(232,160,32,.09) 100%);
  border: 1px solid rgba(232,160,32,.28);
  border-radius: 20px;
  padding: clamp(28px,4vw,44px) clamp(24px,4vw,48px);
  overflow: hidden;
}
.footer-refer-card::after {
  content: '';
  position: absolute; top: 0; left: -100%; width: 45%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.035), transparent);
  animation: refer-shimmer 4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes refer-shimmer {
  0% { left: -100%; }
  60%, 100% { left: 160%; }
}
.footer-refer-glow {
  position: absolute; top: -50px; right: 8%;
  width: 240px; height: 240px;
  background: radial-gradient(ellipse, rgba(232,160,32,.14), transparent 68%);
  animation: refer-glow 5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes refer-glow {
  0%, 100% { opacity: .5; transform: scale(1); }
  50%       { opacity: 1; transform: scale(1.18); }
}
.footer-refer-icon {
  flex-shrink: 0;
  width: 64px; height: 64px;
  background: rgba(232,160,32,.12); border: 1px solid rgba(232,160,32,.28); border-radius: 50%;
  display: grid; place-items: center;
  color: var(--gold-400);
}
.footer-refer-copy { flex: 1; min-width: 200px; }
.footer-refer-eyebrow {
  display: block; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--gold-400); margin-bottom: 6px;
}
.footer-refer-headline {
  font-size: clamp(17px,2.4vw,24px); font-weight: 800; color: rgba(255,255,255,.96);
  letter-spacing: -.4px; margin: 0 0 8px; line-height: 1.25;
}
.footer-refer-headline em { color: var(--gold-400); font-style: normal; }
.footer-refer-body { font-size: 13.5px; color: rgba(255,255,255,.52); line-height: 1.72; margin: 0; }
.footer-refer-btn {
  flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--gold-500); color: #04080F;
  padding: 13px 24px; border-radius: 100px;
  font-weight: 700; font-size: 14px; border: none; cursor: pointer;
  transition: background .2s, transform .2s, box-shadow .2s;
  white-space: nowrap;
}
.footer-refer-btn:hover { background: var(--gold-400); transform: translateY(-2px); box-shadow: 0 10px 32px rgba(232,160,32,.38); }
.footer-refer-btn .btn-arrow { transition: transform .25s; }
.footer-refer-btn:hover .btn-arrow { transform: translateX(5px); }

/* ── Footer main grid ── */
.footer-main {
  padding-top: 52px !important;
  grid-template-columns: 1.5fr .7fr .7fr 1fr !important;
}
.footer-brand > p { color: rgba(255,255,255,.4) !important; }
.footer-column b { color: rgba(255,255,255,.85) !important; font-size: 11px !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
.footer-column a { color: rgba(255,255,255,.45) !important; }
.footer-column a:hover { color: var(--gold-400) !important; }
.footer-signoff span { color: rgba(232,160,32,.35) !important; }

/* ── Social icons bar ── */
/* Footer social bar deleted — icons now live inside .footer-brand */
.footer-social-bar { display: none !important; }
.footer-brand .brand { border: none !important; outline: none !important; box-shadow: none !important; background: transparent !important; }
.footer-brand img { border: none !important; outline: none !important; box-shadow: none !important; display: block !important; }
.footer-brand .footer-social { display: flex !important; gap: 10px !important; margin-top: 20px !important; }
.footer-social-link {
  display: flex !important; align-items: center !important; justify-content: center !important;
  width: 40px !important; height: 40px !important; border-radius: 50% !important;
  background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.1) !important;
  color: rgba(255,255,255,.45) !important;
  transition: background .22s, border-color .22s, color .22s, transform .22s !important;
  flex-shrink: 0 !important;
}
.footer-social-link svg { width: 18px !important; height: 18px !important; fill: currentColor !important; stroke: none !important; }
.footer-social-link:hover {
  background: rgba(232,160,32,.18) !important;
  border-color: rgba(232,160,32,.55) !important;
  color: var(--gold-400) !important;
  transform: translateY(-3px) scale(1.08) !important;
}

/* ── Footer bottom ── */
.footer-bottom { border-top: 1px solid rgba(255,255,255,.05) !important; }

/* ── COURSE HERO V2: FULL REDESIGN ───────────────────────────────────────── */
.ch-hero-v2 {
  min-height: calc(100vh - 108px) !important;
  padding-block: clamp(72px, 8vw, 120px) !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  position: relative !important;
}
.ch-hero-v2 .ch-inner {
  grid-template-columns: 1fr .9fr !important;
  gap: 64px !important;
  align-items: center !important;
}

/* Animated background orbs */
.ch-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(72px);
  z-index: 0;
}
.ch-orb--1 {
  width: 500px; height: 500px;
  top: -150px; right: -80px;
  background: radial-gradient(ellipse, rgba(232,160,32,.1), transparent 68%);
  animation: orb1 15s ease-in-out infinite;
}
.ch-orb--2 {
  width: 350px; height: 350px;
  bottom: -80px; left: -60px;
  background: radial-gradient(ellipse, rgba(15,40,100,.5), transparent 70%);
  animation: orb2 20s ease-in-out infinite;
}

/* Staggered entrance */
@keyframes ch-in-up    { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
@keyframes ch-in-right { from { opacity:0; transform:translateX(40px); } to { opacity:1; transform:translateX(0); } }
.ch-anim { opacity: 0; }
.ch-anim--1 { animation: ch-in-up .65s cubic-bezier(.2,.6,.3,1) .1s  forwards; }
.ch-anim--2 { animation: ch-in-up .75s cubic-bezier(.2,.6,.3,1) .22s forwards; }
.ch-anim--3 { animation: ch-in-up .65s cubic-bezier(.2,.6,.3,1) .36s forwards; }
.ch-anim--4 { animation: ch-in-up .65s cubic-bezier(.2,.6,.3,1) .50s forwards; }
.ch-anim--5 { animation: ch-in-up .65s cubic-bezier(.2,.6,.3,1) .62s forwards; }
.ch-anim--6 { animation: ch-in-right .85s cubic-bezier(.2,.6,.3,1) .45s forwards; }

/* Bigger headline */
.ch-hero-v2 h1 { font-size: clamp(48px, 6vw, 80px) !important; letter-spacing: -2.5px !important; }

/* Booklet visual */
.ch-visual { position: relative; }

.ch-booklet-wrap {
  position: relative;
  max-width: 400px;
  margin: 0 auto;
  perspective: 1000px;
  cursor: pointer;
}

/* Gold glow orb behind booklet */
.ch-booklet-glow {
  position: absolute;
  inset: -30px;
  background: radial-gradient(ellipse at center, rgba(232,160,32,.2) 0%, transparent 65%);
  border-radius: 50%;
  pointer-events: none;
  animation: orb3 6s ease-in-out infinite;
  z-index: 0;
}

/* Shine sweep on hover */
.ch-booklet-shine {
  position: absolute;
  inset: 0;
  border-radius: 16px;
  overflow: hidden;
  pointer-events: none;
  z-index: 2;
}
.ch-booklet-shine::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.12) 50%, transparent 70%);
  transition: left .5s ease;
  pointer-events: none;
}
.ch-booklet-wrap:hover .ch-booklet-shine::after { left: 140%; }

/* The booklet image — 3D tilt at rest, straightens on hover */
.ch-booklet-img {
  width: 100%;
  display: block;
  border-radius: 14px;
  position: relative;
  z-index: 1;
  transform: perspective(900px) rotateY(-10deg) rotateX(3deg) scale(1);
  transform-origin: center center;
  box-shadow:
    -12px 8px 0 rgba(0,0,0,.25),
    -24px 16px 0 rgba(0,0,0,.12),
    0 40px 80px rgba(0,0,0,.65),
    0 0 0 1px rgba(232,160,32,.18),
    0 0 50px rgba(232,160,32,.08);
  transition:
    transform .55s cubic-bezier(.2,.6,.3,1),
    box-shadow .55s cubic-bezier(.2,.6,.3,1);
  animation: booklet-float 8s ease-in-out 1.5s infinite;
}
@keyframes booklet-float {
  0%,100% { transform: perspective(900px) rotateY(-10deg) rotateX(3deg) translateY(0); }
  50%      { transform: perspective(900px) rotateY(-8deg)  rotateX(2deg) translateY(-10px); }
}
.ch-booklet-wrap:hover .ch-booklet-img {
  transform: perspective(900px) rotateY(-2deg) rotateX(0deg) scale(1.03) translateY(-6px) !important;
  animation-play-state: paused !important;
  box-shadow:
    -4px 3px 0 rgba(0,0,0,.15),
    0 60px 100px rgba(0,0,0,.7),
    0 0 0 1px rgba(232,160,32,.35),
    0 0 80px rgba(232,160,32,.18) !important;
}

/* Floating: next class badge (top-left) */
.ch-float-next {
  position: absolute;
  top: -12px; left: -28px;
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(10,18,38,.92);
  border: 1px solid rgba(232,160,32,.3);
  border-radius: 100px;
  padding: 8px 16px;
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,.78);
  backdrop-filter: blur(14px);
  box-shadow: 0 6px 24px rgba(0,0,0,.45);
  white-space: nowrap;
  z-index: 6;
  animation: badge-float 6s ease-in-out 2.5s infinite, ch-in-up .7s cubic-bezier(.2,.6,.3,1) .9s both;
  transition: transform .3s, box-shadow .3s;
}
.ch-float-next:hover { transform: translateY(-3px) !important; box-shadow: 0 10px 32px rgba(0,0,0,.5) !important; }
.ch-float-next strong { color: var(--gold-400); font-weight: 700; }
.ch-float-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--gold-500); flex-shrink: 0;
  animation: next-pulse 2s ease infinite;
}

/* Floating: cert badge (bottom-right) */
.ch-float-cert {
  position: absolute;
  bottom: 24px; right: -28px;
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(10,18,38,.92);
  border: 1px solid rgba(232,160,32,.3);
  border-radius: 100px;
  padding: 8px 16px;
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,.88);
  backdrop-filter: blur(14px);
  box-shadow: 0 6px 24px rgba(0,0,0,.45);
  white-space: nowrap;
  z-index: 6;
  animation: badge-float 5s ease-in-out 3s infinite, ch-in-up .7s cubic-bezier(.2,.6,.3,1) 1s both;
  transition: transform .3s, box-shadow .3s;
}
.ch-float-cert:hover { transform: translateY(-3px) !important; box-shadow: 0 10px 32px rgba(0,0,0,.5) !important; }
.ch-float-cert svg { color: var(--gold-400); flex-shrink: 0; }

/* Responsive */
@media (max-width: 900px) {
  .ch-hero-v2 .ch-inner { grid-template-columns: 1fr !important; gap: 48px !important; }
  .ch-visual { display: flex; justify-content: center; }
  .ch-booklet-wrap { max-width: 320px; }
  .ch-float-cert { right: -8px !important; }
  .ch-float-next { left: -8px !important; }
}
@media (max-width: 480px) {
  .ch-booklet-wrap { max-width: 260px; }
  .ch-float-cert, .ch-float-next { display: none !important; }
}

/* ── FOOTER: BIGGER LOGO + INTERACTIVE LINKS ─────────────────────────────── */
.brand-logo-foot { height: 190px !important; width: auto !important; filter: brightness(0) invert(1) !important; }
.footer-brand .brand { display: block !important; line-height: 0 !important; font-size: 0 !important; border: none !important; outline: none !important; box-shadow: none !important; background: none !important; padding: 0 !important; }
.footer-brand > p { margin-top: 20px !important; font-size: 14px !important; line-height: 1.9 !important; }

/* Link hover: slide-in gold underline */
.footer-column a {
  position: relative !important;
  display: inline-block !important;
  padding-bottom: 1px !important;
  transition: color .22s, transform .22s !important;
}
.footer-column a::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0; left: 0 !important;
  width: 0; height: 1px !important;
  background: var(--gold-500) !important;
  transition: width .25s var(--ease) !important;
}
.footer-column a:hover { color: var(--gold-400) !important; transform: translateX(3px) !important; }
.footer-column a:hover::after { width: 100% !important; }
.footer-column b { color: rgba(255,255,255,.85) !important; font-size: 11px !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
/* ── FOOTER: TOP GLOW + CTA COLUMN ───────────────────────────────────────── */
.site-footer { border-top: 1px solid rgba(232,160,32,.12) !important; }
.site-footer::before {
  content: '' !important;
  display: block !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(232,160,32,.7) 40%, rgba(232,160,32,.9) 50%, rgba(232,160,32,.7) 60%, transparent) !important;
  margin-bottom: -1px !important;
}

/* Brand column */
.footer-tagline { font-size: 20px !important; font-weight: 700 !important; color: rgba(255,255,255,.88) !important; line-height: 1.3 !important; margin: 18px 0 6px !important; }
.footer-sub { font-size: 13px !important; color: rgba(255,255,255,.35) !important; line-height: 1.7 !important; margin: 0 !important; }

/* Next class CTA column */
.footer-cta-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 24px !important;
  background: rgba(232,160,32,.04) !important;
  border: 1px solid rgba(232,160,32,.18) !important;
  border-radius: 16px !important;
  align-self: start !important;
}
.footer-next-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.7) !important;
  font-weight: 500 !important;
}
.fnb-dot {
  width: 8px !important; height: 8px !important;
  border-radius: 50% !important;
  background: var(--gold-500) !important;
  box-shadow: 0 0 8px rgba(232,160,32,.65) !important;
  flex-shrink: 0 !important;
  animation: pulse-dot 2s ease-in-out infinite !important;
}
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 6px rgba(232,160,32,.5); }
  50%       { box-shadow: 0 0 14px rgba(232,160,32,.9); }
}
.footer-next-badge strong { color: var(--gold-400) !important; }
.footer-cta-copy { font-size: 13px !important; color: rgba(255,255,255,.5) !important; margin: 0 !important; line-height: 1.55 !important; }
.footer-enrol-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: var(--gold-500) !important;
  color: #04080F !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  padding: 11px 20px !important;
  border-radius: 100px !important;
  border: none !important;
  cursor: pointer !important;
  transition: background .2s, transform .2s, box-shadow .2s !important;
  width: fit-content !important;
  letter-spacing: .01em !important;
}
.footer-enrol-btn:hover { background: var(--gold-400) !important; transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(232,160,32,.38) !important; }
.footer-cta-note { font-size: 11px !important; color: rgba(255,255,255,.28) !important; margin: 0 !important; line-height: 1.6 !important; }

/* ── HERO: FULL VIEWPORT REDESIGN ────────────────────────────────────────── */
.hero {
  min-height: calc(100vh - 108px) !important;
  padding: clamp(80px, 7vw, 120px) 0 !important;
  display: flex !important;
  align-items: center !important;
  background: #04080F !important;
  overflow: hidden !important;
}
.hero-inner {
  padding: 0 !important;
}

/* Animated background orbs */
.hero-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(80px);
  z-index: 0;
}
.hero-orb--1 {
  width: 600px; height: 600px;
  top: -200px; right: -60px;
  background: radial-gradient(ellipse, rgba(232,160,32,.12), transparent 68%);
  animation: orb1 14s ease-in-out infinite;
}
.hero-orb--2 {
  width: 400px; height: 400px;
  bottom: -100px; left: -80px;
  background: radial-gradient(ellipse, rgba(15,40,100,.6), transparent 70%);
  animation: orb2 18s ease-in-out infinite;
}
.hero-orb--3 {
  width: 300px; height: 300px;
  top: 30%; right: 35%;
  background: radial-gradient(ellipse, rgba(232,160,32,.05), transparent 70%);
  animation: orb3 10s ease-in-out infinite;
}
@keyframes orb1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  40%       { transform: translate(-80px, 60px) scale(1.15); }
  70%       { transform: translate(40px, -40px) scale(.9); }
}
@keyframes orb2 {
  0%, 100% { transform: translate(0, 0); }
  50%       { transform: translate(60px, -80px) scale(1.1); }
}
@keyframes orb3 {
  0%, 100% { transform: scale(1); opacity: .6; }
  50%       { transform: scale(1.4); opacity: 1; }
}

/* Staggered text entrance */
@keyframes hero-in-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes hero-in-right {
  from { opacity: 0; transform: translateX(48px); }
  to   { opacity: 1; transform: translateX(0); }
}
.hero-anim { opacity: 0; }
.hero-anim--1 { animation: hero-in-up .7s cubic-bezier(.2,.6,.3,1) .1s forwards; }
.hero-anim--2 { animation: hero-in-up .8s cubic-bezier(.2,.6,.3,1) .22s forwards; }
.hero-anim--3 { animation: hero-in-up .7s cubic-bezier(.2,.6,.3,1) .38s forwards; }
.hero-anim--4 { animation: hero-in-up .7s cubic-bezier(.2,.6,.3,1) .52s forwards; }
.hero-anim--5 { animation: hero-in-up .7s cubic-bezier(.2,.6,.3,1) .64s forwards; }
.hero-anim--6 { animation: hero-in-right .9s cubic-bezier(.2,.6,.3,1) .45s forwards; }

/* Override float on hero-visual to work with entrance animation */
.hero-visual {
  animation: hero-in-right .9s cubic-bezier(.2,.6,.3,1) .45s forwards,
             card-float 7s ease-in-out 1.4s infinite !important;
}

/* Bigger hero heading */
.hero h1 { font-size: clamp(52px, 6.5vw, 88px) !important; line-height: 1.04 !important; letter-spacing: -2.5px !important; }
.hero-lede { font-size: clamp(15px, 1.6vw, 18px) !important; line-height: 1.75 !important; max-width: 520px !important; }

/* Proof row below actions */
.hero-proof-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 16px; }
.hero-next-class {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 13px; font-weight: 600; color: rgba(255,255,255,.55);
}
.next-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gold-500);
  animation: next-pulse 2s ease infinite;
  flex-shrink: 0;
}
@keyframes next-pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(232,160,32,.5); }
  50%      { box-shadow: 0 0 0 6px rgba(232,160,32,0); }
}

/* ── Floating instructor card ── */
.hero-instructor-card {
  position: absolute;
  bottom: 24px; left: -32px;
  display: flex; align-items: center; gap: 10px;
  background: rgba(10,20,40,.88);
  border: 1px solid rgba(232,160,32,.28);
  border-radius: 14px;
  padding: 10px 14px 10px 10px;
  backdrop-filter: blur(12px);
  z-index: 10;
  animation: card-float 6s ease-in-out 2s infinite, hero-in-up .7s cubic-bezier(.2,.6,.3,1) .8s both;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
}
.hero-instructor-photo {
  width: 44px; height: 44px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top center;
  border: 2px solid rgba(232,160,32,.4);
  flex-shrink: 0;
}
.hero-instructor-info { display: flex; flex-direction: column; gap: 2px; }
.hero-instructor-info strong { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.95); }
.hero-instructor-info span  { font-size: 11px; color: var(--gold-400); font-weight: 600; }

/* ── Floating achievement badge ── */
.hero-float-badge {
  position: absolute;
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(10,20,40,.88);
  border: 1px solid rgba(232,160,32,.28);
  border-radius: 100px;
  padding: 7px 14px;
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,.88);
  backdrop-filter: blur(12px);
  white-space: nowrap;
  box-shadow: 0 6px 24px rgba(0,0,0,.4);
  z-index: 10;
}
.hero-float-badge svg { color: var(--gold-400); flex-shrink: 0; }
.hero-float-badge--tl {
  top: 12px; right: -12px;
  animation: badge-float 5s ease-in-out infinite, hero-in-up .7s cubic-bezier(.2,.6,.3,1) .9s both;
}

/* ── NAV: 3-COLUMN GRID LAYOUT (logo | links | button) ───────────────────── */
.nav-wrap {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  gap: 0 !important;
}
.site-header .primary-nav {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(16px, 2.2vw, 34px) !important;
}
/* When nav-actions accidentally still inside primary-nav, push it right */
.primary-nav > .nav-actions { margin-left: auto !important; }
.site-header .nav-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* ── FOOTER: BOOSTD ATTRIBUTION ──────────────────────────────────────────── */
.footer-boostd { color: var(--gold-400) !important; font-weight: 600 !important; text-decoration: none !important; transition: color .2s !important; }
.footer-boostd:hover { color: var(--gold-300) !important; }

/* ── NAV: TWO-TONE BACKGROUND ─────────────────────────────────────────────── */
.site-header {
  background: var(--navy-900) !important;
  position: relative !important;
  overflow: visible !important;
}
.site-header::after {
  content: '' !important;
  position: absolute !important;
  top: 0; bottom: 0 !important;
  left: 0 !important;
  width: clamp(180px, 18vw, 280px) !important;
  background: rgba(232,160,32,.04) !important;
  border-right: 1px solid rgba(232,160,32,.1) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
.nav-wrap { position: relative; z-index: 1; }
.site-header.is-scrolled {
  background: rgba(6,14,26,.97) !important;
}
.site-header.is-scrolled::after {
  background: rgba(232,160,32,.025) !important;
}

/* ── NAV LOGO ──────────────────────────────────────────────────────────────── */
.brand-logo { height: 150px !important; width: auto !important; }
.site-header { height: 170px !important; }

/* ── MOBILE: keep nav-actions visible next to hamburger ──────────────────── */
@media (max-width: 768px) {
  .site-header { overflow: visible !important; height: 88px !important; }
  .site-header::after { display: none !important; }
  .brand-logo { height: 88px !important; }
  .nav-wrap {
    grid-template-columns: auto 1fr auto auto !important;
    gap: 0 12px !important;
  }
  .site-header .nav-actions .button { padding: 8px 14px !important; font-size: 12px !important; }
  .primary-nav.is-open + .nav-actions { display: none !important; }
}

/* ── HERO SCENE IMAGE ──────────────────────────────────────────────────── */
.hero-scene-wrap {
  position: relative;
  width: 100%;
  border-radius: 20px;
  overflow: hidden;
  box-shadow:
    0 40px 100px rgba(0,0,0,.6),
    0 0 0 1px rgba(232,160,32,.2),
    0 0 80px rgba(232,160,32,.1);
  transform: perspective(900px) rotateY(-8deg) rotateX(2deg);
  transition: transform .55s cubic-bezier(.2,.6,.3,1), box-shadow .55s;
  animation: scene-float 8s ease-in-out 1.8s infinite;
}
.hero-scene-wrap:hover {
  transform: perspective(900px) rotateY(-1deg) rotateX(0deg) scale(1.025) translateY(-6px) !important;
  box-shadow:
    0 50px 120px rgba(0,0,0,.65),
    0 0 0 1px rgba(232,160,32,.4),
    0 0 100px rgba(232,160,32,.18) !important;
  animation-play-state: paused !important;
}
.hero-scene-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px;
}
/* Shine sweep on hover */
.hero-scene-shine {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  border-radius: 20px;
  overflow: hidden;
}
.hero-scene-shine::after {
  content: '';
  position: absolute;
  top: 0; left: -100%; width: 55%; height: 100%;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.09), transparent 70%);
  transition: left .6s cubic-bezier(.4,0,.2,1);
}
.hero-scene-wrap:hover .hero-scene-shine::after { left: 140%; }
/* Subtle gold bottom-edge glow */
.hero-scene-wrap::after {
  content: '';
  position: absolute;
  bottom: 0; left: 10%; right: 10%; height: 3px;
  background: linear-gradient(90deg, transparent, rgba(232,160,32,.55), transparent);
  border-radius: 0 0 20px 20px;
  opacity: 0;
  transition: opacity .4s;
}
.hero-scene-wrap:hover::after { opacity: 1 !important; }

@keyframes scene-float {
  0%, 100% { transform: perspective(900px) rotateY(-8deg) rotateX(2deg) translateY(0); }
  45%       { transform: perspective(900px) rotateY(-6deg) rotateX(1deg) translateY(-10px); }
  70%       { transform: perspective(900px) rotateY(-9deg) rotateX(3deg) translateY(-4px); }
}

/* Make card shell bigger — still needed if hero card ever reverts */
.hero-card-shell {
  max-width: 520px !important;
  width: 100% !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(232,160,32,.18), 0 0 60px rgba(232,160,32,.07) !important;
}

/* ── COURSE LANDING PAGE: WHO + SALARY DARK ─────────────────────────── */
.who-card { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.1) !important; transition: transform .3s var(--ease-bounce), border-color .3s, box-shadow .3s !important; }
.who-card:hover { transform: translateY(-6px) !important; border-color: rgba(232,160,32,.35) !important; box-shadow: 0 16px 40px rgba(0,0,0,.3), 0 0 40px rgba(232,160,32,.08) !important; }
.who-card h4, .who-card h3 { color: var(--white) !important; }
.who-card p { color: rgba(255,255,255,.6) !important; }
.salary-track { background: rgba(255,255,255,.06) !important; }
.outcomes-copy h2, .enrol-copy h2 { color: var(--white) !important; }
.outcomes-copy p, .enrol-copy p { color: rgba(255,255,255,.65) !important; }

/* ── ABOUT PAGE DARK ─────────────────────────────────────────────────── */
.about-section, .about-cred-section, .about-learn-section, .about-hero { background: var(--ivory-100) !important; }
.about-cred-card { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.12) !important; transition: transform .3s var(--ease-bounce), border-color .3s !important; }
.about-cred-card:hover { border-color: rgba(232,160,32,.35) !important; transform: translateY(-6px) !important; }
.about-cred-card h3, .about-cred-card strong { color: var(--white) !important; }
.about-cred-card p { color: rgba(255,255,255,.6) !important; }

/* ── EMPLOYER PAGE DARK ──────────────────────────────────────────────── */
.emp-hero-section, .emp-stats-section, .emp-why-section,
.emp-hiw-section, .emp-outcomes-section, .emp-programs-section,
.emp-testimonials, .emp-faq-section, .emp-contact-section { background: var(--ivory-100) !important; }
.emp-stat-block strong { color: var(--gold-400) !important; text-shadow: var(--glow-gold-xs) !important; }
.emp-program-card { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.12) !important; transition: transform .3s var(--ease-bounce), border-color .3s, box-shadow .3s !important; }
.emp-program-card:hover { border-color: rgba(232,160,32,.35) !important; transform: translateY(-6px) !important; box-shadow: 0 20px 48px rgba(0,0,0,.35), 0 0 40px rgba(232,160,32,.07) !important; }
.emp-program-card h3 { color: var(--white) !important; }
.emp-program-card p { color: rgba(255,255,255,.6) !important; }

/* ── SHIMMER UTILITY ─────────────────────────────────────────────────── */
.shimmer-text { color: var(--gold-400) !important; -webkit-text-fill-color: var(--gold-400) !important; }

/* ── COACH STICKER GLOW ──────────────────────────────────────────────── */
@keyframes badge-glow { 0%, 100% { box-shadow: 0 4px 12px rgba(232,160,32,.25); } 50% { box-shadow: 0 4px 24px rgba(232,160,32,.55), 0 0 40px rgba(232,160,32,.15); } }
.coach-sticker { animation: badge-glow 3s ease-in-out infinite; background: var(--navy-800) !important; border-color: var(--gold-500) !important; }

/* ── SCROLL PROGRESS BAR GOLD ────────────────────────────────────────── */
#scroll-progress { background: var(--gold-500) !important; box-shadow: 0 0 10px rgba(232,160,32,.5) !important; }

/* ── MOBILE NAV DARK ─────────────────────────────────────────────────── */
.mobile-nav { background: var(--ivory-100) !important; border-top: 1px solid rgba(232,160,32,.15) !important; }
.mobile-nav a { color: rgba(255,255,255,.8) !important; }
.mobile-nav a:hover { color: var(--gold-400) !important; }

/* ── INSTRUCTOR PHOTO RESPONSIVE ─────────────────────────────────────── */
@media (max-width: 860px) {
  .instructor-wrap[style*="grid-template-columns:320px"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }
}

/* ── BTN-OUTLINE DARK ────────────────────────────────────────────────── */
.btn-outline { border-color: rgba(255,255,255,.35) !important; color: rgba(255,255,255,.8) !important; }
.btn-outline:hover { border-color: var(--gold-500) !important; color: var(--gold-400) !important; background: rgba(232,160,32,.08) !important; }
.btn-outline::after { content: "→" !important; color: inherit !important; }

/* ── INLINE STYLE DARK OVERRIDES ─────────────────────────────────────── */
/* Override inline color vars that read dark on old light theme */
[style*="color:var(--slate-600)"],
[style*="color: var(--slate-600)"],
[style*="color:var(--slate-700)"],
[style*="color: var(--slate-700)"] { color: rgba(255,255,255,.65) !important; }

[style*="color:var(--navy-800)"],
[style*="color: var(--navy-800)"],
[style*="color:var(--navy-900)"],
[style*="color: var(--navy-900)"] { color: rgba(255,255,255,.88) !important; }

[style*="color:var(--navy-700)"],
[style*="color: var(--navy-700)"] { color: rgba(255,255,255,.75) !important; }

[style*="color:var(--ink)"],
[style*="color: var(--ink)"] { color: rgba(255,255,255,.82) !important; }

/* Background white inline overrides */
[style*="background:var(--white)"],
[style*="background: var(--white)"],
[style*="background-color:var(--white)"],
[style*="background-color: var(--white)"] { background: rgba(255,255,255,.05) !important; }

/* Border light inline overrides */
[style*="border:1px solid var(--slate-200)"],
[style*="border: 1px solid var(--slate-200)"],
[style*="border-color:var(--slate-200)"],
[style*="border-color: var(--slate-200)"] { border-color: rgba(232,160,32,.15) !important; }

/* Exceptions: keep white text white where it's on nav buttons */
.button[style*="color:var(--white)"],
.btn-gold[style*="color:var(--white)"] { color: inherit !important; }

/* ── CLASS-BASED WHITE BACKGROUND OVERRIDES ──────────────────────────── */
/* All cards/panels that used background:var(--white) in the light theme  */
.resource-card,
.reserve-card,
.about-cred-card,
.curric-module,
.who-card,
.blog-card,
.related-card,
.tc-card,
.faq-item,
.mf-inner,
.mf-choice,
.outcome-item,
.emp-program-card,
.diff-pillar,
.path-step,
.coaching-module,
.curr-module,
.about-timeline-item,
.about-value-card {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(232,160,32,.12) !important;
}

/* Section backgrounds not yet overridden */
.resource-section { background: var(--ivory-100) !important; }
.outcomes-section { background: var(--ivory-200) !important; }
.audience-section { background: var(--ivory-100) !important; }
.section-curriculum { background: var(--ivory-200) !important; }

/* Approach list hover — keep as dark glass */
.approach-list article:hover {
  background: rgba(255,255,255,.05) !important;
  box-shadow: 0 0 0 1.5px rgba(232,160,32,.3), 0 6px 24px rgba(0,0,0,.3) !important;
}

/* Role-finder modal */
.mf-role-card { background: rgba(255,255,255,.06) !important; border-color: rgba(232,160,32,.12) !important; }
.mf-role-card.is-selected { background: rgba(232,160,32,.1) !important; border-color: rgba(232,160,32,.5) !important; }
.mf-role-card:hover { background: rgba(255,255,255,.09) !important; }
.mf-goal-btn:hover { background: rgba(255,255,255,.07) !important; }

/* Reserve/enrol card specific */
.reserve-card { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(232,160,32,.15) !important; }

/* Re-add dark text for items that appear on gold/light backgrounds */
.card-btn--reserve:hover { color: #04080F !important; }
/* Still have a question — Enrol now CTA */
.courses-foot-cta {
  display: inline-flex !important; align-items: center !important; gap: 10px !important;
  background: var(--gold-500) !important; color: #04080F !important;
  border: none !important; border-radius: 100px !important;
  padding: 14px 28px !important; font-size: 15px !important; font-weight: 700 !important;
  cursor: pointer !important; text-decoration: none !important;
  transition: background .2s, box-shadow .2s, transform .2s !important;
}
.courses-foot-cta:hover {
  background: var(--gold-400) !important; color: #04080F !important;
  box-shadow: 0 8px 32px rgba(232,160,32,.45) !important;
  transform: translateY(-2px) !important;
}
.courses-foot-cta .cta-arrow { font-size: 1.1em; font-weight: 900; transition: transform .2s; }
.courses-foot-cta:hover .cta-arrow { transform: translateX(4px); }
/* Instructor portrait — allow badge to hang below the image card */
.instructor-portrait { overflow: visible !important; }
/* Instructor bio link arrow */
.instructor-bio-link { transition: color .2s, gap .2s !important; }
.instructor-bio-link:hover { gap: 14px !important; }
.bio-arrow { display: inline-block; font-size: 1.1em; font-weight: 700; transition: transform .25s var(--ease); }
.instructor-bio-link:hover .bio-arrow { transform: translateX(6px); }
.btn-white { background: rgba(255,255,255,.1) !important; color: rgba(255,255,255,.9) !important; border-color: rgba(255,255,255,.25) !important; }
.btn-white:hover { background: rgba(255,255,255,.18) !important; }

/* Form inputs */
input, textarea { background: rgba(255,255,255,.06) !important; color: rgba(255,255,255,.88) !important; border-color: rgba(255,255,255,.15) !important; }
select {
  background-color: rgba(255,255,255,.06) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23E8A020' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 14px 8px !important;
  padding-right: 40px !important;
  color: rgba(255,255,255,.88) !important;
  border-color: rgba(255,255,255,.15) !important;
  cursor: pointer !important;
}
select option { background-color: #0C1730; color: rgba(255,255,255,.88); }
input:focus, textarea:focus, select:focus { border-color: rgba(232,160,32,.5) !important; box-shadow: 0 0 0 3px rgba(232,160,32,.12) !important; }
input::placeholder, textarea::placeholder { color: rgba(255,255,255,.35) !important; }

/* Blog card text */
.blog-card, .related-card { color: rgba(255,255,255,.82) !important; }
.blog-card h2, .blog-card h3, .blog-card h4,
.related-card h2, .related-card h3 { color: rgba(255,255,255,.95) !important; }

/* Coaching page reserve card */
.coaching-reserve { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(232,160,32,.15) !important; }

/* Footer stays dark */
.site-footer { background: #04080F !important; }

/* Nav: stay dark glass */
.site-nav, nav { background: rgba(7,13,27,.92) !important; }

/* ── HERO ILLUSTRATION CARDS (stay white, dark text) ─────────────────── */
/* These decorative mock-UI elements should remain white for visual contrast */
.coach-card,
.case-widget,
.hero-card-shell,
.hc-file-row,
.hc-badge,
.hc-step-info strong { color: #0b1829 !important; -webkit-text-fill-color: #0b1829 !important; }
.coach-card *,
.case-widget *,
.hero-card-shell * { color: #0b1829 !important; -webkit-text-fill-color: #0b1829 !important; }

/* ── COURSE CARD PRICE ───────────────────────────────────────────────── */
.card-price {
  display: flex; align-items: baseline; gap: 4px;
  margin: 12px 0 4px;
}
.card-price-amount {
  font-size: 22px; font-weight: 800; letter-spacing: -.5px;
  color: var(--gold-400) !important;
  -webkit-text-fill-color: var(--gold-400) !important;
}
.card-price-currency {
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  color: rgba(255,255,255,.45) !important;
  -webkit-text-fill-color: rgba(255,255,255,.45) !important;
}

/* ── GLOBAL HEADING + TEXT COLOUR FIX ────────────────────────────────── */
/* Navy and ink tokens used as text colours throughout original CSS */
h1, h2, h3, h4, h5, h6 { color: rgba(255,255,255,.96) !important; }
p { color: rgba(255,255,255,.75); }
li { color: rgba(255,255,255,.72) !important; }
label { color: rgba(255,255,255,.78) !important; }
strong { color: rgba(255,255,255,.88) !important; }

/* Specific class text overrides (these use --navy-800/900 explicitly) */
.coaching-copy h2, .career-copy h2, .employer-copy h2 { color: rgba(255,255,255,.96) !important; }
.heading-row > p { color: rgba(255,255,255,.68) !important; }
.course-card h3 { color: rgba(255,255,255,.92) !important; }
.course-card:hover h3 { color: #ffffff !important; }
.course-card .course-tag { color: var(--gold-400) !important; background: rgba(232,160,32,.1) !important; }
.course-card .card-body > p { color: rgba(255,255,255,.65) !important; }
.course-card .card-topics span { color: rgba(255,255,255,.55) !important; border-color: rgba(255,255,255,.12) !important; background: rgba(255,255,255,.04) !important; }
.course-card .card-meta-item { color: rgba(255,255,255,.5) !important; }
.text-link { color: var(--gold-400) !important; }
.text-link:hover { color: var(--gold-300) !important; }

/* Keep gold accent text gold */
.eyebrow, .overline, .eyebrow-text { color: var(--gold-500) !important; }
/* Stat strip numbers */
.stat-block strong { color: var(--gold-400) !important; }

/* ── INLINE BACKGROUND:VAR(--NAVY-*) → KEEP DARK ─────────────────────── */
/* These sections use navy tokens for backgrounds — must stay dark */
[style*="background:var(--navy-900)"],
[style*="background: var(--navy-900)"] { background: #060e1a !important; }
[style*="background:var(--navy-800)"],
[style*="background: var(--navy-800)"] { background: #0b1829 !important; }
[style*="background:var(--navy-700)"],
[style*="background: var(--navy-700)"] { background: #122040 !important; }

/* ── INLINE COLOR:VAR(--NAVY-*) → FORCE LIGHT TEXT ────────────────────── */
/* These inline styles use navy tokens that resolve to dark — invisible on dark bg */
[style*="color:var(--navy-800)"],
[style*="color: var(--navy-800)"],
[style*="color:var(--navy-700)"],
[style*="color: var(--navy-700)"],
[style*="color:var(--navy-900)"],
[style*="color: var(--navy-900)"] { color: rgba(255,255,255,.82) !important; }
/* Restore dark text on hero illustration cards (light bg) */
.coach-card [style*="color:var(--navy"],
.case-widget [style*="color:var(--navy"],
.hero-card-shell [style*="color:var(--navy"] { color: #0b1829 !important; }

/* ── PATH CARD DARK GLASS ───────────────────────────────────────────────── */
.path-card { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.12) !important; }

/* ── BLOG INDEX PAGE (embedded <style> uses different class names) ──────── */
.bix-card { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.12) !important; }
.bix-excerpt { color: rgba(255,255,255,.65) !important; }
.bix-meta { color: rgba(255,255,255,.42) !important; }
.bix-read { color: var(--gold-500) !important; }
.bs-widget { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.12) !important; }
.bs-widget-title { color: rgba(255,255,255,.4) !important; }
.bs-article-list li a { color: rgba(255,255,255,.82) !important; }
.bs-article-list li { border-color: rgba(255,255,255,.08) !important; }
.bs-cat-btn { color: rgba(255,255,255,.65) !important; }
.bs-cat-count { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.45) !important; }
.pg-btn { color: rgba(255,255,255,.65) !important; border-color: rgba(255,255,255,.15) !important; background: transparent !important; }
.pg-btn.is-active { background: var(--gold-500) !important; border-color: var(--gold-500) !important; color: #04080F !important; }

/* ── COURSE PAGE: PERSONA CARDS ─────────────────────────────────────────── */
.persona-card {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(232,160,32,.12) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: border-color .35s, box-shadow .35s, transform .35s !important;
}
.persona-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top left, rgba(232,160,32,.1), transparent 65%);
  opacity: 0;
  transition: opacity .35s;
  pointer-events: none;
}
.persona-card:hover { border-color: rgba(232,160,32,.55) !important; box-shadow: 0 0 0 1px rgba(232,160,32,.2), 0 16px 48px rgba(0,0,0,.45) !important; transform: translateY(-5px) !important; }
.persona-card:hover::before { opacity: 1; }

.pc-icon {
  color: var(--gold-500) !important;
  transition: background .35s !important;
}
.pc-icon svg { transition: transform .35s, filter .35s; }
.persona-card:hover .pc-icon { background: rgba(232,160,32,.18) !important; }
.persona-card:hover .pc-icon svg { transform: scale(1.12); filter: drop-shadow(0 0 6px rgba(232,160,32,.6)); }

/* Staggered entrance */
@keyframes pc-reveal {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
.persona-card.reveal { animation: pc-reveal .55s cubic-bezier(.2,.6,.3,1) both; }
.persona-card.reveal:nth-child(1) { animation-delay: .08s; }
.persona-card.reveal:nth-child(2) { animation-delay: .18s; }
.persona-card.reveal:nth-child(3) { animation-delay: .28s; }
.persona-card.reveal:nth-child(4) { animation-delay: .38s; }

.pc-role { color: rgba(255,255,255,.92) !important; }
.pc-desc { color: rgba(255,255,255,.62) !important; transition: color .25s; }
.persona-card:hover .pc-role { color: var(--gold-400) !important; }
.persona-card:hover .pc-desc { color: rgba(255,255,255,.78) !important; }

/* ── NOT-FOR-NOTE STANDOUT ────────────────────────────────────────────────── */
.not-for-note {
  background: rgba(232,160,32,.06) !important;
  border: 1px solid rgba(232,160,32,.22) !important;
  border-left: 3px solid var(--gold-500) !important;
  color: rgba(255,255,255,.72) !important;
  padding: 20px 20px 20px 22px !important;
  border-radius: 10px !important;
  margin-top: 28px !important;
}
.not-for-note strong {
  color: var(--gold-400) !important;
  font-size: 10.5px !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  display: block !important;
  margin-bottom: 6px !important;
}

/* ── FAQ SPLIT LAYOUT ─────────────────────────────────────────────────────── */
.faq-layout {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 72px;
  align-items: start;
  max-width: 960px;
  margin: 0 auto;
}
.faq-intro { position: sticky; top: 96px; }
.faq-intro .eyebrow { justify-content: flex-start !important; }
.faq-intro h2 { font-size: clamp(22px,2.8vw,34px) !important; margin-block: 14px 16px !important; color: rgba(255,255,255,.95) !important; }
.faq-intro p { color: rgba(255,255,255,.6) !important; font-size: 15px !important; line-height: 1.75 !important; }
.faq-list { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 768px) {
  .faq-layout { grid-template-columns: 1fr !important; gap: 32px !important; }
  .faq-intro { position: static !important; }
}

/* ── RELATED COURSES GOLD HOVER ───────────────────────────────────────────── */
.related-card {
  position: relative !important;
  overflow: hidden !important;
  transition: border-color .35s, box-shadow .35s, transform .35s !important;
}
.related-card::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg, rgba(232,160,32,.13) 0%, transparent 55%) !important;
  opacity: 0 !important;
  transition: opacity .35s !important;
  pointer-events: none !important;
  border-radius: inherit !important;
}
.related-card:hover::before { opacity: 1 !important; }
.related-card:hover {
  border-color: rgba(232,160,32,.65) !important;
  box-shadow: 0 0 0 1px rgba(232,160,32,.25), 0 20px 56px rgba(0,0,0,.55) !important;
  transform: translateY(-5px) !important;
}
.related-card .rc-name2 { transition: color .3s !important; }
.related-card:hover .rc-name2 { color: var(--gold-400) !important; }
.related-card .rc-tag2 { transition: color .3s !important; }
.related-card:hover .rc-tag2 { color: rgba(232,160,32,.9) !important; }

/* ── COURSE PAGE: CURRICULUM MODULE TITLES ──────────────────────────────── */
.cm-header { color: rgba(255,255,255,.88) !important; background: transparent !important; }
.cm-header:hover { background: rgba(255,255,255,.04) !important; }
.cm-title { color: rgba(255,255,255,.88) !important; }
.cm-num { color: rgba(255,255,255,.55) !important; border-color: rgba(255,255,255,.2) !important; }
.curric-module.is-open .cm-header { background: rgba(255,255,255,.05) !important; }
.cm-body li { color: rgba(255,255,255,.68) !important; }
.cm-body li::marker { color: rgba(232,160,32,.6) !important; }

/* ── COURSE PAGE: TESTIMONIAL QUOTES ────────────────────────────────────── */
.testimonial-card p { color: rgba(255,255,255,.82) !important; }
.tc-name { color: rgba(255,255,255,.92) !important; }

/* ── COURSE PAGE: RELATED COURSES SECTION ───────────────────────────────── */
.related-courses-section { background: var(--ivory-200) !important; }
.related-courses-section .eyebrow { color: var(--gold-500) !important; }
.related-courses-section h2, .related-courses-section h3 { color: rgba(255,255,255,.96) !important; }
.related-courses-section > .section-shell > p { color: rgba(255,255,255,.65) !important; }
.rc-label { color: var(--gold-500) !important; }
.rc-name2 { color: rgba(255,255,255,.92) !important; }
.rc-meta2 { color: rgba(255,255,255,.5) !important; }

/* ── INLINE VAR(--WHITE) SECTION BACKGROUNDS ─────────────────────────────── */
.faq-section { background: var(--ivory-200) !important; }
.faq-intro h2, .faq-intro p { color: rgba(255,255,255,.9) !important; }
.faq-item summary { color: rgba(255,255,255,.88) !important; }
.faq-item[open] summary { color: var(--gold-400) !important; }

/* ── COURSE PAGE: HOW IT WORKS STEPS ────────────────────────────────────── */
.hiw-step h4 { color: rgba(255,255,255,.92) !important; }
.hiw-step p { color: rgba(255,255,255,.65) !important; }

/* ── PROOF STATS STRIP ON COURSE PAGES ──────────────────────────────────── */
.proof-stat { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.1) !important; }
.proof-stats { border-color: rgba(232,160,32,.1) !important; }
.proof-stat strong { color: var(--gold-400) !important; }
.proof-stat span { color: rgba(255,255,255,.6) !important; }

/* ── CQS QUICK STATS IN COURSE HERO ─────────────────────────────────────── */
.cqs-item { color: rgba(255,255,255,.65) !important; }
.cqs-item b { color: rgba(255,255,255,.92) !important; }

/* ── CURRIC INTRO TEXT ───────────────────────────────────────────────────── */
.curric-intro h2 { color: rgba(255,255,255,.96) !important; }
.curric-intro p { color: rgba(255,255,255,.68) !important; }
.curric-stat b { color: var(--gold-400) !important; }
.curric-stat small { color: rgba(255,255,255,.55) !important; }

/* ── BTN-PRIMARY → GOLD FILL ─────────────────────────────────────────────── */
.btn-primary { background: var(--gold-500) !important; color: #04080F !important; border-color: transparent !important; }
.btn-primary:hover { background: var(--gold-400) !important; color: #04080F !important; box-shadow: 0 8px 28px rgba(232,160,32,.45) !important; }

/* ── CURRICULUM INTRO: STICKY SIDEBAR ───────────────────────────────────── */
.curric-intro { position: sticky; top: 120px; }
@media (max-width: 1024px) { .curric-intro { position: static; } }
/* ── PATH CARD OUTCOMES TEXT ─────────────────────────────────────────────── */
/* --slate-700 used in base CSS for outcomes list — now resolved via :root   */
/* but add !important to beat any embedded-style specificity                 */
.path-card-outcomes li { color: rgba(255,255,255,.7) !important; }
.path-card-desc { color: rgba(255,255,255,.65) !important; }

/* ── BLOG POST PAGE (ps-* sidebar + share classes in embedded <style>) ───── */
.ps-toc,
.ps-widget { background: rgba(255,255,255,.04) !important; border-color: rgba(232,160,32,.12) !important; }
.ps-toc-list a { color: rgba(255,255,255,.72) !important; }
.ps-toc-list a:hover,
.ps-toc-list a.is-active { color: var(--gold-400) !important; background: rgba(232,160,32,.08) !important; }
.ps-article-list li a { color: rgba(255,255,255,.72) !important; }
.ps-article-list li a:hover { color: var(--gold-400) !important; }
.ps-article-list li { border-bottom-color: rgba(255,255,255,.08) !important; }
.ps-article-list .ps-meta { color: rgba(255,255,255,.4) !important; }
.post-callout p { color: rgba(255,255,255,.72) !important; }
.post-share { border-top-color: rgba(255,255,255,.1) !important; }
.post-share-btn { color: rgba(255,255,255,.7) !important; border-color: rgba(255,255,255,.15) !important; }
.post-share-btn:hover { color: var(--gold-400) !important; border-color: var(--gold-500) !important; background: rgba(232,160,32,.08) !important; }
.post-related { border-top-color: rgba(255,255,255,.1) !important; }

/* ── TRUST BAR: REAL BROKERAGE LOGOS ──────────────────────────────────── */
.trust-logo-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 18px !important;
  border-radius: 12px !important;
  transition: transform .2s var(--ease), box-shadow .2s !important;
}
.trust-logo-item:hover { transform: translateY(-3px) !important; }

/* Light pill — colored logos that need a light background to read */
.trust-logo-item--light {
  background: rgba(255,255,255,.9) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.3) !important;
}
.trust-logo-item--light:hover {
  background: #fff !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.4) !important;
}

/* Dark pill — white/transparent logos that work directly on dark bg */
.trust-logo-item--dark {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
}
.trust-logo-item--dark:hover {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(232,160,32,.3) !important;
}

.trust-logo {
  height: 36px !important;
  width: auto !important;
  max-width: 150px !important;
  object-fit: contain !important;
  display: block !important;
  transition: opacity .2s !important;
}
/* White logos: slight dim at rest, full brightness on hover */
.trust-logo-item--dark .trust-logo { opacity: .72 !important; }
.trust-logo-item--dark:hover .trust-logo { opacity: 1 !important; }

/* ── BLOG TEASER REDESIGN ─────────────────────────────────────────────────── */
.blog-teaser-section {
  background: var(--ivory-200) !important;
  padding: clamp(56px,6vw,88px) 0 !important;
  position: relative !important;
}
.blog-teaser-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-bottom: 40px !important;
  flex-wrap: wrap !important;
}
.blog-teaser-title {
  font-size: clamp(28px,3.5vw,44px) !important;
  font-weight: 800 !important;
  color: rgba(255,255,255,.95) !important;
  margin: 8px 0 0 !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
  -webkit-text-fill-color: rgba(255,255,255,.95) !important;
}
.blog-teaser-grid {
  display: grid !important;
  grid-template-columns: repeat(3,1fr) !important;
  gap: 20px !important;
}
@media (max-width: 860px) {
  .blog-teaser-grid { grid-template-columns: 1fr !important; }
}
@media (min-width: 560px) and (max-width: 860px) {
  .blog-teaser-grid { grid-template-columns: 1fr 1fr !important; }
}

/* Blog teaser card */
.btc {
  display: flex !important;
  flex-direction: column !important;
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(232,160,32,.14) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  text-decoration: none !important;
  transition: transform .32s var(--ease), border-color .25s, box-shadow .32s !important;
  position: relative !important;
}
.btc:hover {
  transform: translateY(-7px) !important;
  border-color: rgba(232,160,32,.5) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,.45), 0 0 0 1px rgba(232,160,32,.18) !important;
}
.btc-accent {
  height: 3px !important;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold-500) 50%, var(--gold-400)) !important;
  opacity: .7 !important;
  transition: opacity .25s !important;
}
.btc:hover .btc-accent { opacity: 1 !important; }
.btc-body {
  padding: 26px 28px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  flex: 1 !important;
}
.btc-num {
  font-size: 10px !important;
  font-weight: 800 !important;
  color: rgba(232,160,32,.3) !important;
  letter-spacing: .15em !important;
  margin-bottom: 12px !important;
  display: block !important;
}
.btc-cat {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--gold-400) !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
  display: block !important;
}
.btc-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.9) !important;
  line-height: 1.45 !important;
  margin: 0 0 auto !important;
  flex: 1 !important;
  -webkit-text-fill-color: rgba(255,255,255,.9) !important;
}
.btc-cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--gold-400) !important;
  margin-top: 20px !important;
  transition: gap .22s var(--ease), color .2s !important;
}
.btc:hover .btc-cta { gap: 12px !important; color: var(--gold-300) !important; }
.btc-cta svg { flex-shrink: 0 !important; transition: transform .22s var(--ease) !important; }
.btc:hover .btc-cta svg { transform: translateX(3px) !important; }
.post-related-title { color: rgba(255,255,255,.92) !important; }
