/* ==========================================================================
   Test page v2 — marketing-site redesign (Aptitude Test Page.dc.html)
   Loaded only by _layouts/test-v2.html. Class names are new (tv2-*) so this
   file cannot collide with the live styles; the free-test section itself is
   still styled by free-test.css.
   ========================================================================== */

.tv2 {
  font-family: 'Circular', 'Circular Std', 'Helvetica Neue', Arial, system-ui, sans-serif;
  color: #414B5E;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.tv2 *, .tv2 *::before, .tv2 *::after { box-sizing: border-box; }
.tv2 a { color: #1257E8; text-decoration: none; }
.tv2 a:hover { color: #0A45B8; text-decoration: underline; }
.tv2 :focus-visible { outline: 3px solid rgba(18,87,232,.45); outline-offset: 2px; border-radius: 4px; }

.tv2-pad { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.tv2-mono { font-family: 'IBM Plex Mono', monospace; }

/* Section-start rule: orange means "section start" everywhere except the hero */
.tv2-rule { width: 26px; height: 4px; background: #FF9500; border-radius: 2px; margin-bottom: 14px; }
.tv2-rule--sm { width: 22px; height: 3px; margin-bottom: 12px; }

/* ==========================================================================
   Header
   ========================================================================== */
.tv2-header { border-bottom: 1px solid #DFE3EA; background: #fff; position: relative; z-index: 30; }
.tv2-header__bar { max-width: 1120px; margin: 0 auto; padding: 0 24px; height: 72px; display: flex; align-items: center; gap: 36px; }
.tv2-header__logo { display: flex; align-items: center; }
.tv2-header__logo img { display: block; width: 144px; height: 29px; }
.tv2-nav { display: flex; gap: 38px; align-items: center; height: 100%; }
.tv2-nav__item { position: relative; height: 100%; display: flex; align-items: center; }
/* Written as `.tv2 a.tv2-nav__link`, not `.tv2-nav__link`: the base `.tv2 a`
   rule above is (0,1,1) and outranks a lone class at (0,1,0), so the nav
   rendered in link blue instead of the design's navy. Any rule that colours an
   anchor has to clear that bar. */
.tv2 a.tv2-nav__link { font-size: 15px; font-weight: 500; color: #14203A; text-decoration: none; display: flex; align-items: center; gap: 5px; }
.tv2 a.tv2-nav__link:hover { color: #1257E8; text-decoration: none; }
.tv2-nav__caret { font-size: 10px; color: #5A6478; }
.tv2-nav__menu {
  position: absolute; top: 100%; left: 0; padding-top: 6px; width: 250px;
  display: none;
}
.tv2-nav__item:hover .tv2-nav__menu,
.tv2-nav__item:focus-within .tv2-nav__menu { display: block; }
.tv2-nav__menu-inner {
  background: #fff; border: 1px solid #DFE3EA; border-radius: 10px;
  box-shadow: 0 4px 12px rgba(20,32,58,.09), 0 16px 40px -12px rgba(20,32,58,.18);
  padding: 10px; display: flex; flex-direction: column;
}
.tv2-nav__menu-inner a { font-size: 15px; color: #414B5E; text-decoration: none; padding: 9px 12px; border-radius: 6px; }
.tv2-nav__menu-inner a:hover { background: #EEF4FF; color: #1257E8; text-decoration: none; }
.tv2-header__actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.tv2 a.tv2-btn--signin {
  display: inline-block; padding: 9px 18px; border-radius: 4px; font-size: 15px; font-weight: 500;
  color: #1257E8; background: #fff; border: 1.5px solid #1257E8; text-decoration: none;
}
.tv2 a.tv2-btn--signin:hover { background: #EEF4FF; text-decoration: none; color: #1257E8; }
.tv2 a.tv2-btn--getpro {
  display: inline-block; padding: 9px 18px; border-radius: 4px; font-size: 15px; font-weight: 500;
  color: #fff; background: #1257E8; border: 1.5px solid #1257E8; text-decoration: none;
}
.tv2 a.tv2-btn--getpro:hover { background: #0A45B8; border-color: #0A45B8; color: #fff; text-decoration: none; }
.tv2-header__burger {
  display: none; width: 42px; height: 42px; align-items: center; justify-content: center;
  gap: 4px; flex-direction: column; background: #fff; border: 1.5px solid #DFE3EA;
  border-radius: 4px; cursor: pointer; padding: 0;
}
.tv2-header__burger span { width: 18px; height: 1.5px; background: #14203A; display: block; }
.tv2-header__mobile { display: none; border-top: 1px solid #DFE3EA; padding: 10px 20px 18px; flex-direction: column; }
.tv2-header__mobile a { font-size: 16px; font-weight: 500; color: #14203A; text-decoration: none; padding: 13px 0; border-bottom: 1px solid #EDEFF4; }
.tv2-header__mobile a:last-child { border-bottom: 0; }
.tv2-header__mobile a:hover { color: #1257E8; }
.tv2-header.is-open .tv2-header__mobile { display: flex; }

/* ==========================================================================
   Hero
   ========================================================================== */
.tv2-hero-band { border-bottom: 1px solid #EDEFF4; }
.tv2-hero-band--flush { border-bottom: 0; }
.tv2-hero-band__inner { max-width: 1120px; margin: 0 auto; padding: 60px 24px 52px; }
.tv2-breadcrumb { margin-bottom: 26px; }
.tv2-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; line-height: 1.4; }
.tv2-breadcrumb a { color: #5A6478; text-decoration: none; }
.tv2-breadcrumb a:hover { color: #1257E8; }
.tv2-breadcrumb .tv2-breadcrumb__sep { color: #5A6478; }
.tv2-breadcrumb [aria-current="page"] { color: #14203A; }

.tv2-hero { display: grid; grid-template-columns: minmax(0,1fr) 344px; gap: 48px; align-items: start; }
.tv2-hero__main { min-width: 0; }
.tv2-hero__eyebrow { margin: 0 0 18px; font: 500 12px/1 'IBM Plex Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: #5A6478; }
.tv2-hero__h1 { margin: 0 0 26px; font-size: clamp(32px, 5.4vw, 50px); line-height: 1.08; font-weight: 500; color: #14203A; letter-spacing: -.02em; max-width: 20ch; text-wrap: balance; }
.tv2-hero__intro { margin: 0 0 40px; font-size: 20px; line-height: 1.6; color: #414B5E; max-width: 58ch; text-wrap: pretty; }

.tv2-hero__facts { margin: 0; max-width: 58ch; }
.tv2-hero__facts-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 26px 28px; }
.tv2-fact { display: flex; gap: 10px; min-width: 0; }
.tv2-fact svg { width: 18px; height: 18px; flex: none; display: block; margin-top: 2px; }
.tv2-fact__value { font: 500 15px/1.35 'IBM Plex Mono', monospace; color: #14203A; font-variant-numeric: tabular-nums; }
.tv2-fact__label { font-size: 13px; line-height: 1.4; color: #5A6478; }
.tv2-hero__free-line { margin: 24px 0 0; font: 500 12px/1.5 'IBM Plex Mono', monospace; letter-spacing: .04em; text-transform: uppercase; color: #0E7A50; }

.tv2-hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-top: 38px; max-width: 58ch; }
.tv2 a.tv2-btn--primary {
  display: inline-block; padding: 13px 22px; border-radius: 4px; font-size: 17px; font-weight: 500;
  color: #fff; background: #1257E8; border: 1.5px solid #1257E8; text-decoration: none;
}
.tv2 a.tv2-btn--primary:hover { background: #0A45B8; border-color: #0A45B8; color: #fff; text-decoration: none; }
.tv2 a.tv2-btn--ghost {
  display: inline-block; padding: 13px 22px; border-radius: 4px; font-size: 17px; font-weight: 500;
  color: #1257E8; background: #fff; border: 1.5px solid #1257E8; text-decoration: none;
}
.tv2 a.tv2-btn--ghost:hover { background: #EEF4FF; color: #1257E8; text-decoration: none; }

.tv2-hero__rating { display: flex; align-items: center; gap: 10px; margin-top: 24px; }
.tv2-stars { display: flex; gap: 2px; }
.tv2-hero__rating-text { font-size: 15px; color: #414B5E; }
.tv2-hero__rating-text b { font-weight: 500; color: #14203A; }
/* Anchor variants below are written as `.tv2 a.…` so they beat `.tv2 a` (0,1,1). */
.tv2 a.tv2-hero__rating-link { color: #414B5E; text-decoration: none; }
.tv2 a.tv2-hero__rating-link:hover { color: #414B5E; text-decoration: underline; }
/* Single-column hero: the shape every v2 page uses when it has no aside. Moved here from
   test-v2.css on 2026-09-02 so the publisher template (its decorative fake test card removed,
   per the test pages) shares the exact same rules. Selectors unchanged, so test pages render
   byte-identically. */
.tv2 .tv2-hero--single { grid-template-columns: minmax(0, 1fr); }
.tv2 .tv2-hero--single { text-align: center; }
/* One line at desktop, which is what lifting the 20ch cap achieves: with no width
   constraint a short H1 sits on one line by itself. `white-space: nowrap` used to be
   here as well and did not add to that — it only removed the escape hatch, so any H1
   too long for the column ran off the page instead of wrapping. Measured at 800px on
   2026-09-02: 20 pages overflowed, worst 388px ("Personality Test in the Style of the
   PI Behavioral Assessment"), across the publisher, employer, personality and industry
   families. Character count is not a usable threshold either — a 34-character H1 of
   wide glyphs clipped while a 36-character one of narrow glyphs fitted. ⛔ Do not
   reinstate nowrap here. */
.tv2 .tv2-hero--single .tv2-hero__h1 { max-width: none; margin-inline: auto; }
.tv2 .tv2-hero--single .tv2-hero__intro { max-width: 62ch; margin-inline: auto; }
.tv2 .tv2-hero--single .tv2-hero__facts,
.tv2 .tv2-hero--single .tv2-hero__ctas { margin-inline: auto; }
.tv2 .tv2-hero--single .tv2-hero__ctas { justify-content: center; }
.tv2 .tv2-hero--single .tv2-hero__rating { justify-content: center; }
.tv2 .tv2-hero--single .tv2-factline { justify-content: center; }
.tv2 .tv2-hero--single .tv2-fact { text-align: left; }

.tv2-factline { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: baseline; row-gap: 6px; font: 500 15px/1.5 'IBM Plex Mono', monospace; color: #14203A; font-variant-numeric: tabular-nums; }
.tv2-factline li { white-space: nowrap; }
/* The pages with no free test put PACKAGE facts here instead, and those are
   sentences ("20 practice tests in the Situational Judgement pack"), not the
   two-word figures the nowrap above protects. Unwrappable, they overflowed a
   375px viewport by 27px and scrolled the whole page sideways. Scoped to the
   long variant so the free-test hero is untouched at every width. */
.tv2-factline--long li { white-space: normal; }
/* Separator AFTER each item, not before the next: when the line wraps, a
   trailing dot at a line end reads as punctuation; a leading one is an orphan. */
.tv2-factline li:not(:last-child)::after { content: '·'; margin: 0 12px; color: #8A93A6; }
/* Long facts get a row each, and no separator. Not a mobile-only rule: the
   facts block is capped at ~570px at every viewport, and these two facts need
   ~741px, so they wrap at any width and the middot would always be left
   orphaned at the end of the first one. Must come AFTER the rule above, which
   it matches for specificity, so source order decides. */
.tv2-factline--long li { flex: 0 0 100%; text-align: inherit; }
.tv2-factline--long li:not(:last-child)::after { content: none; margin: 0; }
.tv2 a.tv2-factline__link { color: inherit; text-decoration: underline; text-decoration-color: #B9C2D0; text-underline-offset: 3px; }
.tv2 a.tv2-factline__link:hover { color: #1257E8; text-decoration-color: #1257E8; }
/* Try-one aside */
.tv2-tryone {
  border: 1px solid #E4E9F1; border-radius: 10px; background: #F8FAFD;
  padding: 20px 20px 18px; margin-top: 82px;
}
.tv2-tryone__head { display: flex; align-items: center; gap: 9px; margin-bottom: 14px; }
.tv2-tryone__head-rule { width: 18px; height: 3px; background: #FF9500; border-radius: 2px; flex: none; }
.tv2-tryone__label { font: 500 11px/1 'IBM Plex Mono', monospace; letter-spacing: .07em; text-transform: uppercase; color: #5A6478; }
.tv2-tryone__stem { margin: 0 0 14px; font-size: 15px; line-height: 1.5; color: #14203A; text-wrap: pretty; }
.tv2-tryone__options { display: grid; grid-template-columns: minmax(0,1fr); gap: 0; border: 1px solid #E4E9F1; border-radius: 8px; background: #fff; overflow: hidden; }
.tv2-tryone__option { display: flex; align-items: center; gap: 11px; padding: 10px 13px; cursor: pointer; min-height: 44px; border-top: 1px solid #EDEFF4; position: relative; }
.tv2-tryone__option:first-child { border-top-color: transparent; }
.tv2-tryone__option:hover { background: #F2F6FF; }
.tv2-tryone__option input { position: absolute; opacity: 0; width: 0; height: 0; }
.tv2-tryone__letter {
  width: 22px; height: 22px; border-radius: 50%; flex: none; display: flex; align-items: center;
  justify-content: center; font: 500 11px 'IBM Plex Mono', monospace;
  border: 1.5px solid #C7CCD8; background: #fff; color: #5A6478;
}
.tv2-tryone__body { font-size: 15px; line-height: 1.4; color: #14203A; }
.tv2-tryone__option.is-picked-right { background: #F1FAF5; box-shadow: inset 2px 0 0 #0E7A50; }
.tv2-tryone__option.is-picked-wrong { background: #FEF3F2; box-shadow: inset 2px 0 0 #C22A22; }
.tv2-tryone__option.is-picked-right .tv2-tryone__letter { border-color: #0E7A50; background: #0E7A50; color: #fff; }
.tv2-tryone__option.is-picked-wrong .tv2-tryone__letter { border-color: #C22A22; background: #C22A22; color: #fff; }
.tv2-tryone__option.is-revealed-right .tv2-tryone__letter { border-color: #0E7A50; color: #0E7A50; }
.tv2-tryone__option.is-revealed-right { background: #F1FAF5; }
.tv2-tryone__mark { margin: 12px 0 0; padding-top: 11px; border-top: 1px solid #EDEFF4; font-size: 14px; line-height: 1.5; color: #5A6478; }
.tv2-tryone__mark.is-right { color: #0E7A50; }
.tv2-tryone__mark.is-wrong { color: #C22A22; }

/* ==========================================================================
   Employer strip
   ========================================================================== */
.tv2-employers { background: #F6F8FC; border-bottom: 1px solid #EDEFF4; padding: 22px 0; }
.tv2-employers__inner { max-width: 1120px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; gap: 14px 32px; flex-wrap: wrap; }
.tv2-employers__label { font: 500 12px/1.4 'IBM Plex Mono', monospace; letter-spacing: .06em; text-transform: uppercase; color: #5A6478; flex: none; }
.tv2-employers ul { list-style: none; margin: 0; padding: 0; flex: 1 1 480px; display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; }
.tv2-employers li { flex: 0 1 auto; min-width: 0; }
.tv2-employers img { max-height: 26px; max-width: 100%; width: auto; height: auto; display: block; object-fit: contain; opacity: .72; }

/* ==========================================================================
   Intro + contents
   ========================================================================== */
.tv2-intro { display: grid; grid-template-columns: minmax(0,716px) 300px; gap: 56px; align-items: start; padding: 48px 0 0; }
.tv2-intro__main { margin: 0; min-width: 0; }
.tv2-dates { margin: 0 0 12px; font-size: 14px; line-height: 1.6; color: #5A6478; display: flex; gap: 8px; flex-wrap: wrap; }
.tv2-h2 { margin: 0 0 16px; font-size: 26px; line-height: 1.25; font-weight: 500; color: #14203A; }
.tv2-intro__def { margin: 0 0 26px; font-size: 17px; line-height: 1.65; color: #414B5E; max-width: 68ch; text-wrap: pretty; }
.tv2-intro__note { margin: 0 0 18px; font-size: 17px; line-height: 1.65; color: #414B5E; max-width: 68ch; }
.tv2-test-heading { margin-top: 40px; padding-top: 32px; border-top: 1px solid #DFE3EA; }
.tv2-test-heading h2 { margin: 0 0 10px; font-size: 26px; line-height: 1.25; font-weight: 500; color: #14203A; }
.tv2-test-heading__pdf { margin: 0 0 8px; font-size: 16px; line-height: 1.6; color: #414B5E; }
.tv2-test-heading__pdf a { color: #1257E8; font-weight: 500; }
.tv2-test-heading__note { margin: 0; font-size: 14px; line-height: 1.6; color: #5A6478; }

.tv2-toc { border: 1px solid #DFE3EA; border-radius: 10px; padding: 20px 22px; margin: 0; background: #fff; }
.tv2-toc__title { font: 500 16px/1.3 'Circular', sans-serif; color: #14203A; margin-bottom: 6px; }
.tv2-toc__note { margin: 0 0 10px; font-size: 13px; line-height: 1.55; color: #5A6478; }
.tv2-toc ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 0; }
.tv2-toc a { display: block; font-size: 15px; line-height: 1.5; color: #414B5E; text-decoration: none; padding: 10px 0; border-bottom: 1px solid #EDEFF4; }
.tv2-toc li:last-child a { border-bottom: 0; }
.tv2-toc a:hover { color: #1257E8; }

/* ==========================================================================
   Test wrapper
   ========================================================================== */
.tv2-test { padding: 0 0 16px; }
#free-test { scroll-margin-top: 16px; }

/* ==========================================================================
   Navy CTA band
   ========================================================================== */
.tv2-ctaband { background: #14203A; padding: 56px 0; margin: 0 0 8px; }
.tv2-ctaband__inner {
  max-width: 1120px; margin: 0 auto; padding: 0 24px;
  display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 40px 64px; align-items: center;
}
.tv2-ctaband__copy { min-width: 0; }
.tv2-ctaband__rule { width: 26px; height: 4px; background: #FF9500; border-radius: 2px; margin-bottom: 18px; }
.tv2-ctaband h2 { margin: 0 0 12px; font-size: 30px; line-height: 1.2; font-weight: 500; color: #fff; max-width: 20ch; text-wrap: balance; }
.tv2-ctaband__body { margin: 0 0 26px; font-size: 17px; line-height: 1.6; color: rgba(255,255,255,.78); max-width: 48ch; text-wrap: pretty; }
.tv2-ctaband__actions { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.tv2 a.tv2-btn--orange {
  display: inline-block; padding: 14px 26px; border-radius: 4px; font-size: 17px; font-weight: 500;
  color: #14203A; background: #FF9500; border: 1.5px solid #FF9500; text-decoration: none;
}
.tv2 a.tv2-btn--orange:hover { background: #FFAB33; border-color: #FFAB33; color: #14203A; text-decoration: none; }
.tv2-ctaband__price { font-size: 15px; color: rgba(255,255,255,.7); }
.tv2-ctaband__stats { margin: 0; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(140px,100%),1fr)); gap: 0 32px; border-top: 1px solid rgba(255,255,255,.16); }
.tv2-ctaband__stat { padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.tv2-ctaband__stat dt { font: 500 44px/1 'IBM Plex Mono', monospace; color: #fff; font-variant-numeric: tabular-nums; }
.tv2-ctaband__stat dd { margin: 8px 0 0; font-size: 15px; line-height: 1.4; color: rgba(255,255,255,.7); }

/* ==========================================================================
   Guide + sidebar
   ========================================================================== */
.tv2-guide { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 56px; align-items: start; padding: 56px 0 0; }
.tv2-guide__main { min-width: 0; scroll-margin-top: 16px; }
.tv2-guide__section { margin-bottom: 44px; }
.tv2-guide__section h2 { margin: 0 0 16px; font-size: 26px; line-height: 1.25; font-weight: 500; color: #14203A; max-width: 40ch; text-wrap: balance; }
.tv2-guide__section p { margin: 0 0 16px; font-size: 17px; line-height: 1.65; color: #414B5E; max-width: 68ch; text-wrap: pretty; }
.tv2-guide__section b, .tv2-guide__section strong { font-weight: 500; color: #14203A; }
.tv2-guide__section ul, .tv2-guide__section ol { margin: 0 0 16px; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; }
.tv2-guide__section li { font-size: 17px; line-height: 1.6; color: #414B5E; max-width: 66ch; }
.tv2-guide__section li::marker { color: #1257E8; font: 600 14px 'IBM Plex Mono', monospace; }
.tv2-guide__section table { width: 100%; border-collapse: collapse; font-size: 15px; margin: 0 0 16px; }
.tv2-guide__section th, .tv2-guide__section td { text-align: left; padding: 10px 12px; border-bottom: 1px solid #EDEFF4; vertical-align: top; }
.tv2-guide__section th { color: #14203A; font-weight: 500; }
.tv2-guide__section a { color: #1257E8; }

.tv2-sidebar { display: flex; flex-direction: column; gap: 20px; }
/* One orange tick per rail: blocks after the first drop theirs. */
.tv2-sidebar > :not(:first-child) .tv2-rule--sm { display: none; }
.tv2-sidebar__card { border: 1px solid #DFE3EA; border-radius: 10px; padding: 20px 22px; }
.tv2-sidebar__title { font: 500 16px/1.3 'Circular', sans-serif; color: #14203A; margin-bottom: 6px; }
.tv2-sidebar__note { margin: 0 0 10px; font-size: 13px; line-height: 1.55; color: #5A6478; }
.tv2-sidebar__links { display: flex; flex-direction: column; }
.tv2-sidebar__links a { font-size: 15px; color: #414B5E; text-decoration: none; padding: 10px 0; border-bottom: 1px solid #EDEFF4; }
.tv2-sidebar__links a:last-child { border-bottom: 0; }
.tv2-sidebar__links a:hover { color: #1257E8; }
/* "All … →" hub link closing a capped list. Last child, so the rule above
   removes its own underline-rule and the item before it keeps a divider. */
.tv2-sidebar__links a.tv2-sidebar__all { color: #1257E8; }

/* ==========================================================================
   FAQs
   ========================================================================== */
.tv2-faqs { background: #F6F8FC; padding: 72px 0; scroll-margin-top: 16px; }
.tv2-faqs__head { margin-bottom: 34px; }
.tv2-faqs__head h2 { margin: 0 0 8px; font-size: 28px; line-height: 1.2; font-weight: 500; color: #14203A; }
.tv2-faqs__head p { margin: 0; font-size: 16px; line-height: 1.6; color: #5A6478; max-width: 60ch; }
.tv2-faqs__grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 30px 48px; align-items: start; }
.tv2-faq { border-top: 1px solid #DFE3EA; padding-top: 18px; }
.tv2-faq h3 { margin: 0 0 8px; font: 500 18px/1.35 'Circular', sans-serif; color: #14203A; text-wrap: pretty; }
.tv2-faq p { margin: 0; font-size: 16px; line-height: 1.65; color: #414B5E; text-wrap: pretty; }

/* ==========================================================================
   Reviews
   ========================================================================== */
.tv2-reviews { border-top: 1px solid #EDEFF4; padding: 56px 0; }
.tv2-reviews__head { text-align: center; margin-bottom: 32px; }
.tv2-reviews__head h2 { margin: 0 0 10px; font-size: 28px; line-height: 1.2; font-weight: 500; color: #14203A; }
.tv2-reviews__head p { margin: 0; font-size: 16px; line-height: 1.6; color: #5A6478; }
.tv2-reviews__list { display: flex; flex-direction: column; gap: 16px; }
.tv2-review { background: #F6F8FC; border-radius: 10px; padding: 22px 24px; }
.tv2-review__byline { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.tv2-review__avatar {
  width: 38px; height: 38px; border-radius: 50%; background: #DFE3EA; color: #5A6478;
  flex: none; display: flex; align-items: center; justify-content: center;
  font: 500 15px 'Circular', sans-serif;
}
.tv2-review__name { font-size: 15px; color: #414B5E; padding-top: 9px; }
.tv2-review__meta { margin-left: auto; text-align: right; font-size: 14px; line-height: 1.5; color: #5A6478; }
/* Quote-led review cards, side by side (the test-page shape). Shared modifier since 2026-09-02:
   test-v2 and publisher-profile-v2 both add `tv2-reviews--cards` to the section, so one
   definition serves both. Employer pages keep the older stacked byline markup above. */
.tv2 .tv2-reviews--cards { border-top: 0; padding: 64px 0 24px; }
.tv2 .tv2-reviews--cards .tv2-reviews__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.tv2 .tv2-reviews--cards .tv2-review { display: flex; flex-direction: column; }
.tv2 .tv2-reviews--cards .tv2-review__body { flex: 1; font-size: 15px; }
.tv2 .tv2-reviews--cards .tv2-review__title-row h3 { font-size: 16px; }
.tv2 .tv2-reviews--cards .tv2-review__footer { margin: 12px 0 0; font-size: 13px; color: #5A6478; }
.tv2-review__title-row { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.tv2-review__title-row h3 { margin: 0; font-size: 18px; line-height: 1.35; font-weight: 500; color: #14203A; }
.tv2-review__body { margin: 0; font-size: 16px; line-height: 1.6; color: #414B5E; }

/* ==========================================================================
   Footer
   ========================================================================== */
/* ---- THE plan shelf (v2/plans.html): one include on pricing, home and the psychometric hub, Guy 2026-09-04 ---- */
.tv2-plans { background: #F6F8FC; border-top: 1px solid #EDEFF4; border-bottom: 1px solid #EDEFF4; padding: 56px 0; scroll-margin-top: 16px; }
.tv2-plans__head { text-align: center; margin-bottom: 30px; }
.tv2-plans__kicker { margin: 0 0 8px; font: 500 15px/1 'Circular', sans-serif; color: #1257E8; }
.tv2-plans__head h2 { margin: 0 0 8px; font-size: 32px; line-height: 1.15; font-weight: 500; color: #14203A; }
.tv2-plans__sub { margin: 0; font-size: 17px; line-height: 1.6; color: #5A6478; }

/* Billing toggle: hidden without JS (both prices render instead) */
.tv2-plans__toggle-row { display: none; justify-content: center; margin-bottom: 26px; }
.tv2-plans-js .tv2-plans__toggle-row { display: flex; }
.tv2-plans__toggle { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: #fff; border: 1px solid #DFE3EA; }
.tv2-plans__toggle-btn {
  border: none; cursor: pointer; padding: 9px 18px; border-radius: 999px;
  font: 500 15px 'Circular', sans-serif; background: transparent; color: #5A6478;
}
.tv2-plans__toggle-btn[aria-pressed="true"] { background: #1257E8; color: #fff; }

/* Billing visibility. Without JS neither class is set, so both variants
   render and both prices stay readable. */
.tv2-billing-annual .tv2-monthly { display: none !important; }
.tv2-billing-monthly .tv2-annual { display: none !important; }

.tv2-plans__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px,100%),1fr)); gap: 24px; max-width: 900px; margin: 0 auto; align-items: start; }
.tv2-plan { min-width: 0; border: 1px solid #DFE3EA; border-radius: 12px; background: #fff; padding: 28px 28px 26px; }
.tv2-plan--pro { position: relative; border: 1.5px solid #1257E8; box-shadow: 0 2px 14px rgba(20,32,58,.06); }
.tv2-plan__toprow { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.tv2-plan h3 { margin: 0; font-size: 22px; font-weight: 500; color: #14203A; }
.tv2-plan__basictitle { margin-bottom: 4px !important; }
.tv2-plan__save {
  font: 500 12px/1 'IBM Plex Mono', monospace; letter-spacing: .05em; text-transform: uppercase;
  color: #0E7A50; background: #E6F6EE; border: 1px solid #BFE5D3; padding: 6px 9px; border-radius: 999px;
}
.tv2-plan__price { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 6px; }
.tv2-plan__amount { font: 500 44px/1 'IBM Plex Mono', monospace; color: #14203A; font-variant-numeric: tabular-nums; }
.tv2-plan__amount--free { font-family: 'Circular', 'Circular Std', 'Helvetica Neue', Arial, system-ui, sans-serif; font-weight: 500; }
.tv2-plan__period { font-size: 16px; color: #5A6478; padding-bottom: 6px; }
.tv2-plan__note { margin: 0 0 20px; font-size: 15px; line-height: 1.55; color: #5A6478; }
.tv2 a.tv2-plan__cta { display: block; text-align: center; margin-bottom: 22px; }
.tv2-plan__listhead { font: 600 12px/1 'IBM Plex Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: #5A6478; margin-bottom: 12px; }
.tv2-plan__catalogues { list-style: none; margin: 0 0 20px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(150px,100%),1fr)); gap: 8px 18px; }
.tv2-plan__catalogues li { display: flex; align-items: baseline; gap: 8px; font-size: 15px; line-height: 1.5; color: #414B5E; }
.tv2-plan__count { font: 500 13px 'IBM Plex Mono', monospace; color: #14203A; font-variant-numeric: tabular-nums; min-width: 30px; text-align: right; }
.tv2-plan__features { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.tv2-plan__features li { display: flex; gap: 10px; align-items: flex-start; font-size: 16px; line-height: 1.5; color: #414B5E; }
.tv2-plan__tick { color: #0E7A50; font-weight: 700; }
.tv2-plan__excluded { margin-top: 14px; padding-top: 14px; border-top: 1px solid #EDEFF4; }
.tv2-plan__excluded li { color: #5A6478; }
.tv2-plan__cross { color: #98A1B2; font-weight: 700; }

/* The closer band every v2 page ends on, ahead of the footer (Guy, 2026-09-04). */
.tv2-closerband { background: #14203A; padding: 56px 0 8px; text-align: center; }
.tv2-closerband h2 { margin: 0 0 10px; font-size: 30px; line-height: 1.2; font-weight: 500; color: #fff; }
.tv2-closerband p { margin: 0 0 24px; font-size: 17px; line-height: 1.6; color: rgba(255,255,255,.8); }
.tv2-closerband__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.tv2 a.tv2-closerband__btn {
  display: inline-block; padding: 13px 22px; border-radius: 4px; font-size: 17px; font-weight: 500;
  color: #14203A; background: #fff; border: 1.5px solid #fff; text-decoration: none;
}
.tv2 a.tv2-closerband__btn:hover { background: #DCE8FF; border-color: #DCE8FF; color: #14203A; text-decoration: none; }
.tv2 a.tv2-closerband__btn--ghost {
  display: inline-block; padding: 13px 22px; border-radius: 4px; font-size: 17px; font-weight: 500;
  color: #fff; background: transparent; border: 1.5px solid rgba(255,255,255,.5); text-decoration: none;
}
.tv2 a.tv2-closerband__btn--ghost:hover { border-color: #fff; color: #fff; text-decoration: none; }
.tv2-footer__main { background: #14203A; color: #fff; padding: 40px 0 48px; }
/* The thin rating strip. No hairlines (Guy, 2026-09-04): the spacing alone sets it off. */
.tv2-footer__rating { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 0 44px; padding: 18px 0; font-size: 16px; }
.tv2-footer__rating strong { font-weight: 700; }
.tv2-footer__rating-score { color: rgba(255,255,255,.8); }
.tv2-footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 40px; }
.tv2-footer__col-title { color: #94AEF2; font: 500 15px/1 'Circular', sans-serif; letter-spacing: .02em; padding-bottom: 12px; }
.tv2-footer__col-links { display: flex; flex-direction: column; }
.tv2-footer__col-links a { padding: 9px 0; font-weight: 500; font-size: 16px; color: #fff; text-decoration: none; }
.tv2-footer__col-links a:hover { color: #94AEF2; text-decoration: none; }
.tv2-footer__legal { background: #0E1526; color: rgba(255,255,255,.72); padding: 22px 0; }
.tv2-footer__legal-inner { max-width: 1120px; margin: 0 auto; padding: 0 24px; display: flex; gap: 20px; flex-wrap: wrap; align-items: center; font-size: 15px; }
.tv2-footer__copyright { font-size: 14px; color: rgba(255,255,255,.55); }
.tv2-footer__legal button { background: none; border: 0; padding: 0; cursor: pointer; font-family: 'Circular', sans-serif; font-size: 15px; font-weight: 500; color: rgba(255,255,255,.72); }
.tv2-footer__social { margin-left: auto; display: flex; gap: 18px; }
.tv2-footer__social a { color: rgba(255,255,255,.72); text-decoration: none; font-weight: 500; }
.tv2-footer__social a:hover { color: #fff; text-decoration: none; }

/* ==========================================================================
   Responsive — behaviour per the design's breakpoint set
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .tv2 * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media (max-width: 980px) {
  .tv2-footer__cols { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .tv2-tryone { margin-top: 0; max-width: 460px; }
  .tv2-toc, .tv2-sidebar { max-width: 460px; }
  .tv2-hero, .tv2-intro, .tv2-guide { grid-template-columns: minmax(0,1fr); gap: 32px; }
}
@media (max-width: 860px) {
  .tv2-nav { display: none; }
  .tv2-header__burger { display: flex; }
}
@media (max-width: 480px) {
  /* Phones: the filled Get Pro button stays, Sign in moves into the burger's reach via the menu. */
  .tv2 a.tv2-btn--signin { display: none; }
}
@media (max-width: 700px) {
  .tv2-ctaband__inner { grid-template-columns: minmax(0,1fr); }
  .tv2-faqs__grid { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 620px) {
  .tv2-pad, .tv2-hero-band__inner, .tv2-employers__inner, .tv2-ctaband__inner, .tv2-footer__legal-inner {
    padding-left: 20px; padding-right: 20px;
  }
}

/* Byline (shared: test/publisher/employer/industry v2) */
.tv2-byline { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; margin: 0 0 22px; padding-bottom: 20px; border-bottom: 1px solid #EDEFF4; }
.tv2-byline__avatar {
  width: 40px; height: 40px; border-radius: 50%; flex: none;
  background: repeating-linear-gradient(135deg, #E7EBF3 0 6px, #EDEFF4 6px 12px);
  display: flex; align-items: center; justify-content: center;
  font: 500 14px 'Circular', sans-serif; color: #5A6478;
}
.tv2-byline__name { margin: 0 0 3px; font-size: 15px; line-height: 1.4; color: #14203A; }
.tv2-byline__name b { font-weight: 500; }
/* The byline resolves to the writer's page. Beats .tv2 a (0,1,1) — house rule. */
.tv2 a.tv2-byline__link { color: inherit; text-decoration: none; }
.tv2 a.tv2-byline__link:hover { color: #1257E8; text-decoration: underline; }
.tv2-byline__meta { margin: 0; font-size: 13px; line-height: 1.45; color: #5A6478; }
.tv2-byline__meta a { color: inherit; text-decoration: underline; }

/* ---- The standard's shared-section rules, moved from test-v2.css on 2026-09-02
   (V2-STANDARD-TEMPLATE-DESIGN.md step 2b). Selectors unchanged, so the test pages render
   byte-identically; every family on the spine now gets the same guide typography, unboxed
   rail with one tick, types grid, diagram frame, FAQ and intro spacing. ---- */
.tv2 .tv2-hero__ctas--nofacts { margin-top: 26px; }
.tv2 .tv2-guide__section ul { list-style: disc; }
.tv2 .tv2-guide__section ol { list-style: decimal; }
.tv2 .tv2-guide__section li { display: list-item; }
.tv2 .tv2-guide__section ol.tv2-tips { list-style: none; }
.tv2 .tv2-guide__section ol.tv2-tips > li.tv2-tip { display: block; }
.tv2 .tv2-guide__section { scroll-margin-top: 24px; }
.tv2 .tv2-guide__section h2,
.tv2 .tv2-faq h3 { scroll-margin-top: 24px; }
.tv2 .tv2-guide__section--cms > :first-child { margin-top: 0; }
.tv2 .tv2-guide__section--cms h2 {
  margin: 40px 0 16px; font-size: 26px; line-height: 1.25; font-weight: 500;
  color: #14203A; max-width: 40ch; text-wrap: balance; scroll-margin-top: 24px;
}
.tv2 .tv2-guide__section--cms h2:first-child { margin-top: 0; }
.tv2 .tv2-guide__section--cms h3 {
  margin: 30px 0 12px; font-size: 20px; line-height: 1.3; font-weight: 500;
  color: #14203A; max-width: 46ch;
}
.tv2 .tv2-guide__section--cms h4 {
  margin: 24px 0 10px; font-size: 17px; line-height: 1.35; font-weight: 500; color: #14203A;
}
.tv2 .tv2-guide__section--cms img,
.tv2 .tv2-guide__section img {
  max-width: 100%; height: auto; display: block; margin: 20px 0; border-radius: 8px;
}
.tv2 .tv2-guide__section--cms blockquote {
  margin: 0 0 16px; padding: 2px 0 2px 18px; border-left: 3px solid #FF9500;
  color: #414B5E; font-size: 17px; line-height: 1.65;
}
.tv2 .tv2-guide__section--cms hr {
  border: 0; border-top: 1px solid #EDEFF4; margin: 32px 0;
}
.tv2 .tv2-guide__section--cms table { display: block; overflow-x: auto; max-width: 100%; }
.tv2 .tv2-sidebar { gap: 32px; }
.tv2 .tv2-toc,
.tv2 .tv2-sidebar__card { border: 0; border-radius: 0; padding: 0; margin: 0; background: transparent; }
.tv2 .tv2-qtypes__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 28px; margin-top: 18px; }
.tv2 .tv2-qtypes__item { padding: 14px 0; border-bottom: 1px solid #EDEFF4; }
.tv2 .tv2-qtypes__item h3 { margin: 0 0 6px; font-size: 18px; color: #14203A; }
.tv2 .tv2-qtypes__item p { margin: 0 0 8px; font-size: 15px; line-height: 1.55; color: #414B5E; }
.tv2 .tv2-qtypes__item a { font-size: 15px; color: #1257E8; text-decoration: none; }
.tv2 .tv2-qtypes__item a:hover { text-decoration: underline; }
.tv2 .tv2-qtypes__all { margin: 14px 0 0; font-size: 15px; }
.tv2 .tv2-qtypes__all a { color: #1257E8; text-decoration: none; }
.tv2 .tv2-qtypes__all a:hover { text-decoration: underline; }
.tv2 .tv2-diagram { margin: 22px 0 0; }
.tv2 .tv2-diagram__label { font: 500 11px/1 'IBM Plex Mono', monospace; letter-spacing: .07em; text-transform: uppercase; color: #5A6478; margin-bottom: 10px; }
.tv2 .tv2-diagram svg { display: block; width: 100%; height: auto; }
.tv2 .tv2-diagram__axis { display: flex; justify-content: space-between; margin: 4px 0 12px; font: 500 12px/1 'IBM Plex Mono', monospace; color: #5A6478; font-variant-numeric: tabular-nums; }
.tv2 .tv2-diagram__legend { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 14px; line-height: 1.4; color: #414B5E; }
.tv2 .tv2-diagram__swatch { display: inline-block; width: 11px; height: 11px; border-radius: 2px; margin-right: 8px; vertical-align: -1px; }
.tv2 .tv2-diagram__swatch--bulk { background: #DCE8FF; border: 1.5px solid #1257E8; }
.tv2 .tv2-diagram__swatch--top { height: 2px; background: #0E7A50; vertical-align: 3px; }
.tv2 .tv2-diagram figcaption { margin-top: 14px; font-size: 15px; line-height: 1.55; color: #5A6478; }
.tv2 .tv2-faqs { padding: 64px 0; }
.tv2 .tv2-intro-byline { padding: 48px 0 0; }
.tv2 .tv2-intro { padding-top: 26px; }
/* Breadcrumb centred under the single-column hero, as on the test pages (moved from test-v2.css
   2026-09-02: it was the one shared-class rule the first move missed). */
.tv2 .tv2-breadcrumb ol { justify-content: center; }
/* The no-sign-up alternative under the intro slot, where the hero button is the pack's own free test behind sign-in. */