:root {
    /* Light palette — tfse.biz guide: light bg, deep-indigo ink, brand purple, lime accent */
    --bg: #FAFAFA;
    --bg-elevated: #F4F3F8;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F2F1F7;
    --ink: #120436;
    --ink-muted: #5A5573;
    --ink-dim: #8B86A0;
    --copper: #5314FF;
    --copper-bright: #6E30F7;
    --accent-ink: var(--copper); /* large text/accents = brand purple */
    --link-ink: #5314FF; /* readable purple on light */
    --copper-deep: #3A0FB0;
    --copper-glow: rgba(83, 20, 255, 0.12);
    --copper-soft: rgba(83, 20, 255, 0.05);
    --line: #E6E3F0;
    --line-bright: #D5D1E4;
    --lime: #B9FD3B; /* tfse highlight */
    --green: #4FA300;
    --red: #E5484D;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; }

  body {
    background: var(--bg);
    color: var(--ink);
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }

  /* Subtle grid pattern overlay */
  body::before {
    content: '';
    position: fixed;
    inset: 0;
    background-image:
      linear-gradient(rgba(83, 20, 255, 0.025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(83, 20, 255, 0.025) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
    z-index: 1;
  }

  .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 2;
  }

  /* === NAV === */
  nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    padding: 18px 32px;
    background: rgba(250, 250, 250, 0.82);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-bottom: 1px solid var(--line);
  }
  .nav-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .nav-logo {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 700;
    font-size: clamp(15px, 2vw, 19px);
    letter-spacing: 0.2px;
    white-space: nowrap;
    background: linear-gradient(100deg, #A21CFF 0%, #5314FF 60%, #4B2BFF 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
  }
  .nav-logo span { color: inherit; }
  .nav-logo .logo-mark { -webkit-text-fill-color: #120436; color: #120436; background: none; }
  @media (max-width: 600px) { .nav-logo .logo-rest { display: none; } }
  .nav-links {
    display: flex;
    gap: 36px;
    align-items: center;
  }
  .nav-links > a {
    color: var(--ink-muted);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s;
  }
  .nav-links > a:hover { color: var(--ink); }
  .nav-links > a.btn-cta { color: #fff; }
  .nav-links > a.btn-cta:hover { color: #fff; }
  .btn-cta {
    padding: 11px 22px;
    background: var(--copper);
    color: #fff;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s;
  }
  .btn-cta:hover {
    background: var(--copper-bright);
    transform: translateY(-1px);
  }
  .btn-primary {
    display: inline-block;
    padding: 16px 28px;
    background: var(--copper);
    color: #fff;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
  }
  .btn-primary:hover {
    background: var(--copper-bright);
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(83, 20, 255, 0.3);
  }
  .btn-secondary {
    display: inline-block;
    padding: 16px 28px;
    background: transparent;
    color: var(--ink);
    border: 1px solid var(--line-bright);
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
  }
  .btn-secondary:hover {
    border-color: var(--copper);
    color: var(--accent-ink);
  }

  /* === HERO === */
  .hero {
    padding: 160px 0 100px;
    position: relative;
    overflow: hidden;
  }
  .hero::before {
    content: '';
    position: absolute;
    top: 10%;
    right: -300px;
    width: 800px;
    height: 800px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--copper-glow) 0%, transparent 70%);
    pointer-events: none;
  }
  .hero-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 80px;
    align-items: center;
  }
  .hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    background: var(--copper-soft);
    border: 1px solid rgba(83, 20, 255, 0.25);
    border-radius: 100px;
    font-size: 13px;
    color: var(--accent-ink);
    font-weight: 500;
    margin-bottom: 28px;
  }
  .hero-eyebrow::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--copper);
  }
  .hero h1 {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(38px, 5vw, 66px);
    line-height: 1.08;
    letter-spacing: -0.03em;
    margin-bottom: 32px;
  }
  .hero h1 .accent {
    font-style: italic;
    color: var(--accent-ink);
    font-weight: 400;
  }
  .hero-positioning {
    margin-bottom: 32px;
  }
  .hero-positioning .line {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 8px;
  }
  .hero-positioning .line em { color: var(--accent-ink); font-style: italic; }
  .hero-sub {
    font-size: 17px;
    line-height: 1.65;
    color: var(--ink-muted);
    margin-bottom: 40px;
    max-width: 540px;
  }
  .hero-ctas {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
  }

  /* Hero Visual: Career Trajectory Chart */
  .hero-visual {
    aspect-ratio: 4/5;
    background: linear-gradient(135deg, #F4F3F8 0%, #ECEAF6 100%);
    border-radius: 16px;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
  }
  .hero-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 70% 30%, rgba(83, 20, 255, 0.18) 0%, transparent 50%),
      radial-gradient(circle at 20% 80%, rgba(83, 20, 255, 0.1) 0%, transparent 50%);
    pointer-events: none;
  }
  .hero-visual-label {
    position: relative;
    z-index: 2;
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--accent-ink);
    font-weight: 600;
    margin-bottom: 8px;
  }
  .hero-visual-title {
    position: relative;
    z-index: 2;
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.15;
    margin-bottom: 40px;
    letter-spacing: -0.01em;
  }
  .hero-visual-title em { color: var(--accent-ink); font-style: italic; }
  .career-ladder {
    position: relative;
    z-index: 2;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-left: 16px;
    border-left: 1px solid var(--line-bright);
  }
  .ladder-step {
    position: relative;
    padding-left: 28px;
  }
  .ladder-step::before {
    content: '';
    position: absolute;
    left: -22px;
    top: 8px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--copper);
    box-shadow: 0 0 0 4px rgba(83, 20, 255, 0.15);
  }
  .ladder-role {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 2px;
  }
  .ladder-salary {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 13px;
    color: var(--accent-ink);
    font-weight: 500;
  }
  .ladder-detail {
    font-size: 11px;
    color: var(--ink-dim);
    margin-top: 2px;
  }
  .hero-visual-footer {
    position: relative;
    z-index: 2;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
    font-size: 11px;
    color: var(--ink-dim);
    letter-spacing: 1px;
    text-transform: uppercase;
  }

  /* === STATS === */
  .stats {
    padding: 48px 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--bg-elevated);
    position: relative;
    z-index: 2;
  }
  .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
  .stat {
    text-align: center;
    padding: 20px;
    border-right: 1px solid var(--line);
  }
  .stat:last-child { border-right: none; }
  .stat-icon {
    width: 24px;
    height: 24px;
    margin: 0 auto 12px;
    color: var(--accent-ink);
  }
  .stat-number {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: 52px;
    line-height: 1;
    color: var(--accent-ink);
    margin-bottom: 8px;
    letter-spacing: -0.02em;
  }
  .stat-label {
    font-size: 13px;
    color: var(--ink-muted);
    font-weight: 500;
  }

  /* === SECTION DEFAULTS === */
  .section {
    padding: 120px 0;
    position: relative;
    z-index: 2;
  }
  .section-header {
    text-align: center;
    margin-bottom: 80px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
  }
  .section-eyebrow {
    display: inline-block;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--accent-ink);
    font-weight: 600;
    margin-bottom: 20px;
  }
  .section-title {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(36px, 5vw, 56px);
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin-bottom: 20px;
  }
  .section-title .accent { color: var(--accent-ink); font-style: italic; }
  .section-sub {
    font-size: 18px;
    color: var(--ink-muted);
    line-height: 1.6;
  }

  /* === OFFER / WHAT YOU GET === */
  .offer {
    padding: 110px 0;
    border-bottom: 1px solid var(--line);
    position: relative;
    z-index: 2;
  }
  .offer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 56px;
    align-items: center;
  }
  .offer-title {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin: 16px 0 32px;
  }
  .offer-title .accent { color: var(--accent-ink); font-style: italic; }
  .offer-list { list-style: none; }
  .offer-list li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 0;
    font-size: 17px;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  .offer-list li:last-child { border-bottom: none; }
  .offer-list li::before {
    content: '';
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 1px;
    border-radius: 50%;
    background: var(--copper-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A4DFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 13px no-repeat;
    border: 1px solid rgba(83, 20, 255, 0.3);
  }
  .offer-price {
    background: linear-gradient(135deg, var(--bg-elevated) 0%, var(--bg-card) 100%);
    border: 1px solid var(--line-bright);
    border-radius: 16px;
    padding: 40px 36px;
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .offer-price::before {
    content: '';
    position: absolute;
    top: -60%;
    right: -40%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 30% 30%, var(--copper-glow) 0%, transparent 55%);
    pointer-events: none;
  }
  .offer-price > * { position: relative; z-index: 2; }
  .offer-price-tag {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--accent-ink);
    font-weight: 600;
    margin-bottom: 20px;
  }
  .offer-price-amount {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 64px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.02em;
    margin-bottom: 12px;
  }
  .offer-price-amount span {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 18px;
    color: var(--ink-muted);
    font-weight: 400;
  }
  .offer-price-sub {
    font-size: 14px;
    color: var(--ink-muted);
    margin-bottom: 28px;
  }
  .offer-price-cta { width: 100%; margin-bottom: 20px; }
  .offer-price-note {
    font-size: 13px;
    color: var(--ink-dim);
    line-height: 1.5;
    padding-top: 20px;
    border-top: 1px solid var(--line);
  }

  /* === FEATURED QUOTE === */
  .featured-quote {
    padding: 100px 0;
    text-align: center;
    position: relative;
    z-index: 2;
  }
  .featured-quote-mark {
    font-family: 'Radio Canada Big', sans-serif;
    font-style: italic;
    font-size: 80px;
    color: var(--accent-ink);
    line-height: 0.5;
    margin-bottom: 24px;
  }
  .featured-quote-text {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 3.5vw, 40px);
    line-height: 1.3;
    letter-spacing: -0.01em;
    max-width: 1000px;
    margin: 0 auto 32px;
  }
  .featured-quote-text em { color: var(--accent-ink); font-style: italic; }
  .featured-quote-author {
    font-size: 14px;
    color: var(--ink-muted);
    font-weight: 500;
  }
  .featured-quote-author strong {
    color: var(--ink);
    font-weight: 600;
  }

  /* === TWO AUDIENCES === */
  .programs {
    padding: 64px 0;
    border-top: 1px solid var(--line);
    position: relative;
    z-index: 2;
  }
  .programs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
  .program-card {
    background: var(--bg-elevated);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 48px 40px;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
  }
  .program-card:hover {
    border-color: var(--copper);
    background: var(--bg-card);
    transform: translateY(-4px);
  }
  .program-card-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--copper-soft);
    border: 1px solid rgba(83, 20, 255, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-ink);
    margin-bottom: 28px;
  }
  .program-card-icon svg { width: 28px; height: 28px; }
  .program-card-tag {
    display: inline-block;
    padding: 4px 10px;
    background: var(--copper-soft);
    color: var(--accent-ink);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-radius: 4px;
    margin-bottom: 16px;
  }
  .program-card h3 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 36px;
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.01em;
    margin-bottom: 16px;
  }
  .program-card h3 em { color: var(--accent-ink); font-style: italic; }
  .program-card p {
    font-size: 16px;
    color: var(--ink-muted);
    line-height: 1.6;
    margin-bottom: 28px;
  }
  .program-card-list {
    list-style: none;
    margin-bottom: 32px;
  }
  .program-card-list li {
    padding: 10px 0;
    font-size: 14px;
    color: var(--ink);
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-bottom: 1px solid var(--line);
  }
  .program-card-list li:last-child { border-bottom: none; }
  .program-card-list li::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--copper);
    margin-top: 7px;
    flex-shrink: 0;
  }
  .program-card-arrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--accent-ink);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
  }
  .program-card-arrow svg { width: 14px; height: 14px; }

  /* === IF YOU'RE / BUT YOU WANT TO === */
  .pain-desire {
    padding: 120px 0;
    border-top: 1px solid var(--line);
    background: var(--bg-elevated);
    position: relative;
    z-index: 2;
  }
  .pain-desire-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    max-width: 1200px;
    margin: 0 auto;
  }
  .pd-column {
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 48px 40px;
    transition: border-color 0.3s;
  }
  .pd-column:hover { border-color: var(--copper); }
  .pd-eyebrow {
    font-size: 12px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--accent-ink);
    font-weight: 600;
    margin-bottom: 16px;
  }
  .pd-title {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 36px;
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.01em;
    margin-bottom: 36px;
  }
  .pd-title em { color: var(--accent-ink); font-style: italic; }
  .pd-list {
    list-style: none;
  }
  .pd-list li {
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: flex-start;
    gap: 14px;
    font-size: 16px;
    line-height: 1.5;
  }
  .pd-list li:last-child { border-bottom: none; }
  .pd-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
    font-size: 13px;
    font-weight: 700;
  }
  .pd-icon.x {
    background: rgba(248, 113, 113, 0.12);
    color: var(--red);
  }
  .pd-icon.check {
    background: rgba(74, 222, 128, 0.12);
    color: var(--green);
  }

  /* === ABOUT BEN === */
  .about {
    padding: 100px 0;
    border-top: 1px solid var(--line);
    border-top: 1px solid var(--line);
    position: relative;
    z-index: 2;
  }
  .about-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 80px;
    align-items: center;
  }
  .about-image {
    aspect-ratio: 4/5;
    background: linear-gradient(135deg, #F4F3F8 0%, #ECEAF6 100%);
    border-radius: 16px;
    border: 1px solid var(--line);
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .about-image::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 60% 40%, rgba(83, 20, 255, 0.2) 0%, transparent 60%);
  }
  .about-image-fallback {
    position: relative;
    z-index: 2;
    text-align: center;
  }
  .about-image-fallback .name {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 56px;
    font-style: italic;
    color: rgba(250, 250, 250, 0.4);
    line-height: 1;
    margin-bottom: 12px;
  }
  .about-image-fallback .label {
    font-size: 11px;
    color: var(--ink-dim);
    letter-spacing: 2px;
    text-transform: uppercase;
  }
  .about-content .eyebrow {
    display: inline-block;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--accent-ink);
    font-weight: 600;
    margin-bottom: 20px;
  }
  .about-content h2 {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(36px, 4.5vw, 52px);
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin-bottom: 28px;
  }
  .about-content h2 em { color: var(--accent-ink); font-style: italic; }
  .about-content > p {
    font-size: 17px;
    color: var(--ink-muted);
    line-height: 1.65;
    margin-bottom: 20px;
  }
  .about-quote {
    margin: 28px 0 4px;
    padding: 4px 0 4px 24px;
    border-left: 2px solid var(--copper);
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 21px;
    line-height: 1.4;
    color: var(--ink);
  }
  .about-quote em { color: var(--accent-ink); font-style: italic; }
  .about-features {
    margin-top: 36px;
    display: grid;
    gap: 20px;
  }
  .about-feature {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 20px;
    align-items: start;
    padding: 20px 0;
    border-top: 1px solid var(--line);
  }
  .about-feature:last-child { border-bottom: 1px solid var(--line); }
  .about-feature-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: var(--copper-soft);
    border: 1px solid rgba(83, 20, 255, 0.25);
    color: var(--accent-ink);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .about-feature-icon svg { width: 22px; height: 22px; }
  .about-feature h3 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 19px;
    font-weight: 500;
    margin-bottom: 6px;
  }
  .about-feature p {
    font-size: 14px;
    color: var(--ink-muted);
    line-height: 1.55;
  }

  /* === HOW IT WORKS (hybrid model) === */
  .how-it-works {
    padding: 100px 0;
    border-top: 1px solid var(--line);
    border-top: 1px solid var(--line);
    background: var(--bg-elevated);
    position: relative;
    z-index: 2;
  }
  .how-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 60px;
    position: relative;
  }
  .how-grid::before {
    content: '';
    position: absolute;
    top: 60px;
    left: 16.67%;
    right: 16.67%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--copper), transparent);
    z-index: 0;
  }
  .how-card {
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 36px 28px;
    text-align: center;
    transition: all 0.3s;
    position: relative;
    z-index: 1;
  }
  .how-card:hover {
    border-color: var(--copper);
    transform: translateY(-4px);
  }
  .how-card-num {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--bg-elevated);
    border: 2px solid var(--copper);
    color: var(--accent-ink);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 24px;
    font-weight: 500;
    margin: 0 auto 24px;
    position: relative;
    z-index: 2;
  }
  .how-card h3 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 26px;
    font-weight: 500;
    margin-bottom: 14px;
    letter-spacing: -0.01em;
    line-height: 1.2;
  }
  .how-card h3 em { color: var(--accent-ink); font-style: italic; }
  .how-card p {
    font-size: 15px;
    color: var(--ink-muted);
    line-height: 1.6;
    margin-bottom: 20px;
  }
  .how-card-detail {
    font-size: 12px;
    color: var(--accent-ink);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 600;
    padding-top: 20px;
    border-top: 1px solid var(--line);
  }

  /* === WHAT YOU'LL LEARN === */
  .learn {
    padding: 140px 0;
    border-top: 1px solid var(--line);
    position: relative;
    z-index: 2;
  }
  .program-subhead {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 72px 0 8px;
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 24px;
    color: var(--ink);
  }
  .program-subhead span { white-space: nowrap; }
  .program-subhead::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--line);
  }
  .learn-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-top: 60px;
  }
  .learn-card {
    background: var(--bg-elevated);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 36px 32px;
    transition: all 0.3s;
  }
  .learn-card:hover {
    border-color: var(--copper);
    transform: translateY(-4px);
  }
  .learn-card-graphic {
    width: 80px;
    height: 80px;
    margin-bottom: 24px;
  }
  .learn-card h4 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 14px;
    letter-spacing: -0.01em;
    line-height: 1.2;
  }
  .learn-card h4 em { color: var(--accent-ink); font-style: italic; }
  .learn-card p {
    font-size: 15px;
    color: var(--ink-muted);
    line-height: 1.6;
  }
  /* Skill cards: static (descriptions always visible) */
  .learn-card h4 { margin-bottom: 12px; }
  .learn-card p { margin-top: 0; }
  .program-extras {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    margin-top: 48px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--bg-elevated);
    overflow: hidden;
  }
  .program-extras .extra {
    padding: 32px 28px;
    border-right: 1px solid var(--line);
  }
  .program-extras .extra:last-child { border-right: none; }
  .program-extras .extra h5 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 19px;
    font-weight: 500;
    margin-bottom: 8px;
  }
  .program-extras .extra p {
    font-size: 14px;
    color: var(--ink-muted);
    line-height: 1.55;
  }

  /* === CAREER BET (replaces Beyond the Comp Cheque) === */
  .career-bet {
    padding: 140px 0;
    border-top: 1px solid var(--line);
    background: var(--bg-elevated);
    position: relative;
    z-index: 2;
    overflow: hidden;
  }
  .career-bet::before {
    content: '';
    position: absolute;
    top: 0;
    right: -200px;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--copper-glow) 0%, transparent 70%);
    pointer-events: none;
  }
  .career-bet-header {
    text-align: center;
    margin-bottom: 80px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
  }
  .career-bet-eyebrow {
    display: inline-block;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--accent-ink);
    font-weight: 600;
    margin-bottom: 20px;
  }
  .career-bet-headline {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(40px, 5.5vw, 64px);
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
  }
  .career-bet-headline em { color: var(--accent-ink); font-style: italic; }
  .career-bet-sub {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 22px;
    line-height: 1.5;
    color: var(--ink-muted);
    font-weight: 400;
    max-width: 800px;
    margin: 0 auto;
  }
  .career-bet-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    position: relative;
    z-index: 2;
  }
  .bet-item {
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 36px 28px;
    transition: all 0.3s;
  }
  .bet-item:hover {
    border-color: var(--copper);
    transform: translateY(-2px);
  }
  .bet-item-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--copper-soft);
    border: 1px solid rgba(83, 20, 255, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-ink);
    margin-bottom: 20px;
  }
  .bet-item-icon svg { width: 24px; height: 24px; }
  .bet-item h3 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 12px;
    line-height: 1.2;
  }
  .bet-item p {
    font-size: 14px;
    color: var(--ink-muted);
    line-height: 1.6;
  }
  /* === Premium persona cards === */
  .persona-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
  .persona-card {
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 34px 28px;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    transition: border-color .2s, transform .2s, box-shadow .2s;
  }
  .persona-pb-spacer { flex: 1; }
  .pb { margin-top: 18px; }
  .pb-label {
    font-size: 10px; font-weight: 700; letter-spacing: 1.4px;
    text-transform: uppercase; color: var(--ink-dim); margin-bottom: 7px;
  }
  .pb-cost { font-size: 13.5px; color: var(--ink-muted); line-height: 1.55; margin: 0; }
  .pb-install { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
  .pb-install li {
    position: relative; padding-left: 20px; font-size: 13.5px;
    color: var(--ink); line-height: 1.45;
  }
  .pb-install li::before {
    content: ''; position: absolute; left: 0; top: 7px;
    width: 7px; height: 7px; border-radius: 2px;
    background: linear-gradient(135deg, #A21CFF, #5314FF);
  }
  .persona-proof {
    margin: 18px 0 0; font-size: 13px; font-style: italic;
    color: var(--ink-muted); line-height: 1.5;
    border-left: 2px solid var(--line-bright); padding-left: 12px;
  }
  .persona-proof b { font-style: normal; color: var(--ink); font-weight: 600; }
  .persona-card:hover {
    border-color: var(--line-bright);
    transform: translateY(-4px);
    box-shadow: 0 24px 60px rgba(18,4,54,0.08);
  }
  .persona-icon {
    width: 56px; height: 56px;
    border-radius: 16px;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #A21CFF 0%, #5314FF 100%);
    color: #fff;
    margin-bottom: 22px;
    box-shadow: 0 10px 24px rgba(83,20,255,0.25);
  }
  .persona-icon svg { width: 28px; height: 28px; }
  .persona-card h5 {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.01em;
    margin-bottom: 10px;
  }
  .persona-card > p {
    font-size: 14px;
    color: var(--ink-muted);
    line-height: 1.6;
    margin-bottom: 26px;
  }
  .persona-shift {
    margin-top: 18px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .ps-row {
    width: 100%;
    border-radius: 14px;
    padding: 14px 16px;
    font-size: 14px;
    line-height: 1.45;
  }
  .ps-tag {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    margin-bottom: 5px;
  }
  .ps-before {
    background: rgba(18,4,54,0.04);
    color: var(--ink-muted);
  }
  .ps-before .ps-tag { color: var(--ink-dim); }
  .ps-after {
    background: linear-gradient(135deg, rgba(162,28,255,0.10), rgba(83,20,255,0.10));
    border: 1px solid rgba(83,20,255,0.28);
    color: var(--ink);
    font-weight: 600;
  }
  .ps-after .ps-tag { color: var(--accent-ink); }
  .ps-arrow {
    color: var(--copper);
    display: flex;
    justify-content: center;
    line-height: 0;
  }
  .ps-arrow svg { width: 22px; height: 22px; }
  @media (max-width: 860px) {
    .persona-grid { grid-template-columns: 1fr; gap: 18px; }
  }

  /* === WHAT'S INSIDE === */
  .inside {
    padding: 140px 0;
    border-top: 1px solid var(--line);
    position: relative;
    z-index: 2;
  }
  .inside-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-top: 60px;
  }
  .inside-card {
    padding: 48px 40px;
    background: linear-gradient(135deg, var(--bg-elevated) 0%, var(--bg-card) 100%);
    border: 1px solid var(--line);
    border-radius: 16px;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
  }
  .inside-card::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 30% 30%, var(--copper-glow) 0%, transparent 60%);
    pointer-events: none;
  }
  .inside-card:hover {
    border-color: var(--copper);
  }
  .inside-card-icon {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: var(--copper-soft);
    border: 1px solid rgba(83, 20, 255, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-ink);
    margin-bottom: 24px;
    position: relative;
    z-index: 2;
  }
  .inside-card-icon svg { width: 32px; height: 32px; }
  .inside-card-tag {
    position: relative;
    z-index: 2;
    display: inline-block;
    padding: 6px 14px;
    background: var(--copper-soft);
    color: var(--accent-ink);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: 4px;
    margin-bottom: 20px;
  }
  .inside-card h3 {
    position: relative;
    z-index: 2;
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 16px;
    letter-spacing: -0.01em;
    line-height: 1.15;
  }
  .inside-card h3 em { color: var(--accent-ink); font-style: italic; }
  .inside-card p {
    position: relative;
    z-index: 2;
    font-size: 16px;
    color: var(--ink-muted);
    line-height: 1.6;
    margin-bottom: 28px;
  }
  .inside-features {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 12px;
  }
  .inside-feature {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--ink);
  }
  .inside-feature::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--copper);
    flex-shrink: 0;
  }

  /* === OUTCOMES / TESTIMONIALS === */
  .testimonials {
    padding: 100px 0;
    border-top: 1px solid var(--line);
    border-top: 1px solid var(--line);
    background: var(--bg-elevated);
    position: relative;
    z-index: 2;
  }
  .testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 60px;
  }
  .testimonial {
    padding: 36px 32px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    transition: all 0.3s;
  }
  .testimonial:hover {
    border-color: var(--copper);
    transform: translateY(-2px);
  }
  .testimonial-mark {
    font-family: 'Radio Canada Big', sans-serif;
    font-style: italic;
    font-size: 48px;
    color: var(--accent-ink);
    line-height: 0.5;
    margin-bottom: 20px;
    height: 24px;
  }
  .testimonial-quote {
    font-size: 16px;
    line-height: 1.6;
    color: var(--ink);
    margin-bottom: 24px;
    flex: 1;
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
  }
  .testimonial-author {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
  }
  .testimonial-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--copper-deep), var(--copper));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bg);
    font-weight: 700;
    font-size: 14px;
    font-family: 'Radio Canada Big', sans-serif;
  }
  .testimonial-author-name {
    font-size: 14px;
    font-weight: 600;
  }
  .testimonial-author-role {
    font-size: 12px;
    color: var(--ink-muted);
    margin-top: 2px;
  }

  /* === FAQ === */
  .faq {
    padding: 100px 0;
    border-top: 1px solid var(--line);
    border-top: 1px solid var(--line);
    position: relative;
    z-index: 2;
  }
  .faq-list {
    max-width: 980px;
    margin: 48px auto 0;
    display: flex;
    align-items: flex-start;
    gap: 56px;
  }
  .faq-col { flex: 1; min-width: 0; }
  .faq-item {
    border-bottom: 1px solid var(--line);
  }
  .faq-question {
    width: 100%;
    background: transparent;
    border: none;
    padding: 20px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: var(--ink);
    text-align: left;
    transition: color 0.2s;
    letter-spacing: -0.01em;
    line-height: 1.3;
  }
  .faq-question:hover { color: var(--accent-ink); }
  .faq-question-toggle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--line-bright);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: 24px;
    transition: all 0.3s;
    color: var(--accent-ink);
  }
  .faq-question-toggle svg {
    width: 14px;
    height: 14px;
    transition: transform 0.3s;
  }
  .faq-item.open .faq-question-toggle {
    background: var(--copper);
    border-color: var(--copper);
    color: var(--bg);
  }
  .faq-item.open .faq-question-toggle svg { transform: rotate(45deg); }
  .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, padding 0.4s ease;
  }
  .faq-item.open .faq-answer {
    max-height: 500px;
    padding-bottom: 22px;
  }
  .faq-answer p {
    font-size: 16px;
    color: var(--ink-muted);
    line-height: 1.7;
    padding-right: 60px;
  }

  /* === CTA === */
  .cta-section {
    padding: 120px 0;
    border-top: 1px solid var(--line);
    border-top: 1px solid var(--line);
    text-align: center;
    position: relative;
    z-index: 2;
    overflow: hidden;
  }
  .cta-section::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 800px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--copper-glow) 0%, transparent 60%);
    pointer-events: none;
  }
  .cta-section-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
  }
  .cta-section h2 {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 400;
    font-size: clamp(40px, 6vw, 76px);
    line-height: 1.0;
    letter-spacing: -0.025em;
    margin-bottom: 12px;
  }
  .cta-section h2 em { color: var(--accent-ink); font-style: italic; }
  .cta-section p {
    font-size: 18px;
    color: var(--ink-muted);
    margin-bottom: 40px;
    line-height: 1.6;
  }

  /* === FOOTER === */
  footer {
    padding: 80px 0 40px;
    border-top: 1px solid var(--line);
    background: var(--bg-elevated);
    position: relative;
    z-index: 2;
  }
  .footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 60px;
    margin-bottom: 60px;
  }
  .footer-emblem {
    display: block;
    width: 76px;
    height: 76px;
    border-radius: 16px;
    margin-bottom: 18px;
  }
  .footer-brand .logo {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 700;
    font-size: 32px;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
  }
  .footer-brand .logo span { color: var(--accent-ink); }
  .footer-byline {
    font-size: 13px;
    letter-spacing: 0.5px;
    color: var(--ink-muted);
    margin-bottom: 16px;
  }
  .footer-byline strong { color: var(--ink); font-weight: 600; }
  .footer-brand p {
    font-size: 14px;
    color: var(--ink-muted);
    line-height: 1.6;
    max-width: 320px;
  }
  .footer-col h3 {
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--accent-ink);
    margin-bottom: 20px;
    font-weight: 600;
  }
  .footer-col ul { list-style: none; }
  .footer-col li { margin-bottom: 12px; }
  .footer-col a {
    color: var(--ink-muted);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
  }
  .footer-col a:hover { color: var(--ink); }
  .footer-bottom {
    padding-top: 32px;
    border-top: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: var(--ink-dim);
  }

  /* === REVEAL (progressive enhancement) === */
  .reveal { opacity: 1; transform: none; }
  .js-animations .reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .js-animations .reveal.visible { opacity: 1; transform: translateY(0); }

  /* === RESPONSIVE === */
  /* === SCROLL PROGRESS BAR === */
  .scroll-progress {
    position: fixed;
    top: 0; left: 0;
    height: 3px;
    width: 0%;
    z-index: 200;
    background: linear-gradient(90deg, var(--copper-deep), var(--copper), var(--copper-bright));
    box-shadow: 0 0 12px var(--copper-glow);
    transition: width 0.1s linear;
  }

  /* === MOBILE NAV TOGGLE === */
  .nav-logo { text-decoration: none; }
  .nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--line-bright);
    border-radius: 8px;
    cursor: pointer;
  }
  .nav-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    margin: 0 auto;
    background: var(--ink);
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.2s ease;
  }
  .nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* === ACTIVE NAV LINK (scrollspy) === */
  .nav-links > a:not(.btn-cta).active { color: var(--accent-ink); }

  /* === ANIMATED HERO LADDER LINE === */
  .career-ladder { border-left: none; }
  .career-ladder::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 1px;
    background: var(--line-bright);
  }
  .career-ladder::after {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    width: 1px;
    height: var(--ladder-fill, 0%);
    background: linear-gradient(180deg, var(--copper-bright), var(--copper));
    box-shadow: 0 0 8px var(--copper-glow);
    transition: height 1.4s cubic-bezier(0.16, 1, 0.3, 1);
  }

  @media (max-width: 900px) {
    .nav-toggle { display: flex; }
    .nav-links {
      position: fixed;
      top: 73px;
      left: 0;
      right: 0;
      flex-direction: column;
      align-items: stretch;
      gap: 0;
      padding: 12px 20px 24px;
      background: rgba(250, 250, 250, 0.97);
      backdrop-filter: blur(24px);
      -webkit-backdrop-filter: blur(24px);
      border-bottom: 1px solid var(--line);
      transform: translateY(-12px);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.28s ease, transform 0.28s ease;
    }
    .nav-links.open {
      transform: translateY(0);
      opacity: 1;
      pointer-events: auto;
    }
    .nav-links > a {
      padding: 16px 4px;
      font-size: 16px;
      border-bottom: 1px solid var(--line);
    }
    .nav-dd { display: block; }
    .nav-dd-toggle {
      width: 100%; justify-content: space-between;
      padding: 16px 4px; font-size: 16px; color: var(--ink);
      border-bottom: 1px solid var(--line);
    }
    .nav-dd-menu {
      position: static; transform: none; opacity: 1; visibility: visible;
      box-shadow: none; border: none; background: transparent;
      padding: 0 0 0 14px; min-width: 0; display: none;
    }
    .nav-dd.open .nav-dd-menu { display: flex; }
    .nav-dd-menu::before { display: none; }
    .nav-dd-menu a { padding: 13px 4px; font-size: 15px; }
    .nav-quiz {
      padding: 16px 4px; font-size: 16px; text-align: left;
      border-bottom: 1px solid var(--line); width: 100%;
    }
    .nav-links > a.btn-cta {
      margin-top: 16px;
      text-align: center;
      border-bottom: none;
      padding: 14px;
    }
    .container { padding: 0 20px; }
    .hero { padding: 120px 0 60px; }
    .hero-grid { grid-template-columns: 1fr; gap: 40px; }
    .hero-visual { max-width: 380px; margin: 0 auto; }
    .stats-grid { grid-template-columns: 1fr 1fr; }
    .stat { border-right: none; border-bottom: 1px solid var(--line); padding: 24px; }
    .stat:nth-child(odd) { border-right: 1px solid var(--line); }
    .stat:nth-last-child(-n+2) { border-bottom: none; }
    .stat-number { font-size: 36px; }
    .section, .how-it-works, .career-bet, .inside, .testimonials, .faq, .pain-desire, .programs, .learn, .about { padding: 80px 0; }
    .featured-quote { padding: 60px 0; }
    .offer { padding: 70px 0; }
    .offer-grid { grid-template-columns: 1fr; gap: 36px; }
    .programs-grid { grid-template-columns: 1fr; }
    .pain-desire-grid { grid-template-columns: 1fr; gap: 24px; }
    .pd-column { padding: 36px 28px; }
    .about-grid { grid-template-columns: 1fr; gap: 40px; }
    .how-grid { grid-template-columns: 1fr; }
    .how-grid::before { display: none; }
    .learn-grid { grid-template-columns: 1fr; }
    .program-extras { grid-template-columns: 1fr; }
    .program-extras .extra { border-right: none; border-bottom: 1px solid var(--line); }
    .program-extras .extra:last-child { border-bottom: none; }
    .career-bet-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
    .bet-item { padding: 28px 20px; }
    .inside-grid { grid-template-columns: 1fr; }
    .testimonials-grid { grid-template-columns: 1fr; }
    .faq-list { flex-direction: column; gap: 0; }
    .faq-question { font-size: 17px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    .footer-bottom { flex-direction: column; gap: 12px; }
  }

  /* === TFSE-FEEL OVERRIDES: bold grotesque headlines + rounded/pill shapes === */
  .hero h1, .section-title, .career-bet-headline, .offer-title,
  .cta-section h2, .about-content h2, .hero-visual-title,
  .stat-number, .offer-price-amount {
    font-weight: 700;
    letter-spacing: -0.03em;
  }
  .program-card h3, .inside-card h3, .pd-title, .how-card h3,
  .learn-card h4, .program-subhead, .faq-question, .about-feature h3,
  .about-quote, .testimonial-quote, .featured-quote-text {
    font-weight: 600;
    letter-spacing: -0.015em;
  }
  .hero h1 .accent, .section-title .accent, .hero-positioning .line em {
    font-weight: 700;
  }
  /* Pill buttons (TFSE style) */
  .btn-primary, .btn-secondary, .btn-cta, .offer-price-cta {
    border-radius: 999px;
  }
  /* Rounder panels */
  .program-card, .learn-card, .inside-card, .how-card, .testimonial,
  .offer-price, .program-extras, .hero-visual, .about-image,
  .pd-column, .bet-item {
    border-radius: 22px;
  }

  /* ===================== APPLY MODAL ===================== */
  .modal-overlay {
    position: fixed; inset: 0; z-index: 300;
    display: flex; align-items: center; justify-content: center;
    padding: 24px;
    background: rgba(6, 7, 10, 0.72);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    opacity: 0; visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
  }
  .modal-overlay.open { opacity: 1; visibility: visible; }
  .modal {
    width: 100%; max-width: 480px;
    background: var(--bg-elevated);
    border: 1px solid var(--line-bright);
    border-radius: 24px;
    padding: 36px 34px;
    position: relative;
    box-shadow: 0 40px 120px rgba(18,4,54,0.12), 0 0 0 1px rgba(83, 20, 255,0.15);
    transform: translateY(16px) scale(0.98);
    transition: transform 0.3s cubic-bezier(0.16,1,0.3,1);
    max-height: 90vh; overflow-y: auto;
  }
  .modal-overlay.open .modal { transform: translateY(0) scale(1); }
  .modal-close {
    position: absolute; top: 16px; right: 16px;
    width: 36px; height: 36px; border-radius: 50%;
    background: var(--bg-card); border: 1px solid var(--line);
    color: var(--ink-muted); font-size: 22px; line-height: 1; cursor: pointer;
    transition: all 0.2s;
  }
  .modal-close:hover { color: var(--ink); border-color: var(--copper); }
  .modal-eyebrow {
    font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase;
    color: var(--accent-ink); font-weight: 700; margin-bottom: 10px;
    padding-right: 44px;
  }
  .modal h3 {
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: 30px; letter-spacing: -0.02em; margin-bottom: 8px;
  }
  .modal h3 em { font-style: normal; color: var(--accent-ink); }
  .modal-sub { font-size: 14px; color: var(--ink-muted); line-height: 1.5; margin-bottom: 24px; }
  #applyForm { display: grid; gap: 16px; }
  #applyForm label {
    display: grid; gap: 7px;
    font-size: 13px; font-weight: 600; color: var(--ink);
  }
  .form-row { display: grid; grid-template-columns: 1fr; gap: 16px; }
  #applyForm input, #applyForm select, #applyForm textarea {
    width: 100%; padding: 12px 14px;
    background: var(--bg); color: var(--ink);
    border: 1px solid var(--line-bright); border-radius: 10px;
    font-family: 'Radio Canada Big', sans-serif; font-size: 15px; font-weight: 400;
    transition: border-color 0.2s, box-shadow 0.2s;
  }
  #applyForm textarea { resize: vertical; }
  #applyForm input:focus, #applyForm select:focus, #applyForm textarea:focus {
    outline: none; border-color: var(--copper);
    box-shadow: 0 0 0 3px var(--copper-soft);
  }
  .modal-submit { width: 100%; margin-top: 4px; cursor: pointer; border: none; font-family: inherit; }
  .modal-submit:disabled { opacity: 0.7; cursor: default; }
  .form-status { font-size: 13px; text-align: center; min-height: 18px; }
  .form-status.ok { color: var(--green); }
  .form-status.err { color: var(--red); }
  @media (max-width: 560px) { .form-row { grid-template-columns: 1fr; } }
  .phone-field { display: flex; gap: 8px; }
  .phone-field select { width: auto !important; flex: 0 0 84px; max-width: 84px; padding: 12px 6px; }
  .phone-field input { flex: 1; min-width: 0; }

  /* ===================== VISUAL POP ===================== */
  /* Grain texture overlay */
  body::after {
    content: ''; position: fixed; inset: 0; z-index: 1; pointer-events: none;
    opacity: 0.5; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  }
  /* Animated mesh blobs behind hero */
  .hero::after {
    content: ''; position: absolute; z-index: 0; pointer-events: none;
    left: -200px; bottom: -200px; width: 560px; height: 560px; border-radius: 50%;
    background: radial-gradient(circle, rgba(139,123,255,0.16) 0%, transparent 70%);
    animation: floatBlob 14s ease-in-out infinite alternate;
  }
  .hero::before { animation: floatBlob 18s ease-in-out infinite alternate-reverse; }
  @keyframes floatBlob {
    from { transform: translate(0,0) scale(1); }
    to   { transform: translate(40px,-30px) scale(1.12); }
  }
  /* Gradient text on the headline accent */
  .hero h1 .accent {
    background: linear-gradient(110deg, #7A4DFF 0%, #5314FF 50%, #7A4DFF 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
  }
  /* Gradient + glow on primary buttons */
  .btn-primary, .offer-price-cta, .modal-submit, .btn-cta {
    background: linear-gradient(120deg, #5314FF 0%, #4310CC 100%);
    box-shadow: 0 8px 28px rgba(83, 20, 255,0.32);
  }
  .btn-primary:hover, .offer-price-cta:hover, .modal-submit:hover, .btn-cta:hover {
    background: linear-gradient(120deg, #7A4DFF 0%, #5314FF 100%);
    box-shadow: 0 14px 40px rgba(83, 20, 255,0.45);
  }
  /* Bold filled CTA panel (TFSE-style colour block) */
  .cta-panel {
    position: relative; z-index: 2; overflow: hidden;
    border-radius: 32px;
    padding: 88px 48px;
    text-align: center;
    background:
      radial-gradient(circle at 20% 0%, rgba(167,139,250,0.5) 0%, transparent 55%),
      linear-gradient(135deg, #5314FF 0%, #3A0FB0 100%);
  }
  .cta-panel h2, .cta-panel p { color: #fff; }
  .cta-panel h2 em { color: #fff; font-style: italic; opacity: 0.85; }
  .cta-panel p { opacity: 0.85; }
  .cta-badge {
    display: inline-block; margin-bottom: 22px;
    padding: 7px 16px; border-radius: 999px;
    background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.25);
    color: #fff; font-size: 12px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  }
  .btn-on-violet {
    display: inline-block; margin-top: 8px;
    padding: 16px 32px; border-radius: 999px;
    background: #fff; color: var(--copper-deep);
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: 16px;
    text-decoration: none; transition: all 0.2s;
  }
  .btn-on-violet:hover { transform: translateY(-2px); box-shadow: 0 16px 44px rgba(18,4,54,0.08); }
  .cta-section::before { display: none; }
  @media (max-width: 700px) { .cta-panel { padding: 56px 24px; border-radius: 24px; } }

  /* Offer card — apply-to-learn-more (no price) */
  .offer-price-headline {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 700; font-size: clamp(24px, 2.4vw, 28px); letter-spacing: -0.02em;
    line-height: 1.15; text-wrap: balance; max-width: 18ch;
    margin-left: auto; margin-right: auto; margin-bottom: 12px;
  }
  .offer-price-headline em { font-style: italic; color: var(--accent-ink); }
  .offer-price-text {
    font-size: 15px; color: var(--ink-muted); line-height: 1.6;
    margin-bottom: 24px;
  }

  /* Legal disclaimers / micro-notes */
  .site-legal {
    margin-top: 8px;
    padding-top: 28px;
    border-top: 1px solid var(--line);
  }
  .site-legal::before {
    content: 'Disclaimer';
    display: block;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--accent-ink);
    margin-bottom: 10px;
  }
  .site-legal p {
    max-width: 1000px;
    font-size: 13px;
    line-height: 1.65;
    color: var(--ink-muted);
  }
  .micro-note { display: inline-block; margin-top: 6px; font-size: 10px; color: var(--ink-dim); letter-spacing: 0; text-transform: none; opacity: 0.9; }
  .hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  .modal-fineprint { margin-top: 12px; font-size: 11px; line-height: 1.5; color: var(--ink-dim); text-align: center; }
  .modal-fineprint a { color: #A78BFF; text-decoration: underline; text-underline-offset: 2px; }
  .modal-fineprint a:hover { color: #C4B2FF; }

  /* === PROGRAM PAGE HERO === */
  .program-hero {
    padding: 150px 0 50px;
    position: relative;
    z-index: 2;
    text-align: center;
  }
  .program-hero .hero-eyebrow { margin-left: auto; margin-right: auto; }
  .program-hero h1 {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 700;
    font-size: clamp(40px, 6vw, 76px);
    line-height: 1;
    letter-spacing: -0.03em;
    margin: 8px 0 20px;
  }
  .program-hero h1 .accent { color: var(--accent-ink); font-style: italic; font-weight: 700; }
  .program-hero .hero-sub { margin: 0 auto 28px; max-width: 640px; }
  @media (max-width: 900px) { .program-hero { padding: 120px 0 40px; } }

  /* === TABS (Who It's For / Is This You) === */
  .tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 auto 48px;
  }
  .tab {
    padding: 11px 26px;
    border-radius: 999px;
    border: 1px solid var(--line-bright);
    background: transparent;
    color: var(--ink-muted);
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
  }
  .tab:hover { color: var(--ink); border-color: var(--copper); }
  .tab.active {
    background: var(--copper);
    border-color: var(--copper);
    color: #fff;
    box-shadow: 0 8px 24px rgba(83, 20, 255, 0.3);
  }
  .tab-panel { display: none; }
  .tab-panel.active { display: block; animation: tabIn 0.4s ease; }
  @keyframes tabIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

  /* === STICKY APPLY BAR (follows, breaks off at CTA) === */
  .apply-bar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    padding: 14px 24px;
    background: rgba(250, 250, 250, 0.92);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid var(--line-bright);
    transform: translateY(0);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .apply-bar.hidden { transform: translateY(110%); }
  .apply-bar-text { font-size: 14px; color: var(--ink); }
  .apply-bar-text strong { color: var(--accent-ink); font-weight: 700; }
  .apply-bar-cta {
    flex-shrink: 0;
    padding: 10px 24px;
    border-radius: 999px;
    background: var(--copper);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(83, 20, 255, 0.35);
    transition: background 0.2s;
  }
  .apply-bar-cta:hover { background: var(--copper-bright); }
  @media (max-width: 600px) {
    .apply-bar-sub { display: none; }
    .apply-bar { padding: 10px 14px; gap: 12px; }
  }

  .stats-note {
    text-align: center;
    margin-top: 4px;
    margin-bottom: 40px;
    font-size: 11px;
    color: var(--ink-dim);
    letter-spacing: 0.3px;
  }

  /* Founder photo (About) */
  .about-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.53) translate(-3%, -7%) rotate(0deg);
    transform-origin: center;
    z-index: 2;
    border-radius: inherit;
  }

  /* === Ben intro video placeholder === */
  .video-band { padding: 20px 0 110px; position: relative; z-index: 2; }
  .video-ph {
    max-width: 289px;
    margin: 0 auto;
    aspect-ratio: 1/1;
    border: 1px solid var(--line-bright);
    border-radius: 22px;
    background:
      radial-gradient(circle at 50% 40%, rgba(83,20,255,0.18) 0%, transparent 60%),
      linear-gradient(135deg, #F4F3F8 0%, #ECEAF6 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    cursor: pointer;
    transition: border-color 0.2s, transform 0.2s;
  }
  .video-ph:hover { border-color: var(--copper); transform: translateY(-2px); }
  .video-ph-play {
    width: 72px; height: 72px; border-radius: 50%;
    background: var(--copper); color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 12px 36px rgba(83,20,255,0.45);
  }
  .video-ph-play svg { width: 28px; height: 28px; margin-left: 3px; }
  .video-ph-label { font-size: 14px; color: var(--ink-muted); letter-spacing: 0.3px; }

  /* === Hero big promise + asterisk === */
  .hero-promise {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 700;
    font-size: clamp(26px, 3.4vw, 40px);
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
    max-width: 620px;
  }
  .hero-promise em {
    color: var(--accent-ink);
    font-style: normal;
    background: linear-gradient(110deg, #7A4DFF 0%, #5314FF 60%, #8B6BFF 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
  }
  .hero-star { color: var(--accent-ink); font-size: 0.5em; vertical-align: super; margin-left: 2px; }
  .hero-note {
    font-size: 12px;
    line-height: 1.5;
    color: var(--ink-dim);
    max-width: 540px;
    margin-top: 18px;
  }

  /* === Hero headline (promise) + Ben credibility chips === */
  .hero-headline {
    line-height: 1.1;
    letter-spacing: -0.025em;
    max-width: min(48ch, 100%); /* widest line; container caps it so longest still fits 2 lines */
    min-height: 2.2em;          /* reserve exactly 2 lines so swaps don't shift layout */
  }
  /* Lock hero column + stats to a fixed width so changing headline width
     never reflows the stats bar below it. */
  .hero { padding-bottom: 10px !important; }
  .hero .container { width: 100% !important; }
  .hero .hero-grid { width: 100% !important; grid-template-columns: 1fr !important; }
  .hero .hero-grid > div { width: 100% !important; }
  .hero .hero-proof, .stat-bar .hero-proof { width: 100% !important; max-width: 900px; margin-left: auto; margin-right: auto; }
  .hero .stats-grid, .stat-bar .stats-grid { width: 100% !important; grid-template-columns: repeat(6, 1fr) !important; }
  @media (max-width: 900px) { .hero .stats-grid, .stat-bar .stats-grid { grid-template-columns: 1fr 1fr 1fr !important; } }
  @media (max-width: 560px) { .hero .stats-grid, .stat-bar .stats-grid { grid-template-columns: 1fr 1fr !important; } }
  .stat-bar { padding: 4px 0 34px; }
  .cta-investment {
    margin-top: 14px;
    font-size: clamp(13px, 1.5vw, 16px);
    opacity: .82;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }
  .cta-investment strong { white-space: nowrap; }
  @media (max-width: 680px) { .cta-investment strong { white-space: normal; } }
  /* ---- per-word reveal (rotating headline) ---- */
  .hero-headline .hl-word {
    display: inline-block;
    vertical-align: top;
  }
  .hero-headline .hl-word > i {
    display: inline-block;
    font-style: normal;
    opacity: 0;
    filter: blur(12px);
    transition: opacity .6s ease, filter .6s ease;
    will-change: opacity, filter;
  }
  .hero-headline.hl-in .hl-word > i {
    opacity: 1;
    filter: blur(0);
  }
  /* leaving: blur back out, faster */
  .hero-headline.hl-out .hl-word > i {
    opacity: 0;
    filter: blur(12px);
    transition: opacity .38s ease, filter .38s ease;
  }
  /* emphasized words keep the purple gradient */
  .hero-headline .hl-word > i.em {
    background: linear-gradient(110deg, #7A4DFF 0%, #5314FF 55%, #8B6BFF 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
  }
  @media (prefers-reduced-motion: reduce) {
    .hero-headline .hl-word { overflow: visible; }
    .hero-headline .hl-word > i { transform: none; filter: none; transition: opacity .25s linear; }
  }
  .hero-cred { margin-bottom: 36px; }
  .hero-cred-by { font-size: 16px; color: var(--ink-muted); margin-bottom: 14px; }
  .hero-cred-by strong { color: var(--ink); font-weight: 700; }
  .hero-cred-chips { display: flex; flex-wrap: wrap; gap: 10px; }
  .cred-chip {
    display: inline-block;
    padding: 7px 14px;
    border-radius: 999px;
    background: var(--copper-soft);
    border: 1px solid rgba(83, 20, 255, 0.28);
    font-size: 13px;
    color: var(--ink-muted);
  }
  .cred-chip strong { color: var(--accent-ink); font-weight: 700; margin-right: 4px; }

  /* Hero credibility byline (avatar + line) */
  .hero-cred { display: flex; align-items: center; gap: 14px; }
  .hero-cred-avatar {
    width: 52px; height: 52px; border-radius: 50%;
    object-fit: cover; object-position: center 18%;
    border: 2px solid var(--line-bright); flex-shrink: 0;
  }
  .hero-cred-by { margin-bottom: 0; font-size: 15px; }
  .hero-cred-line { font-size: 13px; color: var(--ink-dim); margin-top: 3px; }

  /* Hero credibility byline v2 (clean text) */
  .hero-cred { display: block; }
  .hero-cred-by { font-size: 16px; margin-bottom: 6px; }
  .hero-cred-line { font-size: 15px; color: var(--ink-muted); margin-top: 0; line-height: 1.5; }
  .hero-cred-line em { color: var(--accent-ink); font-style: normal; font-weight: 700; }

  .hero-cred-by { line-height: 1.5; max-width: 540px; }
  .hero-cred-by em { color: var(--accent-ink); font-style: normal; font-weight: 700; }

  .hero-tagline {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 19px; font-weight: 700;
    color: var(--ink); margin: 22px 0 40px;
    letter-spacing: -0.01em;
  }
  .hero-tagline em { color: var(--accent-ink); font-style: normal; }
  .hero-cred { margin-bottom: 0; }

  .hero-sub em { color: var(--accent-ink); font-style: italic; font-weight: 600; }

  .hero-sub { color: var(--ink); }

  /* === Full-width hero + horizontal trajectory === */
  .hero-grid { display: block; }
  .hero-grid > div { max-width: 840px; }
  .hero { padding-bottom: 20px; }

  .trajectory { padding: 8px 0 72px; position: relative; z-index: 2; }
  .trajectory-label { display: block; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--accent-ink); font-weight: 700; margin-bottom: 10px; }
  .trajectory-head h3 { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: clamp(24px, 3vw, 34px); letter-spacing: -0.01em; margin-bottom: 36px; }
  .trajectory-head h3 em { color: var(--accent-ink); font-style: italic; }
  .trajectory-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; position: relative; }
  .trajectory-row::before { content: ''; position: absolute; top: 7px; left: 7px; right: 7px; height: 2px; background: linear-gradient(90deg, var(--copper), var(--copper-bright)); opacity: 0.45; }
  .traj-step { position: relative; padding-top: 30px; }
  .traj-dot { position: absolute; top: 0; left: 0; width: 15px; height: 15px; border-radius: 50%; background: var(--copper); box-shadow: 0 0 0 4px rgba(83,20,255,0.15); }
  .traj-role { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: 20px; margin-bottom: 3px; }
  .traj-salary { color: var(--accent-ink); font-weight: 600; font-size: 14px; margin-bottom: 2px; }
  .traj-detail { font-size: 12px; color: var(--ink-dim); }
  .trajectory-foot { margin-top: 34px; font-size: 11px; color: var(--ink-dim); letter-spacing: 0.3px; }
  @media (max-width: 760px) {
    .trajectory-row { grid-template-columns: 1fr 1fr; gap: 30px 20px; }
    .trajectory-row::before { display: none; }
  }

  /* Hero: use full width, bigger headline */
  .hero-grid > div { max-width: 100%; }
  .hero-headline { font-size: clamp(26px, 2.8vw, 40px); }
  .hero-sub, .hero-cred-by, .hero-tagline { max-width: 1040px; }

  /* Center the hero */
  .hero-grid > div { text-align: center; }
  .hero-sub, .hero-cred-by, .hero-tagline { margin-left: auto; margin-right: auto; }
  .hero-ctas { justify-content: center; }

  /* Tighten the hero (less busy) */
  .hero { padding-top: 130px; }
  .hero-headline { margin-bottom: 20px; }
  .hero-sub { margin-bottom: 20px; }
  .hero-cred { margin-bottom: 32px; }

  /* Hero fills the viewport; trajectory sits below the fold on any screen */
  .hero {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 100px;
    padding-bottom: 56px;
  }

  /* Trajectory: standout panel + plainer labels */
  .trajectory { padding: 88px 0; }
  .trajectory-head h3 { margin-bottom: 8px; }
  .trajectory-sub { font-size: 15px; color: var(--ink-muted); }
  .trajectory-row {
    background: var(--bg-elevated);
    border: 1px solid var(--line-bright);
    border-radius: 20px;
    padding: 44px 44px 40px;
    margin-top: 32px;
  }
  .trajectory-row::before { top: 52px; left: 52px; right: 52px; opacity: 0.5; }
  .traj-step { padding-top: 30px; }
  .traj-dot { width: 16px; height: 16px; box-shadow: 0 0 0 5px rgba(83, 20, 255, 0.18); }
  .traj-role { font-size: 21px; margin-bottom: 1px; }
  .traj-name { font-size: 12px; color: var(--ink-muted); margin: 0 0 7px; }
  .traj-salary { font-size: 15px; }
  @media (max-width: 760px) {
    .trajectory-row { padding: 30px 24px; }
    .trajectory-row::before { display: none; }
  }

  /* Video embedded in hero (above the buttons) */
  .hero-video { width: 100%; max-width: 540px; margin: 6px auto 30px; }

  /* Hero team photo (replaces the intro video) */
  .hero-photo { width: 100%; max-width: 505px; margin: 10px auto 56px; }
  .hero-photo img {
    display: block; width: 100%; height: auto;
    aspect-ratio: 1280 / 853; object-fit: cover;
    border-radius: 18px;
    box-shadow: 0 24px 60px -22px rgba(18, 4, 54, 0.45);
  }
  .hero { padding-top: 92px; padding-bottom: 44px; }

  .hero-sub strong { color: var(--ink); font-weight: 700; }

  .trajectory-foot { text-align: center; color: var(--ink); }

  .trajectory-foot { font-size: 14px; line-height: 1.6; margin-top: 40px; }

  .stats-note { font-size: 14px; line-height: 1.6; color: var(--ink); }

  /* Fix offer price block */
  .offer-price-amount span { display: none; }
  .offer-price-plans { font-size: 14px; color: var(--ink-muted); margin: 4px 0 6px; }

  /* Bigger section eyebrow labels */
  .section-eyebrow, .career-bet-eyebrow, .trajectory-label, .about-content .eyebrow {
    font-size: 14.5px;
  }

  /* Justify the legal disclaimer */
  .site-legal p { text-align: justify; }

  .hero-sub { font-size: 21px; line-height: 1.5; }

  /* Desktop: widen + shrink so the long sub-headline lands on 2 lines */
  .hero-sub { font-size: 17px; line-height: 1.55; max-width: 1180px; }

  /* === Cookie consent banner === */
  .consent {
    position: fixed;
    left: 20px;
    bottom: 20px;
    z-index: 120;
    max-width: 380px;
    background: var(--bg-card);
    border: 1px solid var(--line-bright);
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 14px 40px rgba(18,4,54,0.12);
  }
  .consent[hidden] { display: none; }
  /* consent decided before first paint (inline head script) -> no pop-in flash */
  html.consent-done .consent { display: none; }
  .consent-text {
    font-size: 13px;
    line-height: 1.55;
    color: var(--ink-muted);
    margin: 0 0 12px;
  }
  .consent-text a { color: var(--accent-ink); }
  .consent-actions { display: flex; gap: 10px; justify-content: flex-end; }
  .consent-btn {
    font-family: 'Radio Canada Big', sans-serif;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 999px;
    cursor: pointer;
    border: 1px solid var(--line-bright);
    transition: all 0.2s;
  }
  .consent-btn.decline { background: transparent; color: var(--ink-muted); }
  .consent-btn.decline:hover { color: var(--ink); border-color: var(--ink-dim); }
  .consent-btn.accept { background: var(--copper); color: #fff; border-color: var(--copper); }
  .consent-btn.accept:hover { background: var(--copper-bright); border-color: var(--copper-bright); }
  @media (max-width: 600px) {
    .consent { left: 12px; right: 12px; bottom: 12px; max-width: none; }
  }

  /* === Credibility logo/wordmark strip === */
  .logos {
    padding: 56px 0;
    border-top: 1px solid var(--line);
  }
  .logos-label {
    text-align: center;
    font-size: 12.5px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--ink);
    margin: 0 0 30px;
  }
  .logo-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px 36px;
    max-width: 1000px;
    margin: 0 auto;
  }
  .logo-chip {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--ink-muted);
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 600;
    font-size: 17px;
    letter-spacing: -0.01em;
    opacity: 0.72;
    transition: opacity 0.2s, color 0.2s;
  }
  .logo-chip svg { width: 18px; height: 18px; color: var(--accent-ink); flex-shrink: 0; }
  .logo-chip:hover { opacity: 1; color: var(--ink); }
  @media (max-width: 600px) {
    .logos { padding: 44px 0; }
    .logo-strip { gap: 14px 22px; }
    .logo-chip { font-size: 15px; }
    .logo-chip svg { width: 16px; height: 16px; }
  }

  /* === Logo strip as monochrome images === */
  .logo-chip { opacity: 1; gap: 0; }
  .logo-img {
    display: block;
    height: 28px;
    width: auto;
    max-width: 150px;
    object-fit: contain;
    filter: grayscale(1) brightness(0) invert(1);
    opacity: 0.7;
    transition: opacity 0.2s;
  }
  .logo-chip:hover .logo-img { opacity: 1; }
  .logo-name { display: none; }
  .logo-chip.failed .logo-img { display: none; }
  .logo-chip.failed .logo-name { display: inline; opacity: 0.72; }
  @media (max-width: 600px) { .logo-img { height: 22px; max-width: 120px; } }

  /* small links keep the readable violet */
  .nav-links > a:not(.btn-cta).active { color: var(--link-ink); }
  .consent-text a { color: var(--link-ink); }

  /* === Nav LinkedIn icon === */
  .nav-linkedin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ink-muted);
    transition: color 0.2s, transform 0.2s;
  }
  .nav-linkedin svg { width: 20px; height: 20px; }
  .nav-linkedin:hover { color: var(--accent-ink); transform: translateY(-1px); }

  /* === Stats: skip-to-about button === */
  .stats-cta { text-align: center; margin-top: 32px; }


  /* === Privacy / legal page (moved from inline <style> for strict CSP) ===*/

  .legal-wrap { max-width: 760px; margin: 0 auto; padding: 120px 24px 100px; }
  .legal-back { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ink-muted); text-decoration: none; margin-bottom: 40px; transition: color .2s; }
  .legal-back:hover { color: var(--copper); }
  .legal-wrap h1 { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: clamp(32px, 5vw, 48px); letter-spacing: -0.02em; margin: 0 0 10px; }
  .legal-meta { color: var(--ink-dim); font-size: 14px; margin-bottom: 48px; }
  .legal-wrap h2 { font-family: 'Radio Canada Big', sans-serif; font-weight: 600; font-size: 22px; letter-spacing: -0.01em; margin: 40px 0 12px; }
  .legal-wrap p, .legal-wrap li { font-size: 16px; line-height: 1.7; color: var(--ink-muted); }
  .legal-wrap ul { padding-left: 22px; margin: 12px 0; }
  .legal-wrap li { margin-bottom: 8px; }
  .legal-wrap a { color: #A78BFF; text-underline-offset: 2px; }
  .legal-wrap strong { color: var(--ink); font-weight: 600; }
  .legal-foot { margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-dim); }
  .is-hidden { display: none; }

  /* === Restructured hero: header → video → proof strip → CTAs (all in view) === */
  .hero { min-height: auto; padding-top: 104px; padding-bottom: 52px; justify-content: flex-start; }
  .hero-headline { font-size: clamp(24px, 3.2vw, 44px); margin-bottom: 14px; }
  .hero-sub { font-size: 15px; line-height: 1.5; margin-bottom: 22px; max-width: 720px; padding: 13px 16px; border-radius: 13px; }
  .hero-video { max-width: 460px; margin: 4px auto 22px; }
  .hero-proof {
    max-width: 920px;
    margin: 8px auto 26px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 18px 0;
  }
  .hero-proof .stat { padding: 10px; }
  .hero-proof .stat-icon { width: 20px; height: 20px; margin: 0 auto 6px; }
  .hero-proof .stat-number { font-size: 30px; }
  .hero-proof .stat-label { font-size: 12px; }
  .hero-ctas { justify-content: center; }
  @media (max-width: 600px) {
    .hero-proof { padding: 8px 0; margin: 4px auto 20px; }
    .hero-proof .stat-number { font-size: 22px; }
    .hero-proof .stat { padding: 14px 8px; }
  }

  /* === Cohort start stamp (static, lower-right) === */
  .cohort-stamp {
    position: fixed;
    right: 22px;
    bottom: 90px;
    z-index: 80;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    background: #ffffff;
    border: 1.5px solid var(--ink);
    border-radius: 14px;
    padding: 12px 22px;
    text-align: center;
    font-family: 'Radio Canada Big', sans-serif;
    box-shadow: 0 12px 32px rgba(18,4,54,0.10);
    transform: rotate(-3deg) scale(1.15);
    transform-origin: bottom right;
    user-select: none;
  }
  .cohort-stamp-kicker { font-size: 9px; letter-spacing: 2.5px; text-transform: uppercase; font-weight: 700; color: var(--copper); }
  .cohort-stamp-date { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: 19px; letter-spacing: -0.01em; color: var(--ink); }
  .cohort-stamp-sub { font-size: 10px; letter-spacing: 0.4px; color: #5a5f6b; }
  @media (max-width: 600px) {
    .cohort-stamp { right: 12px; bottom: 80px; padding: 10px 16px; }
    .cohort-stamp-date { font-size: 16px; }
  }

  /* === Social proof: company names (text only) === */
  .proof {
    padding: 84px 0;
    border-top: 1px solid var(--line);
    text-align: center;
  }
  .proof .section-eyebrow { margin-bottom: 14px; }
  .proof-heading {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 600;
    font-size: clamp(22px, 3vw, 32px);
    letter-spacing: -0.015em;
    color: var(--ink);
    margin: 0 auto 30px;
    max-width: 760px;
  }
  .proof-names {
    font-family: 'Radio Canada Big', sans-serif;
    font-weight: 500;
    font-size: clamp(16px, 1.9vw, 20px);
    line-height: 2;
    color: var(--ink-muted);
    max-width: 920px;
    margin: 0 auto 26px;
  }
  .proof-disclaimer {
    font-size: 0.8rem;
    line-height: 1.6;
    color: var(--ink-dim);
    max-width: 720px;
    margin: 0 auto;
  }

  /* Testimonial author link */
  .testimonial-author-name a { color: inherit; text-decoration: none; transition: color 0.2s; }
  .testimonial-author-name a:hover { color: var(--link-ink); text-decoration: underline; text-underline-offset: 2px; }

  /* Testimonial avatar photo */
  .testimonial-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }

  /* Testimonial LinkedIn icon */
  .testimonial-author-name { display: inline-flex; align-items: center; gap: 7px; }
  .ta-linkedin { display: inline-flex; color: var(--ink-dim); transition: color 0.2s; }
  .ta-linkedin svg { width: 15px; height: 15px; }
  .ta-linkedin:hover { color: #0A66C2; }

  /* === Testimonials: auto-sliding horizontal continuum === */
  .tslider {
    overflow: hidden;
    padding: 10px 0 6px;
    margin-top: 6px;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
  }
  .tslider-track {
    display: flex;
    align-items: stretch;
    gap: 24px;
    width: max-content;
    padding: 0 24px;
  }
  .tslider-track.run { animation: tscroll 55s linear infinite; }
  .tslider-track.row2 { margin-top: 24px; }
  .tslider-track.row2.run { animation-duration: 48s; animation-direction: reverse; }
  .tslider:hover .tslider-track.run,
  .tslider:focus-within .tslider-track.run { animation-play-state: paused; }
  .tslider .testimonial { flex: 0 0 360px; width: 360px; margin: 0; }
  @keyframes tscroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }
  .testimonial-stars {
    margin-top: 16px;
    color: #FFC53D;
    font-size: 15px;
    letter-spacing: 3px;
    line-height: 1;
  }
  @media (max-width: 600px) {
    .tslider .testimonial { flex-basis: 290px; width: 290px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .tslider { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .tslider-track { animation: none; }
  }

  /* === Testimonials: mosaic (masonry by length) === */
  .mosaic {
    column-count: 3;
    column-gap: 22px;
    max-width: 1120px;
    margin: 10px auto 0;
    padding: 0 24px;
  }
  .mosaic .testimonial {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    display: inline-block;
    width: 100%;
    margin: 0 0 22px;
  }
  @media (max-width: 1000px) { .mosaic { column-count: 2; max-width: 760px; } }
  @media (max-width: 640px)  { .mosaic { column-count: 1; max-width: 480px; } }

  /* === Mosaic: tighter, 4-up === */
  .mosaic { column-count: 4; column-gap: 16px; max-width: 1340px; }
  .mosaic .testimonial { padding: 18px 18px; margin: 0 0 16px; border-radius: 10px; }
  .mosaic .testimonial-mark { font-size: 32px; margin-bottom: 0; }
  .mosaic .testimonial-quote { font-size: 13px; line-height: 1.5; margin-bottom: 14px; }
  .mosaic .testimonial-avatar { width: 34px; height: 34px; }
  .mosaic .testimonial-author-name { font-size: 12.5px; gap: 5px; }
  .mosaic .ta-linkedin svg { width: 13px; height: 13px; }
  .mosaic .testimonial-stars { font-size: 12px; margin-top: 10px; letter-spacing: 2px; }
  @media (max-width: 1200px) { .mosaic { column-count: 3; max-width: 1000px; } }
  @media (max-width: 900px)  { .mosaic { column-count: 2; max-width: 720px; } }
  @media (max-width: 600px)  { .mosaic { column-count: 1; max-width: 460px; } }

  /* Mosaic disclaimer note */
  .mosaic-note { text-align: center; font-size: 13px; color: var(--ink-dim); margin: 28px auto 0; max-width: 640px; padding: 0 24px; }

  /* Stars at top of each card */
  .testimonial-stars { margin: 0 0 14px; }
  .mosaic .testimonial-stars { margin: 0 0 12px; }

  /* === Mosaic as flex grid (cards flow in order, no separate pinned row) === */
  .mosaic { column-count: auto !important; display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
  .mosaic .testimonial { display: flex; flex-direction: column; width: auto; flex: 0 0 calc(25% - 12px); margin: 0; break-inside: auto; }
  @media (max-width: 1200px) { .mosaic .testimonial { flex-basis: calc(33.333% - 11px); } }
  @media (max-width: 900px)  { .mosaic .testimonial { flex-basis: calc(50% - 8px); } }
  @media (max-width: 600px)  { .mosaic { flex-direction: column; } .mosaic .testimonial { flex-basis: auto; } }

  /* === Mosaic: collapse to ~2 rows with fade + Show more === */
  .mosaic-wrap { position: relative; max-height: 540px; overflow: hidden; transition: max-height 0.45s ease; }
  .mosaic-wrap.expanded { max-height: 6000px; }
  /* Frosted "show more" overlay sitting on the partial next row */
  .mosaic-fade {
    position: absolute; left: 0; right: 0; bottom: 0; height: 180px;
    display: flex; align-items: flex-end; justify-content: center;
    padding-bottom: 18px;
    border: none; cursor: pointer;
    background: linear-gradient(to bottom, rgba(250,250,250,0) 0%, rgba(250,250,250,0.72) 58%, var(--bg) 100%);
    -webkit-backdrop-filter: blur(2.5px); backdrop-filter: blur(2.5px);
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 42%);
    mask-image: linear-gradient(to bottom, transparent 0%, #000 42%);
    transition: opacity 0.3s;
  }
  .mosaic-fade-pill {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.06);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border: 1px solid var(--line-bright); color: var(--ink);
    padding: 9px 22px; border-radius: 999px;
    font-family: 'Radio Canada Big', sans-serif; font-size: 14px; font-weight: 600;
    transition: all 0.2s;
  }
  .mosaic-fade:hover .mosaic-fade-pill { border-color: var(--copper); color: var(--link-ink); }
  .mosaic-fade svg { width: 15px; height: 15px; }
  .mosaic-wrap.expanded .mosaic-fade { display: none; }
  .mosaic-less {
    display: flex; align-items: center; gap: 8px;
    margin: 20px auto 0;
    background: transparent; border: 1px solid var(--line-bright);
    color: var(--ink); padding: 9px 22px; border-radius: 999px;
    font-family: 'Radio Canada Big', sans-serif; font-size: 14px; font-weight: 600;
    cursor: pointer; transition: all 0.2s;
  }
  .mosaic-less[hidden] { display: none; }
  .mosaic-less:hover { border-color: var(--copper); color: var(--link-ink); }
  .mosaic-less svg { width: 15px; height: 15px; }
  @media (max-width: 900px) { .mosaic-wrap { max-height: 640px; } }
  @media (max-width: 600px) { .mosaic-wrap { max-height: 560px; } }

  /* Tighten gap under the testimonials disclaimer */
  .testimonials { padding-bottom: 44px; }

  /* Hide the floating cohort stamp on mobile (it overlaps content) */
  @media (max-width: 700px) { .cohort-stamp { display: none; } }

  /* Mobile: justified legal text creates ugly gaps in a narrow column */
  @media (max-width: 600px) {
    .site-legal p { text-align: left; }
    .consent { bottom: 12px; }
  }

  /* === Shareable section anchors === */
  .anchor-link {
    margin-left: 10px;
    font-weight: 400;
    color: var(--ink-dim);
    text-decoration: none;
    opacity: 0;
    transition: opacity 0.2s, color 0.2s;
    cursor: pointer;
  }
  .section-title:hover .anchor-link,
  .about-content h2:hover .anchor-link,
  .cta-section h2:hover .anchor-link,
  .anchor-link:focus { opacity: 1; }
  .anchor-link:hover { color: var(--link-ink); }
  @media (hover: none) { .anchor-link { opacity: 0.35; } }

  /* Mobile: backdrop-filter on the fixed modal overlay can render blank on iOS Safari.
     Use a solid backdrop instead, and tighten padding for small screens. */
  @media (max-width: 700px) {
    .modal-overlay {
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      background: rgba(6, 7, 10, 0.94);
      padding: 14px;
    }
    /* iOS Safari blanks modal content when ancestor has backdrop-filter or a
       transform-based open animation. Disable both on mobile. */
    .modal {
      padding: 26px 20px; border-radius: 18px; max-height: 92vh;
      transform: none !important;
      transition: none;
    }
    .modal-overlay.open .modal { transform: none !important; }
    .modal h3 { font-size: 26px; }
  }

  /* === Fit quiz === */
  .fit-quiz { padding: 100px 0; border-top: 1px solid var(--line); }
  .quiz { max-width: 560px; margin: 44px auto 0; }
  .quiz-card {
    background: var(--bg-elevated);
    border: 1px solid var(--line-bright);
    border-radius: 22px;
    padding: 36px 32px;
  }
  .quiz-top {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 18px;
  }
  .quiz-progress {
    font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase;
    color: var(--ink-dim); font-weight: 600;
  }
  .quiz-back {
    background: transparent; border: none; color: var(--ink-muted);
    font-family: inherit; font-size: 13px; cursor: pointer; padding: 4px 2px;
    transition: color 0.2s;
  }
  .quiz-back:hover:not(:disabled) { color: var(--ink); }
  .quiz-back:disabled { opacity: 0.3; cursor: default; }
  .quiz-bar { height: 3px; border-radius: 3px; background: var(--line); overflow: hidden; margin-bottom: 24px; }
  .quiz-bar > i { display: block; height: 100%; background: var(--copper); transition: width 0.3s ease; }
  .quiz-q {
    font-family: 'Radio Canada Big', sans-serif; font-weight: 600;
    font-size: clamp(20px, 3vw, 25px); line-height: 1.3; letter-spacing: -0.01em;
    margin: 0 0 24px;
  }
  .quiz-answers { display: flex; flex-direction: column; gap: 12px; }
  .quiz-answer {
    width: 100%; text-align: left;
    padding: 16px 18px; border-radius: 14px;
    background: var(--bg-card); border: 1px solid var(--line);
    color: var(--ink); font-family: inherit; font-size: 15px; line-height: 1.4;
    cursor: pointer; transition: border-color 0.15s, background 0.15s, transform 0.1s;
  }
  .quiz-answer:hover { border-color: var(--copper); background: var(--bg-card-hover); }
  .quiz-answer:focus-visible { outline: 2px solid var(--copper); outline-offset: 2px; }
  .quiz-answer:active { transform: scale(0.99); }

  /* Result screen — visually distinct */
  .quiz-result {
    background: linear-gradient(135deg, rgba(83,20,255,0.10), var(--bg-elevated) 60%);
    border: 1px solid var(--line-bright);
    border-left: 4px solid var(--copper);
    border-radius: 22px;
    padding: 38px 34px;
  }
  .quiz-result-kicker {
    font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase;
    color: var(--accent-ink); font-weight: 700; margin-bottom: 14px;
  }
  .quiz-result-title {
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: clamp(23px, 3.4vw, 30px); line-height: 1.2; letter-spacing: -0.02em;
    margin: 0 0 16px;
  }
  .quiz-result p { font-size: 15.5px; line-height: 1.65; color: var(--ink-muted); margin: 0 0 14px; }
  .quiz-result-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
  .quiz-email {
    display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap;
  }
  .quiz-email[hidden] { display: none; }
  .quiz-email input {
    flex: 1; min-width: 200px;
    padding: 13px 16px; border-radius: 12px;
    background: var(--bg-card); border: 1px solid var(--line-bright);
    color: var(--ink); font-family: inherit; font-size: 15px;
  }
  .quiz-email input:focus { outline: none; border-color: var(--copper); }
  .quiz-email button { white-space: nowrap; }
  .quiz-confirm { margin-top: 16px; color: #29d17a; font-size: 15px; font-weight: 600; }
  .quiz-confirm[hidden] { display: none; }
  @media (max-width: 600px) {
    .fit-quiz { padding: 80px 0; }
    .quiz-card, .quiz-result { padding: 26px 20px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .quiz-answer, .quiz-bar > i { transition: none; }
  }

  /* Anchor link icon (no literal # in copy) */
  .anchor-link svg { width: 15px; height: 15px; vertical-align: middle; }
  .modal-submit:disabled { cursor: not-allowed; }

  /* Quiz modal + triggers */
  .modal-quiz { max-width: 600px; }
  .quiz-modal-eyebrow { font-size: 12.5px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--accent-ink); font-weight: 700; margin-bottom: 10px; }
  .quiz-modal-title { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: clamp(22px, 3vw, 28px); letter-spacing: -0.02em; margin: 0 0 8px; }
  .quiz-modal-title .accent { color: var(--accent-ink); font-style: italic; }
  .quiz-modal-sub { font-size: 14px; color: var(--ink-muted); line-height: 1.5; margin: 0 0 22px; max-width: 480px; }
  .modal-quiz .quiz { margin: 0; max-width: none; }
  .modal-quiz .quiz-card { background: var(--bg-card); }
  .nav-quiz {
    background: transparent; border: none; cursor: pointer;
    color: var(--ink-muted); font-family: inherit; font-size: 14px; font-weight: 500;
    padding: 0; transition: color 0.2s;
  }
  .nav-quiz:hover { color: var(--ink); }

  /* === Nav dropdown === */
  .nav-dd { position: relative; display: inline-flex; align-items: center; }
  .nav-dd-toggle {
    background: transparent; border: none; cursor: pointer;
    color: var(--ink-muted); font-family: inherit; font-size: 14px; font-weight: 500;
    display: inline-flex; align-items: center; gap: 5px; padding: 0;
    transition: color 0.2s;
  }
  .nav-dd-toggle:hover { color: var(--ink); }
  .nav-dd-toggle.active { color: var(--link-ink); }
  .nav-dd-toggle svg { width: 13px; height: 13px; transition: transform 0.25s; }
  .nav-dd:hover .nav-dd-toggle svg, .nav-dd.open .nav-dd-toggle svg { transform: rotate(180deg); }
  .nav-dd-menu {
    position: absolute; top: calc(100% + 14px); left: 50%;
    transform: translateX(-50%) translateY(-6px);
    min-width: 188px;
    background: var(--bg-elevated); border: 1px solid var(--line-bright);
    border-radius: 14px; padding: 8px;
    display: flex; flex-direction: column; gap: 2px;
    box-shadow: 0 18px 50px rgba(18,4,54,0.10);
    opacity: 0; visibility: hidden;
    transition: opacity 0.2s, transform 0.2s;
    z-index: 120;
  }
  .nav-dd-menu::before { content: ''; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
  .nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu, .nav-dd.open .nav-dd-menu {
    opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
  }
  .nav-dd-menu a {
    padding: 10px 14px; border-radius: 10px;
    color: var(--ink-muted); font-size: 14px; text-decoration: none; white-space: nowrap;
    transition: background 0.15s, color 0.15s;
  }
  .nav-dd-menu a:hover { background: var(--bg-card); color: var(--ink); }
  .nav-dd-menu a.active { color: var(--link-ink); }

  /* explicit open state (ungrouped, last word) */
  .nav-dd.open .nav-dd-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
  .nav-dd .nav-dd-menu { pointer-events: none; }
  .nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }

  /* Dropdown: deterministic display toggle (ends opacity/specificity issues) */
  .nav-dd-menu { display: none !important; opacity: 1 !important; visibility: visible !important; transform: translateX(-50%) !important; transition: none !important; }
  .nav-dd:hover > .nav-dd-menu, .nav-dd:focus-within > .nav-dd-menu, .nav-dd.open > .nav-dd-menu { display: flex !important; }
  @media (max-width: 900px) { .nav-dd-menu { transform: none !important; } }

  /* === Hero WebGL shader background === */
  .hero-shader { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; }
  .hero-shader-veil {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(to bottom, rgba(250,250,250,0.55) 0%, rgba(250,250,250,0.62) 40%, rgba(250, 250, 250, 0.82) 100%);
  }
  .hero-fx { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
  .hero-fx canvas { display: block; }
  .hero > .container { position: relative; z-index: 2; }
  .hero::before, .hero::after { z-index: 0; }

  /* Hero content always visible (never gated by JS/observer — shader-safe) */
  .hero .reveal { opacity: 1 !important; transform: none !important; }

  /* === Animated background paths (final CTA) === */
  .cta-panel { position: relative; overflow: hidden; }
  .cta-paths { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.5; }
  .cta-paths svg { width: 100%; height: 100%; display: block; }
  .cta-path { fill: none; stroke: #fff; stroke-linecap: round; animation: ctaFlow linear infinite; }
  @keyframes ctaFlow { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -340; } }
  .cta-section-content { position: relative; z-index: 1; }
  @media (prefers-reduced-motion: reduce) { .cta-path { animation: none; } }

  /* Hero subtext readability backdrop */
  .hero-sub {
    color: var(--ink);
    background: linear-gradient(180deg, rgba(255,255,255,0.66), rgba(250,250,250,0.55));
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 16px;
    padding: 18px 24px;
    display: inline-block;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset,
                0 18px 50px -20px rgba(83,20,255,0.45);
  }
  /* Apply-area Skool line */
  /* Free Skool = secondary/quiet so apply leads */
  .cta-skool { margin-top: 22px; font-size: 12px; color: rgba(255,255,255,0.5); }
  .cta-skool a { color: rgba(255,255,255,0.72); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
  .cta-skool a:hover { color: #fff; }
  /* ROI line under the offer */
  .offer-price-roi { font-size: 14px; color: var(--ink-muted); font-weight: 500; margin: 2px 0 18px; }
  .offer-price-roi strong { color: var(--ink); font-weight: 700; }

  /* === CTA aurora shader background === */
  /* Animated gradient CTA background — CSS port of the framer GradientBackground.
     @property lets the color stops tween (you can't transition a linear-gradient directly). */
  @property --cta-c1 { syntax: '<color>'; inherits: false; initial-value: #2d1b69; }
  @property --cta-c2 { syntax: '<color>'; inherits: false; initial-value: #11998e; }
  .cta-gradient {
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: linear-gradient(135deg, var(--cta-c1) 0%, var(--cta-c2) 100%);
    animation: ctaGradient 10s ease-in-out infinite;
  }
  @keyframes ctaGradient {
    0%,   100% { --cta-c1: #2d1b69; --cta-c2: #11998e; }
    20%        { --cta-c1: #8e2de2; --cta-c2: #4a00e0; }
    40%        { --cta-c1: #0f3460; --cta-c2: #e94560; }
    60%        { --cta-c1: #134e5e; --cta-c2: #71b280; }
    80%        { --cta-c1: #2d1b69; --cta-c2: #11998e; }
  }
  @media (prefers-reduced-motion: reduce) { .cta-gradient { animation: none; } }

  .cta-shader { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; }
  .cta-shader-veil {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(8,6,20,0.35) 0%, rgba(8,6,20,0.7) 100%);
  }

  .hero-sub, .hero-sub strong { color: var(--ink); }
  .hero-sub em { color: #5314FF; }

  /* On-brand scrollbars */
  html { scrollbar-color: var(--copper) var(--bg); scrollbar-width: thin; }
  ::-webkit-scrollbar { width: 10px; height: 10px; }
  ::-webkit-scrollbar-track { background: var(--bg); }
  ::-webkit-scrollbar-thumb { background: var(--copper); border-radius: 10px; border: 2px solid var(--bg); }
  ::-webkit-scrollbar-thumb:hover { background: var(--copper-bright); }
  /* No visible scrollbar on apply modal */
  .modal { scrollbar-width: none; }
  .modal::-webkit-scrollbar { display: none; }

  /* === Hero video expand / collapse lightbox === */
  .video-ph {
    transition: top .5s cubic-bezier(.22,1,.36,1),
                left .5s cubic-bezier(.22,1,.36,1),
                width .5s cubic-bezier(.22,1,.36,1),
                height .5s cubic-bezier(.22,1,.36,1),
                border-radius .5s cubic-bezier(.22,1,.36,1),
                box-shadow .5s ease;
  }
  .video-ph-floating {
    z-index: 1200;
    box-sizing: border-box;
    max-width: none !important;
    max-height: none !important;
    min-height: 0 !important;
    border-radius: 20px;
    box-shadow: 0 50px 130px -24px rgba(18,4,54,0.16), 0 0 0 1px rgba(18,4,54,0.06);
    cursor: default;
  }
  .video-backdrop {
    position: fixed; inset: 0; z-index: 1100;
    background: rgba(6,7,10,.62);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    opacity: 0; pointer-events: none;
    transition: opacity .45s ease;
  }
  .video-backdrop.show { opacity: 1; pointer-events: auto; }
  body.video-open { overflow: hidden; }
  @media (prefers-reduced-motion: reduce) {
    .video-ph { transition: none; }
    .video-backdrop { transition: none; }
  }

  /* === Hosted video iframe inside the player box === */
  .video-ph { position: relative; overflow: hidden; }
  .video-frame {
    position: absolute; inset: 0; width: 100%; height: 100%; border: 0;
    z-index: 2; background: #000;
  }
  .video-ph.video-has-frame .video-ph-play,
  .video-ph.video-has-frame .video-ph-label { opacity: 0; pointer-events: none; }

  /* Transparent catcher over the inline player — click expands; lifted when open */
  .video-clickcatch {
    position: absolute; inset: 0; z-index: 4;
    background: transparent; border: 0; padding: 0; margin: 0;
    cursor: pointer; width: 100%; height: 100%;
  }

  /* === Hero video lightbox (body-level, blurred backdrop, FLIP grow) === */
  button.video-ph { width: 100%; font: inherit; color: inherit; padding: 0; }
  .video-lightbox {
    position: fixed; inset: 0; z-index: 3000;
    background: rgba(6,7,10,.66);
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
    opacity: 0; pointer-events: none; transition: opacity .45s ease;
  }
  .video-lightbox.show { opacity: 1; pointer-events: auto; }
  .video-lightbox-stage {
    position: fixed; background: #000; border-radius: 18px; overflow: hidden;
    box-shadow: 0 50px 130px -24px rgba(18,4,54,0.16), 0 0 0 1px rgba(18,4,54,0.06);
    transform-origin: top left; will-change: transform;
    /* Grow/shrink via GPU transform — iframe never resizes, so no relayout/buffer hitch */
    transition: transform .5s cubic-bezier(.22,1,.36,1);
  }
  .video-lightbox-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
  @media (prefers-reduced-motion: reduce) {
    .video-lightbox, .video-lightbox-stage { transition: none; }
  }

  /* Persistent video stage: above the blur when expanded, below the nav when docked */
  .video-lightbox-stage { z-index: 3001; }
  .video-lightbox-stage.tracking { transition: none; z-index: 50; }
  .video-expand-btn {
    position: absolute; top: 10px; right: 10px; z-index: 5;
    width: 38px; height: 38px; border: 0; border-radius: 10px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    color: var(--ink); background: rgba(255,255,255,.7);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    box-shadow: 0 4px 14px rgba(18,4,54,0.08);
    opacity: 0; pointer-events: none;
    transition: opacity .2s, background .2s, transform .2s;
  }
  /* Only show the expand button when docked AND hovering the player (or focused) */
  .video-lightbox-stage.tracking:hover .video-expand-btn,
  .video-expand-btn:focus-visible { opacity: 1; pointer-events: auto; }
  .video-expand-btn:hover { background: var(--copper); transform: translateY(-1px); }
  .video-expand-btn svg { width: 18px; height: 18px; }
  .video-ph.stage-active .video-ph-play { display: none; }

  /* Video poster still (Ben) — full width, framed on the face, no zoom */
  .video-ph-img {
    position: absolute; inset: 0; z-index: 0;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center 45%;
    border-radius: inherit;
    filter: blur(3px); transform: scale(1.04);
  }
  .video-ph::after {
    content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit;
    background: radial-gradient(circle at 50% 50%, rgba(8,6,20,.35), rgba(8,6,20,.62));
    pointer-events: none;
  }
  .video-ph .video-ph-play { position: relative; z-index: 2; }

  /* === Compact proof strip (light social-proof accent above the tabs) === */
  .proof-strip { padding: 0 0 30px; background: var(--bg-elevated); }
  .proof-strip-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
  }
  .proof-strip-card {
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 14px 16px 15px;
    display: flex; flex-direction: column;
  }
  .proof-strip-card .testimonial-stars { margin: 0 0 8px; font-size: 12px; letter-spacing: 1.5px; }
  .proof-strip-quote {
    font-size: 13.5px; line-height: 1.5; color: var(--ink);
    margin: 0 0 12px;
  }
  .proof-strip-name {
    display: flex; align-items: center; gap: 6px;
    margin-top: auto; padding-top: 11px; border-top: 1px solid var(--line);
    font-family: 'Radio Canada Big', sans-serif; font-weight: 600;
    font-size: 13px; color: var(--ink);
  }
  .proof-strip-name .ta-linkedin { display: inline-flex; color: var(--ink-muted); }
  .proof-strip-name .ta-linkedin:hover { color: var(--copper); }
  .proof-strip-name .ta-linkedin svg { width: 15px; height: 15px; }

  /* === Two Tracks section (base bg — keeps section alternation) === */
  .tracks { padding: 84px 0; }
  .tracks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px; margin-top: 6px;
  }
  .track-card {
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 28px 28px 30px;
  }
  .track-tag {
    display: inline-block;
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: 13px; letter-spacing: 0.5px; color: var(--accent-ink);
    padding: 6px 14px; border: 1px solid var(--copper); border-radius: 999px;
    margin-bottom: 16px;
  }
  .track-card p { font-size: 15.5px; line-height: 1.6; color: var(--ink-muted); margin: 0; }
  .tracks-foot { text-align: center; margin-top: 24px; font-size: 14px; color: var(--ink-muted); }

  /* Poster still covering the lightbox iframe until the video paints (no black flash) */
  .video-stage-poster {
    position: absolute; inset: 0; z-index: 3;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center 45%;
    filter: blur(3px); transform: scale(1.04);
    transition: opacity .45s ease;
  }
  .video-stage-poster.hide { opacity: 0; pointer-events: none; }

  /* Plain inline video embed (square), kept small in the hero */
  .hero-video .vh-embed { position: relative; width: min(289px, 100%); aspect-ratio: 1 / 1; margin: 0 auto; }
  .vh-embed .vh-target { position: absolute; inset: 0; background: #000; border-radius: 16px; overflow: hidden; }
  .vh-embed .vh-target iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

  /* Small in-flow embed + click-to-lightbox (FLIP grow, no persistent fixed element) */
  .hero-video .vh-embed { position: relative; }
  .vh-embed.vh-floating {
    position: fixed; z-index: 3001; max-width: none; width: auto; margin: 0;
    transform-origin: top left; border-radius: 18px; overflow: hidden;
    box-shadow: 0 50px 130px -24px rgba(18,4,54,0.16), 0 0 0 1px rgba(18,4,54,0.06);
    transition: transform .5s cubic-bezier(.22,1,.36,1);
  }
  /* Click overlay over the TOP of the small video (click to open lightbox).
     Stops short of the bottom so the player's control bar stays clickable. */
  .vh-click { position: absolute; top: 0; left: 0; right: 0; bottom: 46px; z-index: 5; background: transparent; border: 0; padding: 0; margin: 0; cursor: pointer; }
  /* Close button — corner of the enlarged video only */
  .vh-close {
    position: absolute; top: 8px; right: 8px; z-index: 6;
    width: 36px; height: 36px; border: 0; border-radius: 10px; cursor: pointer;
    display: none; align-items: center; justify-content: center; color: var(--ink);
    background: rgba(255,255,255,.7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    box-shadow: 0 4px 14px rgba(18,4,54,0.08); transition: background .2s;
  }
  .vh-close svg { width: 18px; height: 18px; }
  .vh-close:hover { background: var(--copper); }
  .vh-embed.vh-floating .vh-close { display: flex; }

  /* Poster still covering the inline player until the video paints (no load flash) */
  .vh-target .video-load-mask {
    position: absolute; inset: 0; z-index: 2;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center 45%;
    border-radius: 16px;
    transition: opacity .35s ease;
  }
  .vh-target .video-load-mask.hide { opacity: 0; pointer-events: none; }

  /* === CTA apply button: expanding-chevron (port of get-started-button.tsx) === */
  .btn-getstarted {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden; height: 54px; padding: 0 30px; border-radius: 12px;
    background: #fff; color: #0A0B0D; text-decoration: none; cursor: pointer;
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: 16px;
    letter-spacing: -0.01em; box-shadow: 0 14px 34px -10px rgba(18,4,54,0.10);
  }
  .btn-gs-label { margin-right: 44px; transition: opacity .5s ease; }
  .btn-getstarted:hover .btn-gs-label,
  .btn-getstarted:focus-visible .btn-gs-label { opacity: 0; }
  .btn-gs-icon {
    position: absolute; right: 6px; top: 6px; bottom: 6px;
    width: 26%; display: grid; place-items: center; border-radius: 8px;
    background: rgba(83,20,255,.08); color: var(--copper);
    transition: width .5s cubic-bezier(.22,1,.36,1), transform .2s ease, background .3s ease;
  }
  .btn-getstarted:hover .btn-gs-icon,
  .btn-getstarted:focus-visible .btn-gs-icon { width: calc(100% - 12px); background: rgba(83,20,255,.14); }
  .btn-getstarted:active .btn-gs-icon { transform: scale(.96); }
  .btn-gs-icon svg { width: 18px; height: 18px; }

  /* Apply button under the cohort stamp — hides when the sticky apply bar is up */
  .cohort-stamp-cta {
    display: inline-block; margin-top: 9px;
    background: var(--copper); color: #fff; text-decoration: none;
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: 12px;
    letter-spacing: 0.2px; padding: 7px 18px; border-radius: 8px;
    box-shadow: 0 6px 16px -4px rgba(83,20,255,.5);
    transition: background .2s, transform .2s, opacity .25s ease;
  }
  .cohort-stamp-cta:hover { background: var(--copper-bright); transform: translateY(-1px); }
  body.apply-bar-up .cohort-stamp-cta { opacity: 0; pointer-events: none; }

  /* Pulse the stamp Apply button once the visitor starts scrolling */
  @keyframes stampPulse {
    0%, 100% { transform: scale(1); background: var(--copper); box-shadow: 0 6px 16px -4px rgba(83,20,255,.5); }
    45%      { transform: scale(1.42); background: var(--copper-bright); box-shadow: 0 12px 30px -4px rgba(122,77,255,.75); }
  }
  .cohort-stamp-cta.pulse { animation: stampPulse 0.95s ease 2; }
  @media (prefers-reduced-motion: reduce) { .cohort-stamp-cta.pulse { animation: none; } }

  /* Apply button under the hero video — mobile only (stamp button is hidden there) */
  .hero-mobile-apply { display: none; }
  @media (max-width: 700px) {
    .hero-mobile-apply { display: block; text-align: center; margin: 18px auto 6px; }
    .hero-mobile-apply .btn-primary { display: inline-block; }
  }

  /* Offer headline amount line */
  .offer-price-amount {
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: 30px; line-height: 1.05; letter-spacing: -0.02em; color: var(--ink);
    margin: 6px 0 6px;
  }
  .offer-price-amount em { color: var(--accent-ink); font-style: normal; }



  /* ===== Falling-pattern hero (inverted: dark/purple streaks on white) ===== */
  .hero { background: #ffffff; }
  .hero-shader-veil { display: none; }
  #aurora-root { position: absolute; inset: 0; overflow: hidden; }
  .fp-streaks {
    --fp: rgba(83, 20, 255, 0.55);
    position: absolute; inset: 0;
    background-color: #ffffff;
    background-image:
      radial-gradient(4px 100px at 0px 235px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 235px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 117.5px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 252px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 252px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 126px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 150px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 150px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 75px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 253px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 253px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 126.5px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 204px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 204px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 102px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 134px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 134px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 67px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 179px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 179px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 89.5px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 299px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 299px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 149.5px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 215px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 215px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 107.5px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 281px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 281px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 140.5px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 158px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 158px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 79px, var(--fp) 100%, transparent 150%),
      radial-gradient(4px 100px at 0px 210px, var(--fp), transparent),
      radial-gradient(4px 100px at 300px 210px, var(--fp), transparent),
      radial-gradient(1.5px 1.5px at 150px 105px, var(--fp) 100%, transparent 150%);
    background-size:
      300px 235px, 300px 235px, 300px 235px, 300px 252px, 300px 252px, 300px 252px,
      300px 150px, 300px 150px, 300px 150px, 300px 253px, 300px 253px, 300px 253px,
      300px 204px, 300px 204px, 300px 204px, 300px 134px, 300px 134px, 300px 134px,
      300px 179px, 300px 179px, 300px 179px, 300px 299px, 300px 299px, 300px 299px,
      300px 215px, 300px 215px, 300px 215px, 300px 281px, 300px 281px, 300px 281px,
      300px 158px, 300px 158px, 300px 158px, 300px 210px, 300px 210px;
    animation: fpFall 90s linear infinite;
  }
  @keyframes fpFall {
    from { background-position: 0px 220px, 3px 220px, 151.5px 337.5px, 25px 24px, 28px 24px, 176.5px 150px, 50px 16px, 53px 16px, 201.5px 91px, 75px 224px, 78px 224px, 226.5px 230.5px, 100px 19px, 103px 19px, 251.5px 121px, 125px 120px, 128px 120px, 276.5px 187px, 150px 31px, 153px 31px, 301.5px 120.5px, 175px 235px, 178px 235px, 326.5px 384.5px, 200px 121px, 203px 121px, 351.5px 228.5px, 225px 224px, 228px 224px, 376.5px 364.5px, 250px 26px, 253px 26px, 401.5px 105px, 275px 75px, 278px 75px, 426.5px 180px; }
    to   { background-position: 0px 6800px, 3px 6800px, 151.5px 6917.5px, 25px 13632px, 28px 13632px, 176.5px 13758px, 50px 5416px, 53px 5416px, 201.5px 5491px, 75px 17175px, 78px 17175px, 226.5px 17301.5px, 100px 5119px, 103px 5119px, 251.5px 5221px, 125px 8428px, 128px 8428px, 276.5px 8495px, 150px 9876px, 153px 9876px, 301.5px 9965.5px, 175px 13391px, 178px 13391px, 326.5px 13540.5px, 200px 14741px, 203px 14741px, 351.5px 14848.5px, 225px 18770px, 228px 18770px, 376.5px 18910.5px, 250px 5082px, 253px 5082px, 401.5px 5161px, 275px 6375px, 278px 6375px, 426.5px 6480px; }
  }
  .fp-grid {
    position: absolute; inset: 0; z-index: 1;
    -webkit-backdrop-filter: blur(0.5rem); backdrop-filter: blur(0.5rem);
    background-image: radial-gradient(circle at 50% 50%, transparent 0, transparent 2px, #ffffff 2px);
    background-size: 12px 12px;
  }
  @media (prefers-reduced-motion: reduce) { .fp-streaks { animation: none; } }

  /* ===== Alternating section shades (light / less-light) ===== */
  body { background: #ffffff; }
  .hero { background: #ffffff; }
  .proof-strip { background: #F3F1FA !important; }
  .proof { background: #ffffff; }
  .programs { background: #F3F1FA; }
  .how-it-works { background: #ffffff; }
  .about { background: #F3F1FA; }
  .testimonials { background: #ffffff; }
  .faq { background: #F3F1FA; }
  .cta-section { background: #ffffff; }

  .programs .section-header { margin-bottom: 36px; }

  /* ===== Persona tabs ===== */
  .persona-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 28px; }
  .ptab {
    padding: 11px 22px; border-radius: 999px;
    border: 1px solid var(--line-bright); background: var(--bg-card);
    color: var(--ink-muted); font-size: 14px; font-weight: 600;
    font-family: inherit; cursor: pointer; transition: all .2s;
  }
  .ptab:hover { color: var(--ink); border-color: var(--copper); }
  .ptab.active {
    background: linear-gradient(135deg, #A21CFF, #5314FF);
    color: #fff; border-color: transparent;
    box-shadow: 0 8px 24px rgba(83,20,255,.28);
  }
  .persona-panel { display: none; }
  .persona-panel.active {
    display: grid; grid-template-columns: 1fr 1fr; gap: 36px;
    background: var(--bg-card); border: 1px solid var(--line);
    border-radius: 22px; padding: 38px 36px; text-align: left;
    animation: ppIn .35s ease;
  }
  @keyframes ppIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
  .pp-left, .pp-right { display: flex; flex-direction: column; }
  .persona-panel .persona-icon { margin-bottom: 18px; }
  .persona-panel h3 { font-family: 'Radio Canada Big', sans-serif; font-size: 22px; font-weight: 600; letter-spacing: -0.01em; margin-bottom: 10px; }
  .persona-panel .pp-left > p { color: var(--ink-muted); font-size: 15px; line-height: 1.6; margin: 0; }
  .pp-right .pb:first-child { margin-top: 0; }
  @media (max-width: 780px) { .persona-panel.active { grid-template-columns: 1fr; gap: 22px; } }

  #offer { scroll-margin-top: 96px; }

  .nav-links > a.active { color: var(--accent-ink); }

/* ===== Blog (duplicated from TSRE structure, TFSE-branded) ===== */
  /* === Blog: floating back-to-site button === */
  .blog-float-back {
    position: fixed; top: 18px; left: 18px; z-index: 200;
    display: inline-flex; align-items: center; gap: 7px;
    padding: 10px 16px 10px 13px; border-radius: 100px;
    background: var(--bg-card);
    border: 1px solid var(--line-bright);
    font-family: 'Radio Canada Big', sans-serif; font-size: 13px; font-weight: 700;
    color: var(--ink); text-decoration: none;
    box-shadow: 0 8px 24px rgba(18,4,54,0.12);
    transition: color .2s, background .2s, transform .2s, box-shadow .2s;
  }
  .blog-float-back:hover { background: var(--copper); border-color: var(--copper); color: #fff; transform: translateX(-2px); box-shadow: 0 10px 28px rgba(83,20,255,0.35); }
  .blog-float-back svg { width: 15px; height: 15px; }
  @media (max-width: 600px) { .blog-float-back { top: 12px; left: 12px; padding: 8px 14px 8px 11px; font-size: 12px; } }

  /* === Blog: branded header + layout === */
  .blog-head { padding: 92px 0 36px; position: relative; border-bottom: 1px solid var(--line); background: radial-gradient(900px 400px at 70% -20%, var(--copper-glow) 0%, transparent 65%); }
  .blog-eyebrow { display: inline-block; font-size: 13px; letter-spacing: 2px; text-transform: uppercase; color: var(--accent-ink); font-weight: 700; margin-bottom: 14px; }
  .blog-head h1 { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: clamp(32px, 5vw, 52px); line-height: 1.04; letter-spacing: -0.02em; color: var(--ink); margin: 0 0 14px; }
  .blog-head-sub { font-size: 17px; line-height: 1.6; color: var(--ink-muted); max-width: 640px; margin: 0; }
  .blog-ainote { font-size: 14px; line-height: 1.6; font-style: italic; color: var(--ink-muted); border-left: 3px solid var(--copper); padding-left: 14px; margin: 18px 0 0; max-width: 640px; }
  .blog-main { padding: 44px 0 90px; }
  .blog-back { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ink-muted); text-decoration: none; margin-bottom: 28px; transition: color .2s; }
  .blog-back:hover { color: var(--accent-ink); }

  /* === Blog index: clickable tiles === */
  .blog-grid { list-style: none; padding: 0; margin: 18px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  .blog-grid > li { display: flex; }
  .blog-tile {
    position: relative;
    display: flex; flex-direction: column;
    width: 100%;
    padding: 26px 24px 22px;
    background: linear-gradient(160deg, rgba(83,20,255,0.10) 0%, var(--bg-elevated) 55%);
    border: 1px solid var(--line-bright);
    border-radius: 18px;
    text-decoration: none;
    overflow: hidden;
    transition: transform .28s cubic-bezier(.22,1,.36,1), border-color .28s, box-shadow .28s;
  }
  .blog-tile::before {
    content: ''; position: absolute; left: 0; top: 0; height: 3px; width: 100%;
    background: linear-gradient(90deg, var(--copper), var(--copper-bright));
    transform: scaleX(0); transform-origin: left; transition: transform .3s ease;
  }
  .blog-tile:hover { transform: translateY(-5px); border-color: var(--copper); box-shadow: 0 18px 44px rgba(83,20,255,0.22); }
  .blog-tile:hover::before { transform: scaleX(1); }
  .blog-tile-badge {
    align-self: flex-start;
    font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 700;
    color: var(--link-ink);
    background: var(--copper-soft); border: 1px solid rgba(167,139,255,0.4);
    padding: 5px 11px; border-radius: 100px; margin-bottom: 16px;
  }
  .blog-tile h2 {
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: clamp(20px, 2.4vw, 26px); line-height: 1.15; letter-spacing: -0.01em;
    color: var(--ink); margin: 0 0 12px; transition: color .2s;
  }
  .blog-tile:hover h2 { color: var(--link-ink); }
  .blog-tile-excerpt { font-size: 15px; line-height: 1.65; color: var(--ink-muted); margin: 0 0 20px; }
  .blog-tile-more { margin-top: auto; font-size: 14px; font-weight: 700; color: var(--link-ink); display: inline-flex; align-items: center; gap: 6px; transition: gap .2s; }
  .blog-tile:hover .blog-tile-more { gap: 12px; }
  @media (max-width: 640px) {
    .blog-grid { grid-template-columns: 1fr; gap: 16px; }
    .blog-tile-badge { letter-spacing: 1px; padding: 6px 12px; line-height: 1.45; }
  }

  .blog-cta { margin: 48px 0 0; padding: 28px; background: var(--bg-elevated); border: 1px solid var(--line-bright); border-radius: 16px; text-align: center; }
  .blog-cta p { font-size: 17px; color: var(--ink); margin: 0 0 16px; }

  /* Article body (single post) keeps the readable prose width */
  .blog-readmore { font-size: 14px; font-weight: 600; color: var(--accent-ink); text-decoration: none; }
  .blog-readmore:hover { text-decoration: underline; }

  /* === Blog article: magazine layout === */
  .article { max-width: 720px; margin-left: auto; margin-right: auto; padding: 96px 24px 80px; }
  .article .legal-back { margin-bottom: 26px; }
  .article h1 { font-family: 'Radio Canada Big', sans-serif; font-weight: 700; font-size: clamp(30px, 4.4vw, 46px); line-height: 1.06; letter-spacing: -0.02em; color: var(--ink); margin: 0 0 16px; }
  .article .legal-meta { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; letter-spacing: 0.5px; color: var(--ink-dim); margin: 0 0 14px; padding-bottom: 26px; border-bottom: 1px solid var(--line); width: 100%; }
  .article > p { font-size: 18px; line-height: 1.78; color: var(--ink); margin: 0 0 24px; }
  .article > p strong { color: var(--ink); }
  .article > p:first-of-type { font-size: 21px; line-height: 1.7; color: var(--ink); margin-top: 30px; }
  .article > p:first-of-type::first-letter {
    float: left; font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: 74px; line-height: 0.74; padding: 6px 12px 0 0; color: var(--accent-ink);
  }
  .article h2 {
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: clamp(23px, 2.9vw, 31px); line-height: 1.2; letter-spacing: -0.01em;
    color: var(--ink-muted); margin: 52px 0 18px; padding-top: 8px;
    padding-bottom: 12px; border-bottom: 1px solid var(--line-bright);
    clear: both;
  }
  .article .blog-cta { clear: both; }
  .article h2::before {
    content: ''; display: block; width: 46px; height: 3px; margin-bottom: 18px;
    background: linear-gradient(90deg, var(--copper), var(--copper-bright)); border-radius: 3px;
  }

  /* Magazine pull-quote callout (inline, full width) */
  .pull-quote {
    position: relative;
    margin: 44px 0;
    padding: 34px 34px 30px 64px;
    background: linear-gradient(150deg, rgba(83,20,255,0.14) 0%, var(--bg-elevated) 70%);
    border: 1px solid var(--line-bright);
    border-left: 4px solid var(--copper);
    border-radius: 0 18px 18px 0;
    font-family: 'Radio Canada Big', sans-serif; font-weight: 700;
    font-size: clamp(22px, 3.2vw, 30px); line-height: 1.28; letter-spacing: -0.01em;
    font-style: italic;
    color: var(--ink);
  }
  .pull-quote::before {
    content: '\201C'; position: absolute; left: 20px; top: 6px;
    font-family: Georgia, serif; font-size: 70px; line-height: 1; color: var(--copper); opacity: 0.55;
  }
  .pull-quote cite { display: block; margin-top: 12px; font-family: 'Radio Canada Big', sans-serif; font-weight: 600; font-style: normal; font-size: 14px; letter-spacing: 1px; text-transform: uppercase; color: var(--link-ink); }
  @media (max-width: 600px) { .pull-quote { padding: 26px 22px 24px 50px; } .pull-quote::before { font-size: 54px; left: 14px; } }

  /* === Blog article: related cross-links === */
  .article-related { clear: both; margin: 40px 0 0; padding: 18px 22px; background: var(--bg-elevated); border: 1px solid var(--line-bright); border-radius: 14px; font-size: 15px; color: var(--ink-muted); }
  .article-related span { font-weight: 700; letter-spacing: 1px; text-transform: uppercase; font-size: 12px; color: var(--link-ink); margin-right: 8px; }
  .article-related a { color: var(--ink); text-decoration: none; font-weight: 600; }
  .article-related a:hover { color: var(--link-ink); text-decoration: underline; }


/* CTA investment: force two lines (sentence on one line + "And it works.") */
.cta-investment { max-width: none !important; font-size: clamp(13px, 1.4vw, 16px) !important; margin-left: auto; margin-right: auto; }
.cta-investment strong { display: block; white-space: nowrap; }
.cta-investment span { display: block; }
@media (max-width: 680px) { .cta-investment strong { white-space: normal; } }

/* Accessibility: skip-to-content link (WCAG 2.4.1) */
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 1000; background: var(--copper); color: #fff; padding: 12px 18px; font-weight: 700; border-radius: 0 0 10px 0; text-decoration: none; }
.skip-link:focus { left: 0; }

.footer-addr { font-size: 12px; color: var(--ink-dim); margin-top: 8px; line-height: 1.5; }

/* Blog: center the header block (cleaner than TSRE's left-aligned header) */
.blog-head .container { text-align: center; }
.blog-head-sub { margin-left: auto; margin-right: auto; }
.blog-ainote { margin-left: auto; margin-right: auto; border-left: 0; padding-left: 0; text-align: center; max-width: 600px; }

/* Logo byline — stacked under the TFSE wordmark (homepage nav only) */
.nav-logo { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 0; line-height: 1.05; }
.nav-logo .logo-line { display: inline-block; white-space: nowrap; }
.logo-by {
  display: block;
  font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;
  font-size: 8px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-style: italic;
  font-weight: 400;
  color: rgba(18, 4, 54, 0.6);              /* faded (white would be invisible on the light topbar) */
  -webkit-text-fill-color: rgba(18, 4, 54, 0.6);
  background: none;
  margin-top: 4px;
}
.logo-by .nlb-by { text-transform: lowercase; }
@media (max-width: 600px) { .logo-by { margin-top: 6px; } }