/* EXM overrides — loaded last on every page (home + interior).
   Only rules that the prototype could not carry: WordPress/Gravity Forms
   markup that does not exist in the static design. */

/* ── Gravity Forms inside the booking panel ──────────────────────────────
   gravity-theme is loaded with --no-framework, so .gform_fields has no grid
   of its own and the width classes collapse to intrinsic input widths. Declare
   the 12-column grid here so half fields are half of the CARD, not of nothing. */
.book .exm-form-embed,.book .gform_wrapper,.book .gform_wrapper form,
.book .gform_wrapper .gform_body{width:100%;max-width:none}
.book .gform_wrapper .gform_fields{display:grid;grid-template-columns:repeat(12,1fr);
column-gap:14px;row-gap:14px;width:100%;margin:0;padding:0;list-style:none}
.book .gform_wrapper .gfield{grid-column:1/-1;min-width:0;margin:0}
.book .gform_wrapper .gfield--width-half{grid-column:span 6}
.book .gform_wrapper .gfield--width-third{grid-column:span 4}
.book .gform_wrapper .gfield--width-quarter{grid-column:span 3}
.book .gform_wrapper .gfield--width-full{grid-column:1/-1}
.book .gform_wrapper .ginput_container,
.book .gform_wrapper .ginput_complex{width:100%}
.book .gform_wrapper input[type=text],.book .gform_wrapper input[type=email],
.book .gform_wrapper input[type=tel],.book .gform_wrapper input[type=url],
.book .gform_wrapper input[type=number],.book .gform_wrapper select,
.book .gform_wrapper textarea{width:100%;max-width:100%;box-sizing:border-box}
.book .gform_wrapper .gform_footer{grid-column:1/-1;display:block;width:100%}
@media(max-width:620px){.book .gform_wrapper .gfield--width-half,
.book .gform_wrapper .gfield--width-third,
.book .gform_wrapper .gfield--width-quarter{grid-column:1/-1}}

/* The design CSS makes `.book form` a 2-col grid (for the prototype's hand-built
   form). Gravity Forms puts its own grid on .gform_fields, so the outer form must
   go back to block flow or every field is trapped in a 224px column. */
.book .gform_wrapper form,.book form.exm-booking{display:block;grid-template-columns:none;gap:0}
.book .gform_wrapper .gform_fields>*{grid-column:span 12}
.book .gform_wrapper .gfield--width-half{grid-column:span 6}
.book .gform_wrapper .gfield--width-third{grid-column:span 4}
.book .gform_wrapper .gfield--width-quarter{grid-column:span 3}

/* Footer utility links (Contact / Privacy / Terms) come from the handoff Nav Map,
   not the prototype, so keep them quiet: same vocabulary as footer .links, dimmer,
   no divider rule so the footer still reads like the design. */
footer .legal{display:flex;flex-wrap:wrap;gap:22px;margin-top:20px}
footer .legal a{font-family:Montserrat,sans-serif;font-size:11px;font-weight:700;
letter-spacing:.14em;text-transform:uppercase;color:rgba(233,233,238,.34)}
footer .legal a:hover{color:var(--purple-bright)}
@media(max-width:620px){footer .legal{gap:12px 18px}}

/* ── Button rows follow the alignment of the copy above them ─────────────
   exm-design.css sets `.btnrow{justify-content:center}` because on the
   homepage every .btnrow sits in a centered band. template-parts/exm/intro.php
   reuses the same class inside `.hero-intro`, whose eyebrow/heading/lead are
   left-aligned, so 53 button rows across 22 pages rendered centered under
   left-aligned text. Rule (Trenton, 8-11): text and buttons never disagree.
   The .center escape hatch keeps a future centered hero honest. */
.hero-intro .btnrow{justify-content:flex-start}
.hero-intro.center .btnrow,.hero-intro .center .btnrow{justify-content:center}

/* ─────────────────────────────────────────────────────────────────────────
   QA pass — Trenton, 2026-08-12. Sitewide rules from the screenshot review.
   ───────────────────────────────────────────────────────────────────────── */

/* 1 ── Copy never touches the element above it.
   Adjacent-sibling only, so nothing that already has room is changed and no
   band's rhythm is rewritten: this just guarantees a 20px minimum where two
   text blocks currently sit flush (e.g. the bullet list on the insight
   "Three places it shows up" band). */
.wrap h1 + p,.wrap h2 + p,.wrap h3 + p,.wrap h4 + p,.wrap h5 + p,.wrap h6 + p,
.wrap h2 + ul,.wrap h2 + ol,.wrap h3 + ul,.wrap h3 + ol,.wrap h4 + ul,.wrap h4 + ol,
.wrap p + h2,.wrap p + h3,.wrap p + h4,.wrap ul + h2,.wrap ul + h3,.wrap ol + h3,
.wrap p + ul,.wrap p + ol,.wrap ul + p,.wrap ol + p,
.wrap p + p{margin-top:20px}
.wrap li > p{margin-bottom:0}

/* 2 ── A row never ends in an orphan.
   The design's card grids are 3-up. With four cards that leaves a lone card
   on row two; with two it leaves a hole. Match the column count to the item
   count so every row is full — the "2 rows of 2" standard. Only exact counts
   are touched, so 3-, 5- and 6-card rows keep the designed 3-up rhythm. */
.grid3:has(> :last-child:nth-child(4)),
.cards3:has(> :last-child:nth-child(4)),
.ccards:has(> :last-child:nth-child(4)),
.facegrid:has(> :last-child:nth-child(4)),
.checkgrid:has(> :last-child:nth-child(4)){grid-template-columns:repeat(2,1fr)}
/* ── Standardized numbered card styling across all card types ────
   All numbered cards (pcard, ccard, etc.) use the same bordered box style
   for consistency across the site. Icons are preserved. */
.pcard,.ccard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:30px 28px 32px;display:flex;flex-direction:column;text-align:center;align-items:center}
.pcard h3,.ccard h3{font-size:22px;margin-bottom:10px;margin-top:0;text-align:center;border:0}
.pcard p,.ccard p{color:var(--body);font-size:16px;line-height:1.55;margin:0;text-align:center;border:0}
.pcard .cicowrap,.ccard .cicowrap{display:block;width:auto;height:auto;min-width:0;padding:0;margin:0 auto 20px;background:none;border:0;border-radius:0}
.pcard .stepno,.pcard .stepno--card,.ccard .stepno{width:auto;height:auto;min-width:0;padding:0;border:0;border-radius:0;display:block;margin:auto;margin-bottom:22px;line-height:1;font-size:inherit;letter-spacing:0;background:none;text-align:center}
.pcard .stepno-k,.ccard .stepno-k{display:block;text-align:center;font-family:Oswald,"oswald",sans-serif;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--purple-bright);margin-bottom:12px}
/* Step numerals use the header CTA gradient (--grad-accent, #E05547 to
   #C23D31) sitewide. The old purple-to-pink #E06BD1 gradient is retired;
   pink is not in the palette (Trenton, 2026-09-15). */
.pcard .stepno-n,.ccard .stepno-n{display:block;text-align:center;font-family:Oswald,"oswald",sans-serif;font-size:58px;font-weight:700;line-height:1.04;letter-spacing:-.02em;padding:16px 0;background:var(--grad-accent);-webkit-background-clip:text;background-clip:text;color:transparent}
.grid3:has(> :last-child:nth-child(2)),
.cards3:has(> :last-child:nth-child(2)),
.ccards:has(> :last-child:nth-child(2)),
.facegrid:has(> :last-child:nth-child(2)){grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){
  .grid3:has(> :last-child:nth-child(4)),.cards3:has(> :last-child:nth-child(4)),
  .ccards:has(> :last-child:nth-child(4)),.facegrid:has(> :last-child:nth-child(4)),
  .checkgrid:has(> :last-child:nth-child(4)),
  .grid3:has(> :last-child:nth-child(2)),.cards3:has(> :last-child:nth-child(2)),
  .ccards:has(> :last-child:nth-child(2)),.facegrid:has(> :last-child:nth-child(2)){
    grid-template-columns:1fr}
}

/* 3 ── Numbered cards read as a sequence, not as a label.
   `.face .num` was a 16px caption. Make the number the card's anchor: large
   gradient numeral, hairline rule, and a top accent that lights on hover, so
   "01 → 02 → 03" scans as steps. Same treatment everywhere a numbered card
   appears (growth killers, the four faces, the three questions). */
.face:has(> .num){position:relative;padding-top:30px}
.face > .num{font-family:Oswald,"oswald",sans-serif;font-size:40px;font-weight:600;line-height:1;
  letter-spacing:.02em;margin-bottom:14px;padding-bottom:14px;
  border-bottom:1px solid rgba(128,50,216,.28);
  background:linear-gradient(100deg,#B16BFF 8%,#8F3FE3 92%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.center .face > .num{text-align:inherit}
@media(max-width:620px){.face > .num{font-size:32px}}

/* 4 ── Card visuals are real images, not CSS backgrounds.
   `.quote-card::before` painted a decorative gradient with the brand chevron.
   Where a post now has a featured image, `exm_card_thumb()` prints a real
   <img alt> and the decorative block stands down. */
.quote-card:has(> .qc-thumb)::before{content:none;display:none}
/* WordPress prints width/height attributes on the thumbnail. Those are
   presentational hints, so `height` resolves to the file's intrinsic height
   and the aspect-ratio is ignored — the cards rendered at whatever shape the
   photo happened to be. Declaring height:auto hands the box back to
   aspect-ratio, and flex:0 0 auto stops the flex column stretching it. */
.quote-card > .qc-thumb{display:block;width:100%;height:auto;aspect-ratio:16/9;
  flex:0 0 auto;object-fit:cover;object-position:center 32%;
  padding:0;border-bottom:1px solid var(--line);background:var(--panel-2)}
.quote-card:hover > .qc-thumb{filter:saturate(1.06)}

/* An insight opens with its own image beside the title, inside the hero. */
.page-hero .hero-split{display:grid;grid-template-columns:1fr 360px;gap:44px;align-items:center}
.page-hero .hero-split h1{margin:0}
.hero-shot{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line);
  aspect-ratio:16/10;background:var(--card);box-shadow:0 20px 50px rgba(0,0,0,.35)}
.hero-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 32%}
@media(max-width:1024px){.page-hero .hero-split{grid-template-columns:1fr 280px;gap:30px}}
@media(max-width:820px){
  .page-hero .hero-split{grid-template-columns:1fr;gap:22px}
  .hero-shot{max-width:420px;aspect-ratio:16/9}
}

/* 5 ── Comparison lists keep their footing.
   The EOS/3D tables ran their last row into the panel edge. */
.cmp-wrap .cmp tbody tr:last-child th,
.cmp-wrap .cmp tbody tr:last-child td{padding-bottom:26px}

/* 6 ── Photography bands.
   One real <img> per band, pre-cropped so no one is cut off, lazy-loaded and
   bounded so a photo never dominates a copy-led page. */
.bandphoto{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line);
  background:var(--card);aspect-ratio:var(--band-ratio,16/9)}
.bandphoto img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:620px){.bandphoto{aspect-ratio:4/3}}

/* 7 ── The founder portrait scrolls with the story instead of stretching to it.
   `.origin .photo` had no height of its own, so in a two-column band it grew to
   the full height of the copy. Cap it, give it a portrait crop, and let it stick
   while the origin story scrolls past. */
.origin .split{align-items:start}
.origin .photo{position:sticky;top:104px;align-self:start;aspect-ratio:4/5;
  max-height:min(70vh,620px)}
.origin .photo img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){
  .origin .photo{position:static;aspect-ratio:16/10;max-height:none}
}

/* 8 ── The play button sits in the corner, not over someone's face.
   `.vcard .thumb .play` was centred with inset:0;margin:auto, which lands
   squarely on the speaker in a talking-head still. Move it to the bottom
   right, matching the founder video on the homepage (.origin .photo .play).
   The stage tag is already bottom-left, so the two do not collide. */
.vcard .thumb .play{inset:auto 18px 18px auto;margin:0;width:52px;height:52px}
@media(max-width:620px){.vcard .thumb .play{inset:auto 14px 14px auto;width:46px;height:46px}}


/* 12 ── Quoted cards get the homepage quote glyph.
   Trenton, 2026-08-12: the styled quote cards looked unintentional without it.
   `is-quote` is added server-side by exm_mark_quote_faces() only when the card
   body really is a quotation, so third-person summary cards keep a clean top.
   Matches the front page's .origin blockquote glyph. */
.face.is-quote,
.quote-card.is-quote{position:relative}
.face.is-quote > h3,
.quote-card.is-quote > h3{margin-top:20px}
.face.is-quote::after,
.quote-card.is-quote::after{content:"\201C";position:absolute;left:30px;top:12px;
  font-family:Oswald,"oswald",sans-serif;font-size:58px;line-height:1;font-weight:600;
  background:linear-gradient(100deg,#B16BFF 8%,#8F3FE3 92%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  pointer-events:none}
.center .face.is-quote::after{left:50%;transform:translateX(-50%)}
@media (max-width:640px){
  .face.is-quote::after,
  .quote-card.is-quote::after{font-size:46px;left:24px;top:10px}
  .face.is-quote > h3,
  .quote-card.is-quote > h3{margin-top:16px}
}

/* 12 ── The founder portrait overflowed its column and sat under the copy.
   `.origin .photo` still carried `min-height:100%` from exm-design.css, which
   in a grid row forces the full height of the story column (1338px at 1440).
   `aspect-ratio:4/5` then derives the WIDTH from that height, so the anchor
   grew to ~1071px, spilled out of its 447px column and the paragraphs rendered
   on top of the photo. Reset the min-height so height comes from the aspect
   ratio and the max-height cap, then sticky works as intended: real <img>
   pinned on the left while the origin copy scrolls past on the right. */
.origin .photo{min-height:0}
@media(min-width:901px){
  .origin .photo{width:100%;height:auto}
}

/* 13 ── The origin portrait actually sticks, and its top lines up with the copy.
   The anchor carried an inline `style="position:relative"`, which beat the
   stylesheet's `position:sticky` (inline always wins). Two visible consequences:
   the photo never stuck while the story scrolled, and `top:104px` was applied as
   a relative OFFSET, pushing the photo 104px below the eyebrow. Removing the
   inline style in front-page.php and page-templates/about.php restores sticky,
   so top:104px only acts as the pinned offset under the fixed header and the
   photo's natural top aligns with the first line of the right column.
   Belt and braces in case the inline style ever comes back: */
.origin .photo{position:sticky!important;margin-top:0}
@media(max-width:900px){.origin .photo{position:static!important}}

/* 14 ── Assessment gate + result: the submit label bled outside its pill.
   Root cause chain, measured on the assessment take pages: `.qstep{max-width:780px}`
   caps the step, `.resgrid{grid-template-columns:1fr 1fr;gap:44px}` halves it to
   ~368px, and `.book` eats 44px of padding each side, leaving ~280px of inner
   width. The submit carried `.btn{white-space:nowrap;padding:17px 36px}` with a
   36-character label, which needs ~430px — so the text ran straight through the
   rounded edges. Three independent fixes so this cannot regress: a wider step for
   the two post-quiz screens, a shorter label (in the template), and a pill that
   wraps and centres instead of overflowing. */
.qstep.qstep-wide{max-width:1080px!important}
.qstep-wide .resgrid{grid-template-columns:1fr 1.06fr!important;gap:52px}
@media(max-width:900px){.qstep-wide .resgrid{grid-template-columns:1fr!important;gap:34px}}
.book .btn,.qstep .btn{white-space:normal;text-align:center;line-height:1.25;max-width:100%;
  padding-left:26px;padding-right:26px}
.gatecard{padding:38px 38px 32px}
.gatecard-h{font-size:clamp(21px,1.6vw,25px)!important;line-height:1.12}
.gatecard form{margin-top:20px!important}
.gatecard .btn{padding-top:18px;padding-bottom:18px;font-size:13.5px}

/* Gate selects were never styled — they inherited the browser control, so they
   sat a few pixels off the inputs and their placeholder read as solid white
   while the real inputs' placeholders were grey. Match them to the inputs,
   supply our own chevron, and grey the not-yet-chosen state. */
#gateForm select{grid-column:span 2;-webkit-appearance:none;appearance:none;background:#0C0719;
  border:1px solid rgba(128,50,216,.35);border-radius:10px;padding:15px 44px 15px 18px;color:#fff;
  font-family:Barlow,sans-serif;font-size:15px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23AF7EE7' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 18px center}
#gateForm select:focus{outline:none;border-color:var(--purple-bright);
  box-shadow:0 0 0 3px rgba(200,107,255,.18);background-color:#110A24}
#gateForm select:has(option[value=""]:checked){color:rgba(233,233,238,.4)}
#gateForm select option{background:#120A27;color:#fff}
@media(max-width:640px){#gateForm select{font-size:16px}}

/* ── The Momentum Method pyramid ───────────────────────────────────────────
   Interactive pyramid on the Business Operating System pillar. Brand tokens
   only: no literal hex, so a future palette change carries automatically.
   Responsive by construction: the pyramid is a viewBox SVG, and the panel
   drops below it under 900px rather than forcing a horizontal minimum. */
.exm-pyr {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px;
	align-items: center;
	text-align: left;
	margin-top: 44px;
}

.exm-pyr__fig {
	min-width: 0;
}

.exm-pyr__fig svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.exm-pyr__band {
	cursor: pointer;
	outline: none;
}

.exm-pyr__band polygon {
	fill: var(--purple-deep);
	stroke: var(--line);
	stroke-width: 1;
	transition: fill .25s ease;
}

.exm-pyr__band:hover polygon {
	fill: color-mix(in srgb, var(--purple) 45%, var(--purple-deep));
}

.exm-pyr__band.is-on polygon {
	fill: var(--purple);
	stroke: var(--purple-soft);
}

.exm-pyr__band:focus-visible polygon {
	stroke: var(--ink);
	stroke-width: 2;
}

.exm-pyr__label {
	font-family: Oswald, sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-anchor: middle;
	fill: var(--ink);
	opacity: .62;
	pointer-events: none;
	transition: opacity .25s ease;
}

.exm-pyr__band.is-on .exm-pyr__label,
.exm-pyr__band:hover .exm-pyr__label {
	opacity: 1;
}

.exm-pyr__pill {
	fill: none;
	stroke: var(--line);
	pointer-events: none;
}

.exm-pyr__pilltext {
	font-family: Montserrat, sans-serif;
	font-size: 9px;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-anchor: middle;
	fill: var(--ink);
	opacity: .6;
	pointer-events: none;
}

.exm-pyr__panel {
	min-width: 0;
	border-left: 1px solid var(--line);
	padding-left: 40px;
}

.exm-pyr__kicker {
	font-family: Montserrat, sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--purple-soft);
	margin-bottom: 14px;
}

.exm-pyr__title {
	font-family: Oswald, sans-serif;
	font-size: clamp(30px, 4vw, 48px);
	line-height: 1.04;
	font-weight: 700;
	letter-spacing: .01em;
	text-transform: uppercase;
	color: var(--ink);
	margin: 0 0 14px;
}

.exm-pyr__blurb {
	font-family: Barlow, sans-serif;
	font-size: 18px;
	line-height: 1.55;
	color: var(--body);
	margin: 0;
}

.exm-pyr__items {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 26px;
}

.exm-pyr__item {
	flex: 1 1 auto;
	min-width: 0;
}

.exm-pyr__itembtn {
	display: block;
	width: 100%;
	font-family: Montserrat, sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ink);
	background: transparent;
	border: 1px solid var(--line);
	border-radius: 4px;
	padding: 13px 16px;
	cursor: pointer;
	text-align: left;
	transition: background .2s ease, border-color .2s ease;
}

.exm-pyr__itembtn:hover {
	border-color: var(--purple-soft);
	background: rgba(128, 50, 216, .16);
}

.exm-pyr__itembtn.is-on {
	background: var(--purple);
	border-color: var(--purple);
}

.exm-pyr__itemtext {
	font-family: Barlow, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color: var(--body);
	padding: 14px 2px 2px;
	flex-basis: 100%;
}

/* The item row wraps as a grid of chips; an open description spans the row. */
.exm-pyr__items {
	align-items: flex-start;
}

.exm-pyr__item:has(.exm-pyr__itemtext:not([hidden])) {
	flex-basis: 100%;
}

/* No-JS and pre-hydration fallback: the content is real markup, not a spinner. */
.exm-pyr-fallback {
	font-family: Barlow, sans-serif;
	color: var(--body);
	text-align: left;
	margin-top: 32px;
	padding-left: 20px;
}

.exm-pyr-fallback strong {
	font-family: Oswald, sans-serif;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--ink);
}

@media (max-width: 900px) {
	.exm-pyr {
		grid-template-columns: minmax(0, 1fr);
		gap: 30px;
	}

	.exm-pyr__panel {
		border-left: 0;
		border-top: 1px solid var(--line);
		padding-left: 0;
		padding-top: 26px;
	}

	/* The SVG scales down with the column, so label sizes are multiplied by
	   the render scale. They have to grow in viewBox units to stay legible. */
	.exm-pyr__label {
		font-size: 21px;
	}

	/* Pill text stays at its base size: the pill rect is a fixed 84 viewBox
	   units, so enlarging the text pushes it outside the pill. */
}

@media (max-width: 560px) {
	.exm-pyr__label {
		font-size: 30px;
	}

	/* Below this width the four pills render under 8px on screen. The panel
	   already says "Four 90 Day Plans", so drop them rather than ship
	   unreadable text. */
	.exm-pyr__pill,
	.exm-pyr__pilltext {
		display: none;
	}

	.exm-pyr__items {
		display: block;
	}

	.exm-pyr__item + .exm-pyr__item {
		margin-top: 8px;
	}

	.exm-pyr__blurb {
		font-size: 17px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.exm-pyr__band polygon,
	.exm-pyr__label,
	.exm-pyr__itembtn {
		transition: none;
	}
}

/* ── Assessment gate: phone + consent ─────────────────────────────────── */
.gatecard .gconsent{grid-column:1/-1;display:flex;gap:9px;align-items:flex-start;margin:4px 0 14px;
  font-size:12.5px;line-height:1.5;color:rgba(233,233,238,.72);text-align:left;cursor:pointer}
.gatecard .gconsent input{width:16px;height:16px;margin:1px 0 0;accent-color:#8032D8;flex:0 0 auto}

/* ── Personal report: /report/{token}/ ────────────────────────────────── */
.exm-report{padding:120px 0 90px;background:#0C0719}
.exm-report .wrap{max-width:820px;margin:0 auto;padding:0 20px}
.exm-report .rep-eyebrow{font-family:Montserrat,sans-serif;text-transform:uppercase;letter-spacing:1.4px;
  font-size:12px;font-weight:700;color:#AF7EE7;margin:0 0 10px}
.exm-report .rep-h1{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:clamp(30px,5vw,52px);
  line-height:1.06;color:#fff;margin:0 0 34px}
.exm-report h2{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:22px;color:#fff;margin:0 0 16px}
.exm-report .rep-top{display:grid;grid-template-columns:minmax(210px,300px) 1fr;gap:40px;align-items:center;
  background:#170E30;border:1px solid rgba(128,50,216,.35);border-radius:18px;padding:34px 34px;margin-bottom:22px}
.exm-report .rep-num{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px}
.exm-report .rep-total{font-family:Oswald,sans-serif;font-size:clamp(64px,8vw,92px);line-height:.92;color:#fff}
.exm-report .rep-of{font-size:22px;color:rgba(233,233,238,.6)}
.exm-report .rep-lbl{display:block;width:100%;font-family:Montserrat,sans-serif;text-transform:uppercase;
  letter-spacing:1.1px;font-size:11px;font-weight:700;color:#AF7EE7;margin-top:12px}
.exm-report .rep-chip{display:inline-block;margin-top:14px;background:#8032D8;color:#fff;font-family:Montserrat,sans-serif;
  font-weight:700;font-size:13px;letter-spacing:.4px;padding:11px 22px;border-radius:999px}
.exm-report .rep-bandcopy{width:100%;margin:14px 0 0;color:rgba(233,233,238,.75);font-size:14.5px;line-height:1.6}
.exm-report .rep-move,.exm-report .rep-cta{background:#120A27;
  border:1px solid rgba(128,50,216,.35);border-radius:18px;padding:26px 30px;margin-bottom:22px}
.exm-report .rep-top .rep-dims{display:flex;flex-direction:column;gap:22px}
.exm-report .rep-dim{margin:0}
.exm-report .rep-dim-h{display:flex;justify-content:space-between;align-items:baseline;
  font-size:16px;color:rgba(233,233,238,.8);margin-bottom:7px}
.exm-report .rep-dim-h i{font-style:normal;font-size:13px;color:rgba(233,233,238,.6)}
.exm-report .rep-dim-h i b{color:#fff;font-size:16px}
.exm-report .rep-bar{height:8px;border-radius:99px;background:rgba(128,50,216,.2);overflow:hidden}
.exm-report .rep-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#8032D8,#AF7EE7)}
.exm-report .rep-dim.is-focus .rep-bar i{background:linear-gradient(90deg,#D2483C,#8032D8)}
.exm-report .rep-focusline{margin:0 0 24px;padding:0 4px;font-size:15px;line-height:1.6;color:rgba(233,233,238,.75)}
.exm-report .rep-focusline b{color:#fff}
.exm-report .rep-move p,.exm-report .rep-cta p{color:rgba(233,233,238,.75);font-size:15.5px;line-height:1.6;margin:0 0 18px}
.exm-report .rep-fine{margin:26px 0 0;font-size:12.5px;color:rgba(233,233,238,.5);text-align:center}
@media(max-width:860px){.exm-report .rep-top{grid-template-columns:1fr;gap:26px;align-items:start}}
@media(max-width:600px){.exm-report{padding:96px 0 70px}
  .exm-report .rep-top,.exm-report .rep-move,.exm-report .rep-cta{padding:22px 18px}
  .exm-report .rep-total{font-size:52px}}

/* Homepage hero video: keep faces in frame when the 16:9 source is cropped to a
   tall hero on narrow viewports (Trenton, 2026-08-14). */
.hero video{object-position:top}

/* ==========================================================================
   QA sheet fixes — Trenton, 2026-08-14 (batch 1)
   ========================================================================== */

/* Row "3D Diagnostic" + "Business Growth Strategies": the closing
   "Start with one conversation." band was flat and blended into the section
   above. Give it the homepage assessment-panel treatment (gradient card,
   purple edge, X watermark) on a darker page band, and center the copy. */
.closing.tone{background:var(--bg) !important}
.closing > .wrap:not(.split) > div{
  background:linear-gradient(160deg,#170E30 0%,#120A27 100%);
  border:1px solid var(--purple);border-radius:18px;
  padding:64px 56px;position:relative;overflow:hidden;
  box-shadow:0 0 80px rgba(128,50,216,.16);text-align:left}
.closing > .wrap:not(.split) > div::after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	background: url(assets/x-watermark.png) center / 240% no-repeat;
	opacity: .14;
	pointer-events: none;
}
.closing > .wrap:not(.split) > div > *{position:relative;z-index:1}
.closing > .wrap:not(.split) > div p{max-width:720px;margin-left:0;margin-right:0}
.closing > .wrap:not(.split) > div .btnrow{justify-content:flex-start}
@media(max-width:600px){
  .closing > .wrap:not(.split) > div{padding:40px 22px}}

/* Row "About": tighten the gap between the mission copy and the band photo
   (was 221px, requested 40-50px). */
.page-about .center.tone:has(+ section.tone .bandphoto){padding-bottom:0}
.page-about section.tone:has(> .wrap > .bandphoto){padding-top:45px}

/* Row "Book a Call": the FAQs band shared the exact background of the
   "Other ways to reach us" band above it, so the two bled together. */
.page-book-a-call section.center:has(.faqlist){background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* Row "Business Growth Strategies": "The three levers" callouts go to three
   columns instead of two. */
.page-business-growth-strategies .problem .checkgrid{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){
  .page-business-growth-strategies .problem .checkgrid{grid-template-columns:1fr}}

/* ============================================================
   QA sheet - batch 2 (2026-08-14)
   ============================================================ */

/* SITEWIDE: interior page hero uses a fixed 350px minimum on desktop
   instead of a viewport-relative height. */
@media(min-width:1025px){
  .page-hero{min-height:350px}}

/* Row "EXM vs. EOS": "The difference" and "How a transition works" put the
   intro copy in a left column (left aligned) and the callouts on the right. */
.page-exit-vs-eos section:nth-of-type(4) > .wrap,
.page-exit-vs-eos section:nth-of-type(7) > .wrap{
  display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  column-gap:56px;row-gap:0;grid-auto-rows:min-content;align-items:start;text-align:left}
.page-exit-vs-eos section:nth-of-type(4) > .wrap > *,
.page-exit-vs-eos section:nth-of-type(7) > .wrap > *{grid-column:1;text-align:left;max-width:none;margin-left:0;margin-right:0;margin-bottom:22px}
.page-exit-vs-eos section:nth-of-type(4) > .wrap > .eyebrow,
.page-exit-vs-eos section:nth-of-type(7) > .wrap > .eyebrow{justify-content:flex-start}
.page-exit-vs-eos section:nth-of-type(4) > .wrap > .checkgrid,
.page-exit-vs-eos section:nth-of-type(7) > .wrap > .checkgrid{
  grid-column:2;grid-row:1 / span 40;grid-template-columns:1fr;gap:16px;align-self:start;margin-bottom:0}
@media(max-width:900px){
  .page-exit-vs-eos section:nth-of-type(4) > .wrap,
  .page-exit-vs-eos section:nth-of-type(7) > .wrap{grid-template-columns:1fr}
  .page-exit-vs-eos section:nth-of-type(4) > .wrap > .checkgrid,
  .page-exit-vs-eos section:nth-of-type(7) > .wrap > .checkgrid{grid-column:1;grid-row:auto}}

/* Row "How EXM Works": drop the side photos on the two step sections and run
   the headline in one column, the body copy in the other. Multi-column with an
   explicit break after the headline keeps eyebrow+headline together on the
   left without leaving a dead first grid row. */
.page-how-it-works section:not(.closing) > .wrap.split > .photo{display:none}
.page-how-it-works section:not(.closing) > .wrap.split{grid-template-columns:1fr;gap:0}
.page-how-it-works section:not(.closing) > .wrap.split > div{column-count:2;column-gap:56px}
.page-how-it-works section:not(.closing) > .wrap.split > div > *{break-inside:avoid}
.page-how-it-works section:not(.closing) > .wrap.split > div > .stepeyebrow{margin-bottom:10px}
.page-how-it-works section:not(.closing) > .wrap.split > div > h2{margin-top:0;break-after:column}
.page-how-it-works section:not(.closing) > .wrap.split > div > p:first-of-type{margin-top:0 !important}
@media(max-width:900px){
  .page-how-it-works section:not(.closing) > .wrap.split > div{column-count:1}
  .page-how-it-works section:not(.closing) > .wrap.split > div > h2{break-after:auto;margin-bottom:20px}}

/* Coach pages: exactly three reviews sit on one row of three instead of
   wrapping to two-then-one. */
.marquee--coach.is-static:has(> .rev:nth-child(3):last-child){
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.marquee--coach.is-static:has(> .rev:nth-child(3):last-child) > .rev{width:auto;flex:1 1 auto}
@media(max-width:900px){
  .marquee--coach.is-static:has(> .rev:nth-child(3):last-child){grid-template-columns:1fr}}

/* Assessment pages: the closing assess box was flush against the top of its
   section; match the bottom padding. */
.single-assessment section.assess{padding-top:110px}
@media(max-width:900px){
  .single-assessment section.assess{padding-top:70px}}

/* Break the Growth Ceiling: give the "Proof" band its own background so it
   doesn't bleed into the sections above and below. */
.pillar-break-the-growth-ceiling section:nth-of-type(7){
  background:#120A27;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* Case study pages: client logo chip, tighter intro-to-video spacing, and
   "The challenge / What changed / The result" as cards. */
.single-result .cslogosec{padding:0}
.single-result .cslogosec {
    padding-top: 0 !important;
    padding-bottom: 110px;
}
.single-result .cslogosec .wrap{padding-top:34px;padding-bottom:0}
.single-result .cslogo{display:inline-flex;align-items:center;justify-content:center;
  background:#fff;border-radius:16px;padding:20px 30px;min-height:96px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.single-result .cslogo img{display:block;width:auto;height:auto;max-width:260px;max-height:56px;object-fit:contain}
.single-result .hero-intro{padding-bottom:0}
.single-result section:has(> .casebody){padding-top:0}
.single-result .casebody{padding-top:46px}
.single-result .casebody > .casecard{
  background:var(--panel-2);border:1px solid var(--line);border-radius:18px;
  padding:28px 32px 30px;margin:34px 0 0}
.single-result .casebody > .casecard > h3{margin:0 !important;padding:0;border:0}
.single-result .casebody > .casecard > .casecard__body{margin-top:14px;padding:0;border:0}
.single-result .casebody > .casecard > .casecard__body > *:first-child{margin-top:0}
@media(max-width:600px){
  .single-result .cslogo{padding:16px 22px;min-height:80px}
  .single-result .cslogo img{max-width:200px;max-height:46px}
  .single-result .casebody > .casecard{padding:22px 22px 24px}}

/* SITEWIDE: step eyebrows used a bordered pill that appears nowhere else on
   the site - match the plain eyebrow treatment and tighten the gap to the
   headline that the pill was creating. */
.stepeyebrow{border:0;border-radius:0;padding:0;background:none;
  font-family:"montserrat",sans-serif;font-weight:700;font-size:13px;letter-spacing:.2em;
  color:var(--purple-soft);margin-bottom:14px}
.page-how-it-works section:not(.closing) > .wrap.split > div > .stepeyebrow{margin-bottom:8px}
.page-how-it-works section:not(.closing) > .wrap.split > div > h2{margin-top:0}

/* ===================================================================
   Guides. QA sheet, Get Unstuck: "It's just a waterfall of text. Break
   up the text a bit, add callouts for important text... add value to
   the text, not just visual improvements."
   =================================================================== */

/* Chapter nav at the top of every guide. */
.gtoc{
  border:1px solid var(--line);border-radius:18px;background:var(--panel-2);
  padding:28px 30px;margin:0 0 46px}
.gtoc .gtoc-t{
  font-family:"montserrat",sans-serif;font-weight:700;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--purple-soft);
  margin:0 0 16px}
.gtoc ol{list-style:none;margin:0;padding:0;counter-reset:gtoc;
  display:grid;grid-template-columns:1fr 1fr;gap:10px 34px}
.gtoc li{counter-increment:gtoc;margin:0;padding:0}
.gtoc li::before{content:counter(gtoc,decimal-leading-zero);
  font-family:"montserrat",sans-serif;font-weight:700;font-size:12px;
  color:var(--purple);margin-right:12px}
.gtoc a{color:var(--ink);text-decoration:none;font-size:16px;line-height:1.5;
  border-bottom:1px solid transparent;transition:border-color .2s,color .2s}
.gtoc a:hover{color:var(--purple-soft);border-bottom-color:var(--purple)}

/* Cards: the guide bodies' bare <ul> lists become real cards. */
.gcards{list-style:none;margin:34px 0;padding:0;display:grid;gap:18px}
.gcards.g3{grid-template-columns:repeat(3,1fr)}
.gcards.g2{grid-template-columns:repeat(2,1fr)}
.gcards > li{
  margin:0;padding:26px 26px 28px;background:var(--card);
  border:1px solid var(--line);border-radius:16px;
  font-size:17px;line-height:1.65;color:rgba(255,255,255,.82)}
.gcards > li strong{
  display:block;font-family:"oswald",sans-serif;font-weight:600;
  font-size:20px;letter-spacing:.01em;color:var(--ink);margin-bottom:10px}

/* Pull quote: one line per chapter that carries the argument. */
.gpull{
  margin:44px 0;padding:6px 0 6px 28px;border-left:3px solid var(--purple);
  font-family:"oswald",sans-serif;font-weight:400;font-size:clamp(22px,2.4vw,30px);
  line-height:1.34;color:var(--ink)}
.gpull span{color:var(--purple-soft)}

/* Callout: added value, not restated body copy. */
.gkey{
  margin:38px 0;padding:26px 28px;border-radius:16px;
  background:linear-gradient(135deg,rgba(128,50,216,.16),rgba(36,25,84,.28));
  border:1px solid var(--line)}
.gkey .gkey-t{
  font-family:"montserrat",sans-serif;font-weight:700;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--purple-soft);
  margin:0 0 10px}
.gkey p{margin:0;font-size:17px;line-height:1.7;color:rgba(255,255,255,.9)}
.gkey p + p{margin-top:12px}
.gkey.accent{
  background:linear-gradient(135deg,rgba(210,72,60,.14),rgba(18,10,39,.4));
  border-color:rgba(210,72,60,.4)}
.gkey.accent .gkey-t{color:var(--accent)}

/* Numbered moves. */
.gsteps{list-style:none;margin:34px 0;padding:0;counter-reset:gstep;display:grid;gap:16px}
.gsteps > li{
  counter-increment:gstep;margin:0;position:relative;
  padding:26px 28px 28px 78px;background:var(--card);
  border:1px solid var(--line);border-radius:16px;
  font-size:17px;line-height:1.65;color:rgba(255,255,255,.82)}
.gsteps > li::before{
  content:counter(gstep);position:absolute;left:26px;top:26px;
  width:36px;height:36px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;
  background:var(--purple);color:#fff;
  font-family:"montserrat",sans-serif;font-weight:700;font-size:15px}
.gsteps > li strong{
  display:block;font-family:"oswald",sans-serif;font-weight:600;font-size:20px;
  color:var(--ink);margin-bottom:10px}

/* Reading spine: chapter headings get room and a marker. */
.single-guide .casebody > h3{
  margin-top:64px;padding-top:34px;border-top:1px solid rgba(128,50,216,.22);
  scroll-margin-top:110px}
.single-guide .casebody > h3:first-child{margin-top:0;padding-top:0;border-top:0}

@media(max-width:900px){
  .gtoc ol{grid-template-columns:1fr}
  .gcards.g3,.gcards.g2{grid-template-columns:1fr}}
@media(max-width:640px){
  .gtoc{padding:22px}
  .gcards > li{padding:22px}
  .gkey{padding:22px}
  .gsteps > li{padding:22px 22px 24px 22px}
  .gsteps > li::before{position:static;margin-bottom:12px}
  .gpull{padding-left:20px;margin:34px 0}}

/* Guide card lists align flush left with body copy (the generic .casebody ul
   padding-left was indenting .gcards/.gsteps by 22px). */
.casebody ul.gcards,.casebody ul.gsteps,.casebody ol.gsteps,
.single-guide .casebody ul.gcards,.single-guide .casebody ul.gsteps{padding-left:0;margin-left:0}


/* ============================================================
   Photo heroes - key interior pages (2026-08-14, Trenton)
   ============================================================
   `.page-hero.has-bg` = a hero carrying an ACF `hero_background`
   photo. Taller banner, page title anchored to the bottom, and a
   dark scrim so white type stays legible over any frame. The
   per-page focal point rides on the element's inline
   background-position (ACF `hero_focus`), computed from face
   detection so nobody's head crops out of the 600px window. */
.page-hero.has-bg{
  margin-top:77px; /* clear the fixed header (Trenton, 2026-08-21) */
  min-height:600px;
  align-items:flex-end !important;
  background-repeat:no-repeat;
  background-size:cover;
  background-color:var(--bg);
}
@media(min-width:1025px){
  .page-hero.has-bg{min-height:600px}}
.page-hero.has-bg .wrap{
  position:relative;z-index:3;
  padding-top:190px !important;
  padding-bottom:64px !important;}
/* Scrim: heavy at the bottom where the title sits, light at the top so the
   photograph still reads under the nav. */
.page-hero.has-bg .shade{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(to bottom,rgba(12,7,25,.72) 0%,rgba(12,7,25,.30) 34%,rgba(12,7,25,.62) 74%,rgba(18,10,39,.90) 100%),
    linear-gradient(100deg,rgba(18,10,39,.62) 0%,rgba(18,10,39,.28) 55%,rgba(18,10,39,.10) 100%);}
/* The brand chevron watermark competes with a photograph - keep a whisper. */
.page-hero.has-bg::after{opacity:1;z-index:2}
.page-hero.has-bg .wrap h1{
  margin:0;max-width:15ch;
  text-shadow:0 2px 26px rgba(8,4,18,.55);}

/* Tablet: shorter banner, photo kept. */
@media(max-width:1024px){
  .page-hero.has-bg{min-height:440px}
  .page-hero.has-bg .wrap{padding-top:150px !important;padding-bottom:48px !important}
  .page-hero.has-bg .wrap h1{max-width:20ch}}
/* Phone: cover crops so hard at this width that faces get sliced, so the
   photo comes off entirely and the hero falls back to the brand panel. */
@media(max-width:767px){
  .page-hero.has-bg{
    min-height:300px;
    background-image:none !important;
    align-items:center !important;}
  .page-hero.has-bg .shade{display:none}
  .page-hero.has-bg::after{opacity:1}
  .page-hero.has-bg .wrap{padding-top:120px !important;padding-bottom:34px !important}
  .page-hero.has-bg .wrap h1{max-width:none;text-shadow:none}}

/* Interior page hero brand mark at full strength (Trenton, 2026-08-17). */
.page-hero::after{opacity:1}
@media(max-width:900px){.page-hero::after{opacity:1}}

/* ==========================================================================
   Sitewide vertical rhythm — Trenton, 2026-08-17
   Two-column text blocks must top-align, and headings/paragraphs carry their
   spacing BELOW them (20px), never above. Enforced with !important because the
   old sheets set per-component top margins in dozens of places.
   ========================================================================== */
.wrap h1,.wrap h2,.wrap h3,.wrap h4,.wrap h5,.wrap h6,
.wrap p,.wrap .lead,.wrap .sub,.wrap .eyebrow,.wrap .stepeyebrow{margin-top:0 !important}
.wrap h1,.wrap h2,.wrap h3,.wrap h4,.wrap h5,.wrap h6,
.wrap p,.wrap .lead,.wrap .sub{margin-bottom:20px !important}
.wrap > *:first-child,.wrap > * > *:first-child{margin-top:0 !important}
/* Long-form bodies keep their deliberate chapter separators. */
.casebody > h3{margin-top:52px !important}
.single-guide .casebody > h3{margin-top:64px !important}

/* Stacked text columns rely on typography margins, not grid gaps (Trenton,
   2026-08-17). The base sheet collapses these grids to one column at 1080px
   and keeps a 44px gap, which then adds to the 20px margin under the last
   paragraph. Card grids (.killers/.mgrid/.cards3) keep their gap. */
@media(max-width:1080px){
  .split,.origin .split,.closing .split{row-gap:0}
  /* Anything that is not a run of text still needs air above it once stacked. */
  .split > * > .photo,.split > .photo,.origin .split > .photo,
  .closing .split > .book,.split > .book{margin-top:24px}
}

/* Card grids need breathing room before the copy that follows (Trenton,
   2026-08-17). Skipped when the grid is the last thing in its section so we
   do not add 40px on top of the section padding. */
.ccards:not(:last-child),.cards3:not(:last-child),.pillars:not(:last-child),
.proofslots:not(:last-child),.killers:not(:last-child),.mgrid:not(:last-child),
.grid3:not(:last-child),.path3:not(:last-child),.checkgrid:not(:last-child),
.resgrid:not(:last-child),.facegrid:not(:last-child),.coachgrid:not(:last-child),
.mapgrid:not(:last-child),.duo:not(:last-child),.steps:not(:last-child){margin-bottom:40px}

/* Line icons on the coach model cards. */
.ccard .cicowrap{display:inline-flex;align-items:center;justify-content:center;
  width:56px;height:56px;border-radius:14px;margin-bottom:16px;
  background:linear-gradient(180deg,rgba(128,50,216,.22),rgba(128,50,216,.06));
  border:1px solid var(--line);color:var(--purple-soft)}
.ccard .cico{width:30px;height:30px;display:block}

/* Card interiors: no flex/grid gap fighting the 20px type margins
   (Trenton, 2026-08-17). Spacing comes from the elements themselves. */
.quote-card,.pcard,.sidecard,.kill,.item,.dstate{row-gap:0}
.quote-card > *,.pcard > *,.sidecard > *,.kill > *,.item > *,.dstate > *{margin-bottom:20px}
.quote-card > *:last-child,.pcard > *:last-child,.sidecard > *:last-child,
.kill > *:last-child,.item > *:last-child,.dstate > *:last-child{margin-bottom:0}

/* Quote cards: the decorative " sat on top of the headline. Reserve room for
   it in the card padding instead of pushing the heading down with a margin. */
.face.is-quote,.is-quote{padding-top:74px}
.is-quote::after{top:26px}
.is-quote > h3{margin-top:0 !important}

/* Review marquee needs air before the button underneath. */
.marquee:not(:last-child){margin-bottom:40px}

/* Icon tile, shared by every card that carries a line icon. */
.ccard .cicowrap,.kill .cicowrap,.face .cicowrap,.pcard .cicowrap{display:inline-flex;
  align-items:center;justify-content:center;width:56px;height:56px;border-radius:14px;
  margin-bottom:16px;background:linear-gradient(180deg,rgba(128,50,216,.22),rgba(128,50,216,.06));
  border:1px solid var(--line);color:var(--purple-soft)}
.cico{width:30px;height:30px;display:block}
.center .cicowrap{margin-left:auto;margin-right:auto}

/* Buttons need air before the fine print underneath. */
.btnrow:not(:last-child){margin-bottom:40px}

/* CTA panels carry one X, never two: the panel already paints the large mark
   as its own background, so drop the small ::after mark (Trenton, 2026-08-17). */
.box::after{content:none}

/* Icon tiles are circles, matching the homepage .gico treatment
   (Trenton, 2026-08-17) — supersedes the rounded-square tile above. */
.ccard .cicowrap,.kill .cicowrap,.face .cicowrap,.pcard .cicowrap,.cicowrap{
  width:46px;height:46px;border-radius:50%;background:rgba(128,50,216,.14);
  border:1px solid var(--line);color:var(--purple-bright);margin-bottom:20px}
.cico{width:24px;height:24px}
/* Icon circles must never squash into ovals in flex rows (Trenton, 2026-08-17). */
.cicowrap{flex:0 0 auto;aspect-ratio:1/1;min-width:46px;min-height:46px}

/* ── Sitewide step numbers ────────────────────────────────────────────────
   One number style everywhere: an oversized gradient numeral with no frame,
   so a number never reads as another icon when the two share a callout.
   Any label ("Step", "Phase") sits above the numeral. Approved by Trenton
   Elkins 2026-08-17 (option B of the numbered-step concepts). */
.stepno{
  display:block;width:auto;height:auto;min-width:0;padding:0;margin:0 0 10px;
  background:none;border:0;border-radius:0;text-align:inherit;letter-spacing:0}
.stepno .stepno-k{
  display:block;font-family:Oswald,"oswald",sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--purple-bright);margin-bottom:2px}
.stepno .stepno-n{
  display:block;font-family:Oswald,"oswald",sans-serif;font-size:58px;font-weight:700;
  line-height:1.04;letter-spacing:-.02em;padding-bottom:.06em;
  background:var(--grad-accent);
  -webkit-background-clip:text;background-clip:text;color:transparent}
/* Beat the older pill/circle treatment on the coach and how-it-works step
   cards. The pill's border lives on `.pcard .stepno` in style.css, so it has
   to be cleared at the same specificity or the numeral keeps its box
   (Trenton, 2026-08-17). */
.pcard .stepno{
  width:auto;height:auto;min-width:0;padding:0;border:0;border-radius:0;display:block;
  line-height:1;font-size:inherit;letter-spacing:0;background:none}
.face > .num,.kill .num{
  font-family:Oswald,"oswald",sans-serif;font-weight:700;line-height:1.04;letter-spacing:-.02em;
  padding-bottom:.06em;
  background:var(--grad-accent);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.face > .num{font-size:58px}
.kill .num{font-size:34px}
@media(max-width:620px){
  .stepno .stepno-n,.face > .num{font-size:44px}
  .kill .num{font-size:28px}}


/* ── QA round, Kira answers (2026-08-17) ─────────────────────────────────── */

/* Alternating section tones: the two homepage colours only. `section.tone`
   and `section.tone-dark` already exist; sections.php now hands every untoned
   section one of them so no two neighbours share a background. The centred
   variants keep their own padding rhythm. */

/* Quote and proof blocks: purple glyph at the top, attribution at the bottom.
   The name used to sit above the words, which read like a heading with a
   stray quote mark under it. */
.face.is-quote,
.quote-card.is-quote{display:flex;flex-direction:column}
.face.is-quote > h3,
.quote-card.is-quote > h3{order:8;margin-top:20px;margin-bottom:0;font-size:15px;letter-spacing:.06em}
.face.is-quote > .who,
.face.is-quote > .role,
.quote-card.is-quote > .who,
.quote-card.is-quote > .role{order:9;margin-top:4px}

/* Interior heroes with no photograph are half height on tablet and phone.
   Heroes that carry a background image keep their own heights (they hold a
   face, and cropping them further slices heads off). */
@media(max-width:1024px){
  .page-hero:not(.has-bg){min-height:175px}
  .page-hero:not(.has-bg) .wrap{padding-top:118px;padding-bottom:26px}}
@media(max-width:620px){
  .page-hero:not(.has-bg){min-height:150px}
  .page-hero:not(.has-bg) .wrap{padding-top:104px;padding-bottom:22px}}

/* Plan Your Exit: the two questions read as body copy. The homepage sets the
   type rule for anything that carries weight, so they take the heading face. */
.guide-plan-your-exit .gkey.accent > p:not(.gkey-t){
  font-family:Oswald,"oswald",sans-serif;font-weight:600;text-transform:uppercase;
  letter-spacing:.02em;line-height:1.25;font-size:20px;color:var(--ink)}
@media(max-width:620px){
  .guide-plan-your-exit .gkey.accent > p:not(.gkey-t){font-size:17px}}

/* Coach bio: the Schedule a Call button sits in the intro as well as at the
   foot of the page (Trenton, 2026-08-17). */
.single-coach .intro-cta{margin-top:28px}
.single-coach .intro-cta .btn{display:inline-flex;align-items:center;gap:8px}

/* Assessments: the progress bar was pinned at 62px, which put it inside the
   76px header. Sit it directly under the header instead (Trenton,
   2026-08-17). */
.qprog{top:76px}
@media(max-width:900px){.qprog{top:76px}}

/* Header carries no bottom border sitewide (Trenton, 2026-08-17). */
header{border-bottom:0}

/* The consent row and the submit button run the full width of the gate form;
   the consent copy was wrapping into a narrow column (Trenton, 2026-08-17). */
.gatecard #gateBtn,.gatecard .fine{grid-column:1/-1}

/* Coach bios: the line under the booking button sat 14px off it, which read
   as crowded against the button's glow (Trenton, 2026-08-17). */
.book-cta__note{margin-top:26px}
.book-cta + *{margin-top:24px}

/* ── The broken triangle ─────────────────────────────────────────────────
   One reusable graphic (Kira, 2026-08-17). Red appears on the broken side
   only — it is the whole point of the drawing, so it is used nowhere else. */
/* ── The 3D Momentum triangle (template-parts/exm/broken-triangle.php) ────
   Same geometry and vocabulary as the homepage drawing so the two read as one
   shape in two states. Red is reserved for the side that is broken. In cycle
   mode each side breaks in turn: the stroke opens a gap in the middle (the
   dash arithmetic is on pathLength=100, so it is identical on all three sides
   regardless of their real length), the crack line paints red over the gap
   edges, the label goes red, and the caption swaps underneath. */
.exm-tri{margin:0;display:grid;gap:26px;justify-items:center}
.exm-tri__stage{width:100%;max-width:460px}
.exm-tri svg{width:100%;height:auto;overflow:visible;display:block}

.exm-tri__side{stroke:transparent;stroke-width:3;fill:none}
.exm-tri__crack{stroke:transparent;stroke-width:3.6;fill:none}
.exm-tri__face{transition:stroke .45s ease,opacity .45s ease}
.exm-tri__node{fill:var(--purple-bright);transition:fill .45s ease}
.exm-tri__mark{fill:#fff;font-family:Oswald,sans-serif;font-weight:600;font-size:44px}
.exm-tri__marksub{fill:rgba(233,233,238,.6);font-family:Montserrat,sans-serif;
  font-weight:700;font-size:12px;letter-spacing:3px}
.exm-tri__label{fill:#E9E9ED;font-family:Montserrat,sans-serif;font-weight:700;
  font-size:12px;letter-spacing:3px;transition:fill .45s ease}

/* The broken side: the purple edge is cut away and the red one drawn over it. */
.exm-tri[data-weak="direction"] .exm-tri__sideg[data-side="direction"] .exm-tri__side,
.exm-tri[data-weak="design"]    .exm-tri__sideg[data-side="design"]    .exm-tri__side,
.exm-tri[data-weak="dynamic"]   .exm-tri__sideg[data-side="dynamic"]   .exm-tri__side{
  stroke:var(--bg);stroke-width:5}
.exm-tri[data-weak="direction"] .exm-tri__sideg[data-side="direction"] .exm-tri__crack,
.exm-tri[data-weak="design"]    .exm-tri__sideg[data-side="design"]    .exm-tri__crack,
.exm-tri[data-weak="dynamic"]   .exm-tri__sideg[data-side="dynamic"]   .exm-tri__crack{
  stroke:#E05547;stroke-dasharray:42 16 42;stroke-dashoffset:0;
  filter:drop-shadow(0 0 6px rgba(224,85,71,.5));animation:exm-tri-fray 4.2s ease-in-out infinite}
.exm-tri[data-weak="direction"] .exm-tri__label[data-side="direction"],
.exm-tri[data-weak="design"]    .exm-tri__label[data-side="design"],
.exm-tri[data-weak="dynamic"]   .exm-tri__label[data-side="dynamic"]{fill:#E05547}
/* Dim the outline with opacity, never with `stroke`: the gradient is a
   per-instance inline url(#…) and a CSS stroke would win over it and kill it. */
.exm-tri[data-weak] .exm-tri__face{opacity:.5}

/* The gap widens a little as it sits, so a broken side never looks intentional. */
@keyframes exm-tri-fray{
  0%,100%{stroke-dasharray:44 12 44}
  50%{stroke-dasharray:40 20 40}
}
@media(prefers-reduced-motion:reduce){
  .exm-tri__crack{animation:none!important}
}

/* Caption: one state visible at a time, the box sized to the tallest so the
   page does not jump as it cycles. */
.exm-tri__read{position:relative;max-width:560px;text-align:center;display:grid}
.exm-tri__state{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .4s ease,transform .4s ease}
.exm-tri__state.is-on{opacity:1;visibility:visible;transform:none}
.exm-tri__chip{display:inline-block;font-family:Montserrat,sans-serif;font-weight:700;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#E05547;
  border:1px solid rgba(224,85,71,.45);border-radius:999px;padding:6px 14px;margin-bottom:14px}
.exm-tri__read p{color:var(--body);font-size:15.5px;line-height:1.7;margin:0}
.exm-tri__dots{grid-area:2/1;display:flex;gap:10px;justify-content:center;margin-top:22px}
.exm-tri__dot{width:9px;height:9px;padding:0;border-radius:50%;cursor:pointer;
  background:rgba(233,233,238,.25);border:0;transition:background .3s ease,transform .3s ease}
.exm-tri__dot.is-on{background:#E05547;transform:scale(1.25)}
.exm-tri__dot:focus-visible{outline:2px solid var(--purple-bright);outline-offset:3px}

/* Assessment landing: argument on the left, drawing on the right, readout
   further down the page (Trenton, 2026-08-17). */
.assess-intro__cta{margin-top:34px;gap:16px;flex-wrap:wrap}
.assess-intro__fine{margin-top:26px}
.assess-sample__panel{max-width:560px;margin:34px auto 0}
@media(max-width:900px){
  .assess-intro .exm-tri{margin-top:38px}}

/* Insight card photography sat too low in the 16/9 crop, cutting heads
   toward the bottom edge (Trenton, 2026-08-17). */
.card .qc-thumb,.quote-card > .qc-thumb,.icard img,.card img.wp-post-image{object-position:center 28%}

/* ── Booking form: one look everywhere ───────────────────────────────────
   The polished field styling lived in exm-home.css, which only loads on the
   front page, so /book-a-call/ and the coach panels rendered plainer fields
   (Trenton, 2026-08-17). Ported here, which loads on every page. The font is
   left to inherit rather than hardcoded, so interior pages keep the sitewide
   face. exm-home.css still loads after this on the homepage, so the front
   page is untouched. */
.book .gform_wrapper input[type=text],.book .gform_wrapper input[type=email],
.book .gform_wrapper input[type=tel],.book .gform_wrapper input[type=url],
.book .gform_wrapper input[type=number],.book .gform_wrapper select,
.book .gform_wrapper textarea{
  background:#0c0719;border:1px solid rgba(128,50,216,.35);border-radius:10px;
  padding:15px 18px;color:#fff;font-size:15px}
.book .gform_wrapper textarea{line-height:1.65;min-height:120px}
.book .gform_wrapper input::placeholder,
.book .gform_wrapper textarea::placeholder{color:rgba(233,233,238,.4)}
.book .gform_wrapper input:focus,.book .gform_wrapper select:focus,
.book .gform_wrapper textarea:focus{
  outline:none;border-color:var(--purple-bright);
  box-shadow:0 0 0 3px rgba(200,107,255,.18);background:#110a24}
.book .gform_wrapper .gfield_consent input[type=checkbox]{
  appearance:none;-webkit-appearance:none;box-sizing:border-box;padding:0;
  width:15px;height:15px;min-width:15px;flex:0 0 auto;border-radius:4px;
  border:1px solid rgba(128,50,216,.55);background:#0c0719;position:relative;cursor:pointer}
.book .gform_wrapper .gfield_consent input[type=checkbox]:checked{
  background:var(--purple);border-color:var(--purple-bright)}
.book .gform_wrapper .gfield_consent input[type=checkbox]::after{
  content:"";position:absolute;left:3px;top:3px;width:9px;height:5px;
  border-left:2px solid #fff;border-bottom:2px solid #fff;
  transform:rotate(-45deg) scale(0);transition:transform .15s}
.book .gform_wrapper .gfield_consent input[type=checkbox]:checked::after{
  transform:rotate(-45deg) scale(1)}
.book .gform_wrapper button,.book .gform_wrapper input[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:"Montserrat",sans-serif;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;border-radius:999px;padding:17px 36px;transition:transform .2s,box-shadow .2s;white-space:nowrap;border:0;cursor:pointer;background-image:var(--grad);width:100%;max-width:100%}
.book .gform_wrapper button:hover,.book .gform_wrapper input[type=submit]:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(128,50,216,.45)}

/* The model band on the assessment page reuses the whole-triangle state. */
.assess-model .exm-tri{margin-top:30px}
.assess-model__copy{max-width:760px;margin:0 auto}

/* 3D Momentum chart used off the homepage. `style.css` leaves `.dstate`
   absolutely positioned (inset:44px), which pulls the copy panel out of its
   grid column and drops it on top of the triangle on any page that reuses the
   component. Put it back in the grid — scoped to the reusable component so the
   front page is untouched. */
[data-tri] .dstate{position:static;inset:auto;grid-row:1;grid-column:1}
[data-tri] .dpanel{position:relative}

/* Coach bio intro: Schedule a Call sits after the credentials strip, with air
   above it (Trenton, 2026-08-17). */
.hero-intro .intro-cta{margin-top:28px}
.hero-intro .credstrip{margin-top:26px}

/* ── Coach page section background alternation ──────────────────────────
   Alternating backgrounds create visual rhythm and make consistent padding
   between sections appear intentional rather than excessive (Trenton, 2026-08-18). */
.single-coach section:nth-child(1){background:var(--bg)}
.single-coach section:nth-child(2){background:var(--panel)}
.single-coach section:nth-child(3){background:var(--bg)}
.single-coach section:nth-child(4){background:var(--panel)}
.single-coach section:nth-child(5){background:var(--bg)}
.single-coach section:nth-child(6){background:var(--panel)}
.single-coach section:nth-child(7){background:var(--bg)}
.single-coach section:nth-child(8){background:var(--panel)}
.single-coach section:nth-child(9){background:var(--bg)}

/* ── Interior page section background alternation ────────────────────────
   Same pattern for other interior pages (about, results, etc.) */
body:not(.single-coach) main section:nth-child(odd){background:var(--bg)}
body:not(.single-coach) main section:nth-child(even){background:var(--panel)}

/* ── Coaches page specific alternation ──────────────────────────────────
   Ensure team photo section has different background than intro section */
.page-template-coaches section:first-of-type{background:var(--bg)}
.page-template-coaches section:nth-of-type(2){background:var(--panel)}
.page-template-coaches section:nth-of-type(3){background:var(--bg)}
.page-template-coaches section:nth-of-type(4){background:var(--panel)}

/* ── Broken state of the 3D Momentum model ───────────────────────────────
   The markup (template-parts/exm/momentum-model.php, mode=broken) draws a
   background-coloured cut over the intact edge and a red crack over it, and
   exm-ui.js toggles `.on` on the side being cycled. Without these rules both
   lines stayed transparent, so the "broken" chart looked identical to the
   whole one (Trenton, 2026-08-17). Red is used only here, on the one side
   that is currently failing. */
.exm-model--broken .tcut{stroke:var(--bg);stroke-width:7;fill:none;opacity:0;
  transition:opacity .35s ease}
.exm-model--broken .tcut.on{opacity:1}
.exm-model--broken .tbreak{stroke:#E05547;stroke-width:3.6;fill:none;opacity:0;
  stroke-dasharray:44 12 44;filter:drop-shadow(0 0 7px rgba(224,85,71,.55));
  transition:opacity .35s ease}
.exm-model--broken .tbreak.on{opacity:1;animation:exm-tri-fray 4.2s ease-in-out infinite}
/* The failing side loses its purple glow and its label turns red with it. */
.exm-model--broken .tglow.on{opacity:0}
.exm-model--broken .tlabel.on{fill:#E05547}
@media(prefers-reduced-motion:reduce){
  .exm-model--broken .tbreak.on{animation:none}
}

/* Media captions: `.wrap p{margin-top:0 !important}` above was flattening the
   inline spacing on video/photo captions, so caption text sat flush against
   the frame. Text never touches media on this site (Trenton, 2026-08-17). */
.wrap .videoband + p,.wrap .videoband + .reveal,
.wrap figure + p,.wrap img + p{margin-top:30px !important}


/* SITEWIDE(case studies): the route back to the library reads as a real
   secondary action instead of a bare purple text link. */
.casebackrow{margin-top:34px !important}
.casebacklink{display:inline-flex;align-items:center;gap:8px;
  padding:13px 26px;border:1px solid var(--purple);border-radius:999px;
  color:var(--purple-bright);font-family:"montserrat",sans-serif;font-weight:700;
  font-size:13px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  transition:background .18s ease,border-color .18s ease,color .18s ease}
.casebacklink:hover{background:rgba(128,50,216,.16);border-color:var(--purple-bright);color:#fff}


/* ── QA batch: spacing rows 93-101 (Trenton, 2026-08-17) ────────────────────
   Measured live with getBoundingClientRect before/after; markup margins on
   this theme are neutralised by `.wrap p{margin-top:0 !important}` upstream,
   so these carry !important deliberately. */

/* 96/97/98 — a band that holds nothing but a photo was inheriting the full
   110px section rhythm above and below, which read as dead space. */
section:has(> .wrap > .bandphoto:only-child),
section:has(> .wrap.bandphoto){padding-top:40px !important;padding-bottom:40px !important}
@media(max-width:900px){
  section:has(> .wrap > .bandphoto:only-child),
  section:has(> .wrap.bandphoto){padding-top:40px !important;padding-bottom:40px !important}
}

/* 93 — when a split band stacks on tablet/mobile the photo sat flush on the
   copy below it. Images never touch content. */
@media(max-width:1024px){
  .wrap.split{row-gap:30px}
  .wrap.split > .photo{margin-bottom:0}
  .wrap.split > .photo + *{margin-top:30px !important}
}

/* 101 — copy above a video band was 22px off it; 40px both sides now. */
.wrap .videoband{margin-top:40px !important}

/* 95/100 — guide pages stacked two 110px paddings between the intro and the
   "What's inside" band, i.e. 220px of empty space. */
.single-guide .hero-intro{padding-bottom:70px !important}
.single-guide .hero-intro + section,
.single-guide .hero-intro + div{padding-top:70px !important}
@media(max-width:900px){
  .single-guide .hero-intro{padding-bottom:48px !important}
  .single-guide .hero-intro + section,
  .single-guide .hero-intro + div{padding-top:48px !important}
}


/* ── QA 49/91: the "how many are true today" auto-scroller ────────────────
   exm-design.css masked this viewport at BOTH ends (14%/86%), so the top row
   was half-faded and the bottom looked like dead black. Fade only at the
   bottom, and give the viewport a row-height multiple so items don't get
   sliced mid-sentence (Trenton, 2026-08-17). */
@media(min-width:1025px){
  .gut .gview{max-height:400px;
    -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 78%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 0,#000 78%,transparent 100%)}
}

/* ── QA 64: coach grid column counts ─────────────────────────────────────
   3 across on desktop, 2 on tablet, 1 on phone. */
@media(max-width:1024px) and (min-width:701px){
  .coachgrid{grid-template-columns:repeat(2,1fr) !important}
}
@media(max-width:700px){
  .coachgrid{grid-template-columns:1fr !important}
}


/* ── QA 102 (/3d-momentum-method/): live model instead of a flat drawing ──
   The decorative triangle pane now hosts the broken shape (graphic only, no
   second heading), and the working interactive model sits after "the three
   sides" the way it does on the homepage. */
.exm-pane-model{background:none !important;border:0 !important;padding:0 !important;min-height:0 !important}
.exm-pane-model--inline .exm-model{background:none;border:0;box-shadow:none;padding:0}
.exm-pane-model--inline .mhead,
.exm-pane-model--inline .mrule{display:none !important}
/* Inside a half-width column the model stacks: shape first, then the failure
   panel and its dots, so each broken side still explains itself
   (Trenton, 2026-08-17). */
.exm-pane-model--inline .mgrid{display:block;padding:0}
.exm-pane-model--inline .tri{max-width:420px;margin:0 auto}
.exm-pane-model--inline .dpanel{position:static;margin-top:26px;text-align:left}
.exm-pane-model--inline .dstate{position:static}
.exm-pane-model--inline .dots{margin-top:18px}
.exm-modelband > .wrap{max-width:1180px}

/* Trenton, 2026-08-17: the model's intro (eyebrow, headline, paragraph) reads
   centred; the side callout beside the triangle stays left aligned. */
.exm-model .mhead{text-align:center}
.exm-model .mhead .eyebrow,
.exm-model .mhead h3,
.exm-model .mhead p{text-align:center}
.exm-model .dpanel,
.exm-model .dpanel .dstate{text-align:left}


/* ── QA 55 / 92 / 103 / 52 (2026-08-17) ───────────────────────────────────
   Numbered card headings ("Phase 1 · The 3D Diagnostic", "1 - Enter your
   numbers") now print the sitewide step numeral above the heading, so the
   number never competes with the card's line icon. */
.ccard .stepno,.pcard .stepno--card{margin-bottom:14px}
.ccard.has-dico .stepno{margin-top:4px}
.ccard .stepno + h3,.stepno--card + h3{margin-top:0}

/* Problem-frame rows read as a table without them; the compass / map /
   foundation drawings label each side at a glance. */
.maprow.has-dico{position:relative}
.maprow.has-dico > .cicowrap{margin-bottom:16px}
.maprow.has-dico .r:first-of-type{border-top:0}

/* Coach bios centre their content on tablet and phone (Trenton, QA 52). */
@media(max-width:1024px){
  .single-coach section .wrap,
  .single-coach section .wrap h1,.single-coach section .wrap h2,
  .single-coach section .wrap h3,.single-coach section .wrap p,
  .single-coach section .wrap .eyebrow,.single-coach section .wrap .lead,
  .single-coach section .wrap .sub,.single-coach .pcard,.single-coach .ccard{
    text-align:center}
  .single-coach .cicowrap,.single-coach .stepno{margin-left:auto;margin-right:auto}
  .single-coach .stepno{text-align:center}
  .single-coach .btnrow,.single-coach .intro-cta{
    display:flex;justify-content:center;flex-wrap:wrap}
}

/* The intro block above each model band (eyebrow, headline, body) centres,
   while the triangle's own side callouts stay left aligned
   (Trenton, 2026-08-17). */
section:has(.exm-pane-model--inline) > .wrap > .eyebrow,
section:has(.exm-pane-model--inline) > .wrap > h2,
section:has(.exm-pane-model--inline) > .wrap > h3,
section:has(.exm-pane-model--inline) > .wrap > p,
section:has(.exm-pane-model--inline) > .wrap > .sub,
section:has(.exm-pane-model--inline) > .wrap > .lead{
  text-align:center;margin-left:auto;margin-right:auto}
.exm-modelband .mhead .eyebrow,.exm-modelband .mhead h3,
.exm-modelband .mhead p{text-align:center}

/* Problem-frame icon tiles were rendering as stretched pills (the span stayed
   inline, so the 46px circle never applied and its border read as two stray
   vertical lines in the middle of the card). Force the homepage .gico circle
   and centre it (Trenton, 2026-08-17). */
.maprow.has-dico > .cicowrap{
  display:flex !important;align-items:center;justify-content:center;
  width:46px;height:46px;flex:0 0 46px;border-radius:50%;
  background:rgba(128,50,216,.14);border:1px solid var(--line);
  color:var(--purple-bright);margin:0 auto 16px}
.maprow.has-dico > .cicowrap .cico{width:24px;height:24px;display:block}

/* QA 65 (Trenton, 2026-08-17): the fixed 76px header used to sit on top of the
   group photo on tablet/phone. The offset was a background-clipped border;
   the sitewide margin-top:77px now handles it, so the border is gone below
   1024px (Trenton, 2026-08-21). */
@media(max-width:1024px){
  .page-hero.has-bg .wrap{padding-top:74px !important}}
@media(max-width:767px){
  .page-hero.has-bg .wrap{padding-top:46px !important}}

/* QA 41 (Trenton, 2026-08-17): dimension filter bar on /insights/. */
.infilter{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:26px 0 34px}
.infilter__btn{font:600 13px/1 "din-2014",sans-serif;letter-spacing:.08em;text-transform:uppercase;
  color:#cdbde8;background:rgba(128,50,216,.10);border:1px solid var(--line);
  border-radius:999px;padding:11px 20px;cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.infilter__btn:hover{color:#fff;border-color:var(--purple-bright)}
.infilter__btn.is-on{background:linear-gradient(94deg,#8032D8,#B16BFF);border-color:transparent;color:#fff}
.infilter__empty{text-align:center;color:#cdbde8;margin-top:24px}

/* QA 41 fix (Trenton, 2026-08-17): .quote-card / .arow set display:flex, which
   outranks the UA [hidden] rule, so filtered-out articles stayed visible. */
[hidden]{display:none !important}

/* Insight card title paragraphs were flex-grow:1, so short titles pushed the
   excerpt down to match the tallest card. Let the "Read it" row absorb it. */
.quote-card > p{flex:0 0 auto}
.quote-card > .who{margin-top:auto}

/* QA 26: homepage-style video background for interior "difference" sections
   (exm-home.css is front-page only, so the rules are repeated here). */
.difference{position:relative;overflow:hidden}
.difference > .dvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.difference > .shade{position:absolute;inset:0;background:rgba(18,10,39,.72);z-index:1}
.difference > .wrap{position:relative;z-index:2}
@media(max-width:767px){.difference > .dvid{display:none}}

/* QA 35: image left (sticky) / copy right split band. */
.stickysplit > .wrap{display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);gap:clamp(28px,4vw,60px);align-items:start;text-align:left}
.stickysplit .ssfig{position:sticky;top:110px;margin:0;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.stickysplit .ssfig img{display:block;width:100%;height:auto}
.stickysplit .sscol{text-align:left}
.stickysplit .sscol .eyebrow,.stickysplit .sscol h2,.stickysplit .sscol p{text-align:left;margin-left:0;margin-right:0;max-width:none}
.stickysplit .sscol .btnrow{justify-content:flex-start;margin-top:30px}
@media(max-width:900px){.stickysplit > .wrap{grid-template-columns:1fr}.stickysplit .ssfig{position:static;margin-bottom:30px}}

/* QA 41 follow-up (Trenton, 2026-08-17): the chip row filters the archive list
   only, so it now sits under the featured cards instead of above them. */
#layout-featured .infilter{margin-top:44px;margin-bottom:8px}

/* QA 94 (Trenton, 2026-08-17): the fine print sat 10px under the submit button
   on the webinar gate form. Beat the .book .fine base rule on specificity. */
.book .btn + .fine,.btn + .fine,.gatecard #gateBtn + .fine{margin-top:26px}

/* QA 70 (Trenton, 2026-08-17): too much air between the checklist and the phone
   button in the left column of /book-a-call/. Tighten, but keep them apart. */
.closing .checks + .phone,.closing .checks + .reveal.phone{margin-top:28px}

/* ── QA 29-33 + 107 (Trenton, 2026-08-17): on tablet/mobile the homepage
   sections read as a ragged left column. Centre the section intros, the card
   contents and the button rows so the page matches the growth-killers block,
   which was already centred. Desktop is untouched. ────────────────────────── */
@media (max-width:960px){
  /* section intros: eyebrow, headline, lead/sub copy */
  body.home .gains > .wrap > .eyebrow,
  body.home .gains > .wrap > h2,
  body.home .gains > .wrap > .sub,
  body.home .gains > .wrap > .strip,
  body.home .process > .wrap > .eyebrow,
  body.home .process > .wrap > h2,
  body.home .results .d-top,
  body.home .results .a-rail,
  body.home .assess .box,
  body.home .process .afterstrip,
  body.home .closing > .wrap > div:first-child,
  body.home .closing .book{text-align:center}

  /* card interiors follow the same centre line */
  body.home .gains .cards3 > *,
  body.home .process .steps > *{text-align:center}
  body.home .gains .cards3 > * .gico,
  body.home .process .steps > * .stepno{margin-left:auto;margin-right:auto}

  /* button rows and inline actions centre with the copy */
  body.home .btnrow,
  body.home .ctas,
  body.home .results .btnrow,
  body.home .assess .btnrow,
  body.home .process .afterstrip .btnrow{justify-content:center}

  /* the closing checklist centres as a block but keeps its tick alignment */
  body.home .closing .checks{display:inline-block;text-align:left}
  body.home .closing .phone{margin-left:auto;margin-right:auto}
}

/* QA 106 (Trenton, 2026-08-17): the first hero checkmark callout rendered
   taller than the other two. Pin all three to one height and centre the
   label, so they are exactly the same size. Wrapping is restored on mobile. */
.hero .hchecks li{height:52px;padding-top:0;padding-bottom:0;align-items:center;white-space:nowrap}
@media (max-width:700px){
  .hero .hchecks li{height:auto;padding-top:12px;padding-bottom:12px;white-space:normal}
}

/* QA 32/33/107 follow-up: the CTA panels set text-align on their own children,
   so centring the container alone did nothing. Centre the descendants too. */
@media (max-width:960px){
  body.home .assess .box .eyebrow,
  body.home .assess .box h2,
  body.home .assess .box h3,
  body.home .assess .box p,
  body.home .assess .box .lead,
  body.home .assess .box .sub,
  body.home .process .afterstrip .eyebrow,
  body.home .process .afterstrip h2,
  body.home .process .afterstrip h3,
  body.home .process .afterstrip p,
  body.home .closing .book .eyebrow,
  body.home .closing .book h2,
  body.home .closing .book h3,
  body.home .closing .book .sub2,
  body.home .closing > .wrap > div:first-child .eyebrow,
  body.home .closing > .wrap > div:first-child h2,
  body.home .closing > .wrap > div:first-child p{text-align:center !important}
  /* the quote/accent bar reads wrong centred, so drop its left rule */
  body.home .assess .box p[style*="border-left"],
  body.home .assess .box blockquote{border-left:0;padding-left:0}
}

/* QA 4 (Trenton, 2026-08-17): the mission copy on /about/our-story/ sat far
   above the community photo because the photo lives in its own section, so the
   two sections' vertical padding stacked. Collapse that stack by ~70%. */
section:has(> .wrap > .bandphoto:only-child),
section:has(> .wrap.bandphoto){padding-top:12px !important}
section:has(+ section > .wrap > .bandphoto:only-child),
section:has(+ section > .wrap.bandphoto){padding-bottom:26px !important}

/* QA6-ORIGIN-PHOTO-GAP: homepage origin headshot -> 20px gap.
   .wrap.split is a grid whose 30px row-gap stacks on top of any margin once it
   collapses to one column, so set the row-gap itself rather than a margin. */
@media (max-width:960px){
  body.home .origin .wrap.split{row-gap:20px !important}
  body.home .origin .wrap.split > .photo + div{margin-top:0 !important}
}

/* ── 3D-MOMENTUM-BAND-REPAIR (Trenton, 2026-08-18) ─────────────────────────
   Removing the "Three sides. A compass, a map, and a foundation." callout left
   the .duo grid still declaring two 545px columns, so the broken model was
   locked to half width with an empty column beside it. Collapse the grid when
   the model pane is the only child and put the triangle back on the left with
   its failure callouts on the right, the way it was approved. */
.duo:has(> .exm-pane-model:only-child){grid-template-columns:1fr !important}
@media(min-width:961px){
  .duo:has(> .exm-pane-model:only-child) .exm-pane-model--inline .mgrid{
    display:grid !important;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
  .duo:has(> .exm-pane-model:only-child) .exm-pane-model--inline .tri{
    max-width:none;margin:0}
  .duo:has(> .exm-pane-model:only-child) .exm-pane-model--inline .dpanel{
    margin-top:0}
}
/* The whole-model band's intro paragraph never picked up the centring rule
   because that selector only matched the inline (broken) band. */
section:has(.exm-model--whole) > .wrap > .eyebrow,
section:has(.exm-model--whole) > .wrap > h2,
section:has(.exm-model--whole) > .wrap > h3,
section:has(.exm-model--whole) > .wrap > p,
section:has(.exm-model--whole) > .wrap > .sub,
section:has(.exm-model--whole) > .wrap > .lead{
  text-align:center !important;margin-left:auto;margin-right:auto}
.exm-model--whole .mhead .eyebrow,.exm-model--whole .mhead h3,
.exm-model--whole .mhead p{text-align:center !important}
/* Dot navigation aligns to the left edge of the copy it belongs to. */
.exm-model .dots,.exm-pane-model--inline .dots{
  justify-content:flex-start !important;text-align:left !important;
  margin-left:0 !important;padding-left:0 !important}

/* Dot nav is absolutely positioned 44px in from the panel; align it to the
   left edge of the copy it belongs to (Trenton, 2026-08-18). */
.exm-model .dots{left:0 !important}

/* MHEAD-P-CENTERBLOCK: the intro paragraphs are centre-aligned text but their
   697px block still sat flush left, so they read off-centre under the
   headline. Centre the block itself too (Trenton, 2026-08-18). */
.exm-model .mhead p,.exm-model .mhead .msub{margin-left:auto !important;margin-right:auto !important}

/* Section background colors - alternating */
.tone {
    background: #120A27 !important;
}

.tone-dark {
    background: #0A0518 !important;
}

.center.assess-broken.tone {
    background: #0A0518 !important;
}

header.exm-break__head.rvx {
    position: relative;
    background: var(--panel) !important;
}

section.exm-break.exm-break--panel.tone-dark.rvx.in {
    background: var(--panel) !important;
}

section.exm-break.exm-break--panel.tone-dark.rvx.in {
    padding-bottom: 0;
}

section#sec-assess {
    background: #0A0518 !important;
}

/* 3D Self-Diagnostic page only - momentum model section */
.single-assessment .exm-model {
    border-radius: 20px !important;
    border-bottom: 1px solid var(--line) !important;
}

/* 3D Self-Diagnostic page only - assessment intro section */
.single-assessment section.center.assess {
    border-radius: 20px !important;
}

/* 3D Self-Diagnostic page only - hide small x icon */
.single-assessment .exm-break__x.sm {
    display: none !important;
}

/* 3D Self-Diagnostic page only - remove extra padding above headlines */
.single-assessment .exm-break__kicker {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}

/* Faster animation to reduce triangle gap between slides */
.single-assessment .exm-break__copy {
    transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s !important;
}

.single-assessment .exm-break__copy.is-on {
    transition: opacity .15s ease, transform .15s ease, visibility 0s !important;
}

/* Remove horizontal underlines from numbered cards in interior pages */
.n,
.n b,
.numbers .n,
.numbers .n b,
.card .number,
.box .num {
    border-bottom: none !important;
}

.n::after,
.n b::after,
.numbers .n::after,
.numbers .n b::after,
.card .number::after,
.box .num::after {
    display: none !important;
}

.sidecard h3::after,
.ccard h3::after {
    display: none !important;
}

/* Aggressively remove underlines from card numbers */
.sidecard .n,
.ccard .n,
.card .n,
.box .n {
    border-bottom: none !important;
    position: relative;
}

.sidecard .n::before,
.sidecard .n::after,
.ccard .n::before,
.ccard .n::after,
.card .n::before,
.card .n::after,
.box .n::before,
.box .n::after {
    border: none !important;
    border-bottom: none !important;
}

.sidecard h3::before,
.sidecard h3::after,
.ccard h3::before,
.ccard h3::after {
    border: none !important;
}

/* Remove line after number in any card */
.n ~ h3,
.number ~ h3 {
    border-top: none !important;
}

hr.divider {
    display: none !important;
}

/* Remove all borders and lines around and after .n b elements */
.n b,
.n > b,
.n b::before,
.n b::after {
    border: none !important;
    border-bottom: none !important;
    border-top: none !important;
}

/* Remove decorative lines after numbers */
.sidecard .n,
.ccard .n,
.card .n,
.box .n,
.face > .num {
    padding-bottom: 16px !important;
    margin-bottom: 16px !important;
}

.sidecard .n + h3,
.ccard .n + h3,
.card .n + h3,
.box .n + h3 {
    border-top: none !important;
    margin-top: 0 !important;
}

/* Remove underlines from step numbers */
.stepno,
.stepno-n,
.stepno-k {
    border: none !important;
    border-bottom: none !important;
    border-top: none !important;
}

.stepno::after,
.stepno::before,
.stepno-n::after,
.stepno-n::before,
.stepno-k::after,
.stepno-k::before {
    border: none !important;
    border-bottom: none !important;
}

/* Remove line after step number */
.stepno + h3,
.stepno-n + h3 {
    border-top: none !important;
    margin-top: 0 !important;
}

/* Homepage only - remove padding from break section */
body.home section.exm-break.exm-break--panel.tone-dark.rvx.in {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

/* 3D Self-Diagnostic page - remove padding from break section */
.single-assessment section.exm-break.exm-break--panel.tone-dark.rvx.in {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

/* 3D Self-Diagnostic page - round the CTA box corners */
.single-assessment .assess .box {
    border-radius: 14px;
}


/* Quote-card attribution, exactly as specced: em dash, full-white, body face,
   bigger than the old label. Applies to every quote card sitewide.
   [trenton, 2026-08-19] */
.face.is-quote > .qwho,
.quote-card.is-quote > .qwho,
.face.is-quote > h3,
.quote-card.is-quote > h3{
  font-family:"din-2014",sans-serif;
  font-size:19px;
  font-weight:400;
  line-height:1.4;
  letter-spacing:0;
  text-transform:none;
  color:var(--ink);
  opacity:1;
  margin-top:18px;
}
.face.is-quote > .qwho::before,
.quote-card.is-quote > .qwho::before,
.face.is-quote > h3::before{content:"\2014\00a0"}
@media(max-width:640px){
  .face.is-quote > .qwho,
  .quote-card.is-quote > .qwho,
  .face.is-quote > h3,
  .quote-card.is-quote > h3{font-size:17px}
}

/* 3D Momentum Method page only: the break-section header overlapped the
   triangle graphic. [trenton, 2026-08-19] */
.page-id-34357 header.exm-break__head{position:relative;background:#130A27}
.page-id-34357 section.exm-break.exm-break--panel.tone{padding-bottom:0;padding-top:0 !important}

/* Resource hub cards carry no featured image, so the card top read as an empty
   dark block. A thin-stroke brand motif fills the same 16/9 slot the real
   thumbnails use. [trenton, 2026-08-19] */
.quote-card:has(> .qc-art)::before{content:none;display:none}
.quote-card > .qc-art{display:block;width:100%;aspect-ratio:16/9;flex:0 0 auto;padding:0;
  border-bottom:1px solid var(--line);color:var(--purple-bright);
  background:radial-gradient(120% 140% at 50% 0%,rgba(128,50,216,.20) 0%,rgba(128,50,216,0) 62%),var(--panel-2);
  transition:color .25s ease,background .25s ease}
.quote-card > .qc-art svg{display:block;width:100%;height:100%;opacity:.85}
.quote-card:hover > .qc-art{color:#B16BFF;
  background:radial-gradient(120% 140% at 50% 0%,rgba(128,50,216,.30) 0%,rgba(128,50,216,0) 66%),var(--panel-2)}

/* How It Works: the two-column step layout above was scoped by body class, so
   it also flattened the closing CTA and pushed the form panel full width. The
   closing section is excluded above; this keeps the booking panel matching the
   homepage (copy left, form right). [trenton, 2026-08-19] */

/* Booking form: the country selector button rendered shorter than the tel
   input beside it. Lock both to the same box. [trenton, 2026-08-19] */
.book .gform_wrapper .gform-phone__input-wrapper{align-items:flex-start}
.book .gform_wrapper .gform-phone__country-selector,
.book .gform_wrapper input[type=tel].gform-phone__input{
  height:53px;min-height:53px;box-sizing:border-box;display:flex;align-items:center}
.book .gform_wrapper .gform-phone__country-selector{padding-top:0;padding-bottom:0;border-radius:10px}


/* Trenton 2026-08-21: hero checklist is plain text, not pills. Drops the panel
   background/border/padding from exm-home.css and the QA-106 fixed height,
   which only existed to level the pills. */
.hero .hchecks{gap:25px}
.hero .hchecks li{display:flex;align-items:center;gap:12px;height:auto;padding:0;font-size:16.2px;font-weight:700;color:#fff;background:transparent;border:0;border-radius:10px;backdrop-filter:blur(2px)}
@media (max-width:700px){.hero .hchecks li{height:auto;padding:0}}

/* Trenton 2026-08-21: pin a copy of the proof bar to the bottom of the hero on
   desktop at 30% background opacity; below 1024px the hero runs out of room, so
   that copy hides and the standalone bar under the hero takes over. */
.hero .proof-hero{position:absolute;left:0;right:0;bottom:0;z-index:3;background:rgba(10,6,22,.3);border-top:1px solid rgba(128,50,216,.2);border-bottom:0;backdrop-filter:blur(2px)}
.hero + .proof{display:none}
@media (max-width:1024px){
  .hero .proof-hero{display:none}
  .hero + .proof{display:block}
}

/* Trenton 2026-08-21: hero content clears the pinned proof bar. */
.hero > .wrap{width:100%;max-width:1180px;margin:0 auto;position:relative;padding:110px 32px 180px}
@media (max-width:1024px){.hero > .wrap{padding-bottom:80px}}
@media (max-width:640px){.hero > .wrap{padding:110px 24px 40px}}

/* ...but the pinned proof bar lives inside .hero too, so keep its own wrap. */
.hero .proof-hero .wrap{padding:0 32px;max-width:1320px}

/* Trenton 2026-08-21: hero fills the viewport minus the header only. */
.hero{padding:0;margin-top:77px;position:relative;min-height:calc(100vh - 77px);display:flex;align-items:flex-end;overflow:hidden}

/* Trenton 2026-08-21 (rev): homepage only, and only at tablet/mobile where copy centres. */
@media (max-width:1024px){
  body.home .wrap h1,body.home .wrap h2,body.home .wrap h3,
  body.home .wrap h4,body.home .wrap h5,body.home .wrap h6,
  body.home .wrap p,body.home .wrap .lead,body.home .wrap .sub,
  body.home .wrap .eyebrow,body.home .wrap .stepeyebrow{margin-top:0 !important;justify-content:center}}

/* Trenton 2026-08-21: hero must not be viewport-locked on touch devices.
   Desktop keeps the full-fold hero but on dvh so it survives browser chrome;
   at/below 1024 the hero sizes to its content so nothing is ever clipped. */
.hero{min-height:calc(100vh - 77px)}
@supports (height:100dvh){.hero{min-height:calc(100dvh - 77px)}}
@media (max-width:1024px){
  .hero{min-height:0;height:auto;overflow:visible;align-items:flex-start}
  .hero > .wrap{padding:72px 32px 72px}}
@media (max-width:640px){
  .hero > .wrap{padding:56px 24px 56px}}

/* Homepage video thumbnails: crop from the top so faces stay in frame (Trenton 2026-08-21) */
body.home .shot img{object-position:top}

/* How EXM Works (2026-08-24): three small wrappers for the rebuilt page.
   Everything else on that page reuses existing components verbatim. */
.figblock{margin-top:48px}
.figblock img{width:100%;max-width:940px;height:auto;border-radius:16px;border:1px solid var(--line);background:var(--card)}
.implday{margin-top:64px}
.implday:first-of-type{margin-top:48px}
.implday .stepeyebrow{justify-content:center}
.implday h3{font-size:26px;margin-top:14px}
.implday .checkgrid{margin-top:26px}
.wclose{margin-top:48px}
.wclose h3{font-size:24px;margin-bottom:10px}
.wclose .btnrow{margin-top:26px;justify-content:center}
@media (max-width:640px){.implday h3{font-size:22px}.figblock{margin-top:32px}}

/* ── nav dropdown video card ──────────────────────────────────────── */
.drop--video{min-width:600px;flex-direction:row;align-items:flex-start;gap:18px;padding:16px}
.drop--video .drop__links{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:236px}
.navvid{flex:0 0 264px;display:block;padding:0;border:0;background:transparent;cursor:pointer;text-align:left}
.navvid__shot{position:relative;display:block;border-radius:10px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;background:rgba(128,50,216,.14)}
.navvid__shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.navvid__tag{position:absolute;left:12px;bottom:12px;z-index:2;font-family:Montserrat,sans-serif;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.navvid__play{position:absolute;right:12px;bottom:10px;z-index:2;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(16,9,33,.72);border:1.5px solid var(--purple-bright);color:#fff;padding-left:3px;transition:transform .18s,background .18s}
.navvid:hover .navvid__play,.navvid:focus-visible .navvid__play{transform:scale(1.08);background:var(--purple-bright)}
.navvid:focus-visible{outline:2px solid var(--purple-bright);outline-offset:3px;border-radius:12px}
@media(max-width:1080px){
  .mkids .navvid{flex:0 0 auto;width:100%;margin-top:12px}
  .mkids .navvid__shot{aspect-ratio:16/9}
}

/* ── implementation days: copy left, checklist right ──────────────── */
@media(min-width:900px){
  .implday{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:44px;align-items:start;text-align:left}
  .implday .implday__copy{text-align:left}
  .implday .implday__copy .stepeyebrow{justify-content:flex-start}
  /* beats .checkgrid:has(> :last-child:nth-child(4)), which pairs 4-item lists into 2 columns */
  /* The count-based pairing rules use :has(), which outspecifies a plain
     descendant override — match their shape to win inside .implday only. */
  .implday .checkgrid,
  .implday .checkgrid:has(> :last-child:nth-child(4)),
  .implday .checkgrid:has(> :last-child:nth-child(2)){grid-template-columns:1fr;margin-top:0;gap:12px}
  .implday .checkgrid .item{width:100%}
}

/* Focus-points grid on How EXM Works: 3 cards on the first row, the rest on the
   second, so seven cards never leave an orphan. Twelve-column track so 3-up and
   4-up rows share one grid. Tablet drops to pairs with a full-width last card;
   mobile is a single column. Scoped to .ccards--split so other card grids keep
   the designed 3-up rhythm. */
@media(min-width:1024px){
  .ccards.ccards--split{grid-template-columns:repeat(12,1fr)}
  .ccards.ccards--split > *{grid-column:span 3}
  .ccards.ccards--split > :nth-child(-n+3){grid-column:span 4}
}
@media(min-width:640px) and (max-width:1023.98px){
  .ccards.ccards--split{grid-template-columns:repeat(2,1fr)}
  .ccards.ccards--split > *{grid-column:auto}
  .ccards.ccards--split > :last-child:nth-child(odd){grid-column:1 / -1}
}
@media(max-width:639.98px){
  .ccards.ccards--split{grid-template-columns:1fr}
  .ccards.ccards--split > *{grid-column:auto}
}

/* How EXM Works: closing CTA headline sits in a non-centered section. */
.gains .wclose{text-align:center}


/* ---------- Book a Call confirmation (booking calendar) ---------- */
.exm-booked{max-width:820px;margin:0 auto;text-align:center}
.exm-booked h2{margin:.2em 0 .35em;color:var(--ink)}
.exm-booked .sub{color:var(--body);max-width:62ch;margin:0 auto 22px}
.exm-booked__cal{margin-top:26px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}
.exm-booked__cal iframe{display:block;width:100%;min-height:720px;border:0}
@media (max-width:640px){.exm-booked__cal iframe{min-height:900px}}


/* ---------- Report: "Your first move" band (Trenton, 2026-08-25) ----------
   Headline left, copy centre, CTA right, X logomark watermark behind the
   right edge; everything stacks on tablet and mobile. */
.exm-report .rep-move{position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(150px,190px) minmax(0,1fr) minmax(0,240px);
  align-items:center;gap:24px;padding:30px 34px}
.exm-report .rep-move::after{content:"";position:absolute;top:50%;right:4%;
  width:230px;height:230px;transform:translateY(-50%);
  background:url("https://exmexponentialmomentum.kinsta.cloud/wp-content/uploads/2026/08/exm-x-logomark.png") no-repeat center/contain;
  opacity:.09;pointer-events:none;z-index:0}
.exm-report .rep-move>*{position:relative;z-index:1}
.exm-report .rep-move h2{margin:0;font-size:clamp(22px,2.2vw,28px);line-height:1.12}
.exm-report .rep-move p{margin:0;padding-left:28px;
  border-left:2px solid rgba(128,50,216,.55)}
.exm-report .rep-move p{min-width:0}
.exm-report .rep-move .btn{justify-self:end;white-space:normal;text-align:center;
  line-height:1.25;padding:14px 22px;font-size:13.5px}
@media(max-width:900px){
  .exm-report .rep-move{grid-template-columns:1fr;gap:18px;text-align:left}
  .exm-report .rep-move p{padding-left:0;border-left:0}
  .exm-report .rep-move .btn{justify-self:start}
  .exm-report .rep-move::after{width:240px;height:240px;right:-40px;opacity:.07}}


/* ---------- Report: "Your first move" band (Trenton, 2026-08-25) ----------
   Headline left, copy centre, CTA right, X logomark watermark behind the
   right edge; everything stacks on tablet and mobile. */
.exm-report .rep-move{position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(150px,190px) minmax(0,1fr) minmax(0,240px);
  align-items:center;gap:24px;padding:30px 34px}
.exm-report .rep-move::after{content:"";position:absolute;top:50%;right:4%;
  width:230px;height:230px;transform:translateY(-50%);
  background:url("https://exmexponentialmomentum.kinsta.cloud/wp-content/uploads/2026/08/exm-x-logomark.png") no-repeat center/contain;
  opacity:.09;pointer-events:none;z-index:0}
.exm-report .rep-move>*{position:relative;z-index:1}
.exm-report .rep-move h2{margin:0;font-size:clamp(22px,2.2vw,28px);line-height:1.12}
.exm-report .rep-move p{margin:0;padding-left:28px;
  border-left:2px solid rgba(128,50,216,.55)}
.exm-report .rep-move p{min-width:0}
.exm-report .rep-move .btn{justify-self:end;white-space:normal;text-align:center;
  line-height:1.25;padding:14px 22px;font-size:13.5px}
@media(max-width:900px){
  .exm-report .rep-move{grid-template-columns:1fr;gap:18px;text-align:left}
  .exm-report .rep-move p{padding-left:0;border-left:0}
  .exm-report .rep-move .btn{justify-self:start}
  .exm-report .rep-move::after{width:240px;height:240px;right:-40px;opacity:.07}}

/* ---------- Team system: coach view + invite blocks (Trenton, 2026-08-25) ---------- */
.exm-team{padding:120px 0 90px}
.exm-team .tm-top{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0 34px}
.exm-team .tm-stat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.exm-team .tm-num{display:block;font-family:Oswald,sans-serif;font-size:40px;line-height:1;color:var(--ink)}
.exm-team .tm-lbl{display:block;margin-top:6px;font-family:Montserrat,sans-serif;font-size:10.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--purple-soft)}
.exm-team .tm-h2,.exm-report .rep-team h2,.exm-team .tm-invite h2{font-family:Oswald,sans-serif;text-transform:uppercase;
  font-size:24px;margin:34px 0 14px;color:var(--ink)}
/* A global .wrap h2 rule forces margin-top:0 !important, so space with padding. */
.exm-team .tm-h2{padding-top:46px}
.exm-team .tm-align{margin-bottom:8px}
.exm-team .tm-table{margin-top:4px}
.exm-team .rep-fine{margin-top:34px}
.tm-back{margin:0 0 14px}
.tm-back a{display:inline-flex;align-items:center;gap:8px;font-family:Montserrat,sans-serif;font-size:11px;
  font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--purple-soft);
  border:1px solid var(--line);border-radius:999px;padding:9px 16px;background:var(--panel)}
.tm-back a:hover{color:var(--ink);border-color:var(--purple)}
@media(max-width:1024px){.exm-team .tm-h2{padding-top:34px}}
.tm-invite,.rep-team{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px 28px;margin:26px 0}
.tm-invite p,.rep-team p{color:var(--body);margin-bottom:14px}
.tm-copy{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.tm-copy input{flex:1 1 320px;min-width:0;background:var(--bg);border:1px solid var(--line);border-radius:999px;
  color:var(--ink);padding:13px 20px;font-family:Barlow,sans-serif;font-size:14px}
.tm-copy input:focus{outline:2px solid var(--purple-bright);outline-offset:2px}
.rep-teamlinks{margin-top:14px}
.rep-teamlinks a{color:var(--purple-soft);font-family:Montserrat,sans-serif;font-size:12.5px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.rep-teamlinks a:hover{color:var(--purple-bright)}
.exm-team .tm-align{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.exm-team .tm-al{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.exm-team .tm-al.is-wide{border-color:var(--accent)}
.exm-team .tm-al-h{display:flex;justify-content:space-between;align-items:baseline;font-family:Montserrat,sans-serif;
  font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.exm-team .tm-al-h i{font-style:normal;color:var(--purple-soft)}
.exm-team .tm-range{position:relative;height:8px;border-radius:999px;background:var(--purple-deep);margin:12px 0 10px}
.exm-team .tm-range i{position:absolute;top:0;bottom:0;border-radius:999px;
  background:linear-gradient(90deg,var(--purple),var(--purple-bright))}
.exm-team .tm-al.is-wide .tm-range i{background:linear-gradient(90deg,var(--purple),var(--accent))}
.exm-team .tm-al-f{font-size:13px;color:var(--body);margin:0}
.exm-team .tm-table{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel)}
.exm-team .tm-row{display:grid;grid-template-columns:2fr 1.2fr repeat(3,.7fr) 1fr 1.2fr;gap:12px;align-items:center;
  padding:16px 20px;border-top:1px solid var(--line)}
.exm-team .tm-row:first-child{border-top:0}
.exm-team .tm-head{background:var(--purple-deep);font-family:Montserrat,sans-serif;font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--purple-soft)}
.exm-team .tm-row.is-owner{background:rgba(128,50,216,.14)}
.exm-team .tm-who b{display:block;color:var(--ink);font-family:Oswald,sans-serif;font-weight:500;font-size:17px}
.exm-team .tm-who i{font-style:normal;font-size:12.5px;color:var(--body)}
.exm-team .tm-score b{font-family:Oswald,sans-serif;font-size:24px;color:var(--ink)}
.exm-team .tm-score i,.exm-team .tm-change i{display:block;font-style:normal;font-size:11.5px;color:var(--body)}
.exm-team .up{color:#5FD08A!important}
.exm-team .down{color:var(--accent)!important}
.exm-team .tm-cell{font-family:Oswald,sans-serif;font-size:19px;color:var(--body)}
.exm-team .tm-cell.is-focus{color:var(--purple-bright)}
.exm-team .tm-focus{font-size:13px;color:var(--body)}
.exm-team .tm-hist{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:0 20px 16px 20px;
  background:rgba(12,7,25,.45)}
.exm-team .tm-hist a{display:inline-flex;gap:6px;align-items:baseline;text-decoration:none;
  background:var(--card);border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.exm-team .tm-hist a b{font-family:Oswald,sans-serif;color:var(--ink)}
.exm-team .tm-hist a i{font-style:normal;font-size:11px;color:var(--body)}
.exm-team .tm-arrow{color:var(--purple-soft)}
.exm-team .tm-empty{color:var(--body);background:var(--card);border:1px dashed var(--line);border-radius:14px;padding:24px}
#gCompany.is-locked{opacity:.75;cursor:not-allowed}
@media (max-width:900px){
  .exm-team .tm-top{grid-template-columns:repeat(2,1fr)}
  .exm-team .tm-row{grid-template-columns:1fr 1fr;row-gap:8px}
  .exm-team .tm-head{display:none}
  .exm-team .tm-cell::before{content:attr(data-dim)}
}


/* Mobile drawer: the parent label is a real link, the + still opens the submenu. */
.mnav summary .msum-link{flex:1 1 auto;color:inherit;text-decoration:none;padding:14px 0;margin:-14px 0}
.mnav summary .msum-link:hover,.mnav summary .msum-link:focus{color:var(--purple-bright)}


/* Book a Call thank-you: Cole's scheduling form, embedded. */
.s-thanks-cal{padding:0 0 80px}
.s-thanks-cal .exm-cal{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:8px 8px 0;max-width:820px;margin:0 auto}
.s-thanks-cal iframe{display:block;width:100%!important;max-width:100%!important;min-width:0!important;min-height:640px;border:0;background:transparent;margin:0 auto}
@media(max-width:700px){.s-thanks-cal iframe{min-height:900px}}
.s-thanks-book{padding-bottom:24px}

/* ── sitewide booking modal ─────────────────────────────────────────── */
.exm-modal--book .exm-modal__panel { width: min(720px, 100%); }
.exm-modal--book .exm-modal__body { min-height: 620px; }
.exm-modal--book .exm-modal__body iframe { min-height: 620px; }

@media (max-width: 860px) {
	.exm-modal--book { padding: 0; }
	.exm-modal--book .exm-modal__panel { width: 100%; max-height: 100%; height: 100%; border-radius: 0; border-left: 0; border-right: 0; }
	.exm-modal--book .exm-modal__head { padding: 16px 18px 14px; }
	.exm-modal--book .exm-modal__title { font-size: 20px; }
	.exm-modal--book .exm-modal__body { min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
	.exm-modal--book .exm-modal__body iframe { min-height: 560px; }
}

/* Closing section without the form panel: one column, CTA under the copy. */
.closing .wrap:not(.split) { max-width: 820px; }
.closing .wrap:not(.split) .btnrow { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 34px; }
@media (max-width: 560px) {
	.closing .wrap:not(.split) .btnrow { flex-direction: column; align-items: stretch; }
	.closing .wrap:not(.split) .btnrow .btn,
	.closing .wrap:not(.split) .btnrow .phone { justify-content: center; text-align: center; }
}
.s-book-embed { padding: 0 0 90px; }
.s-book-embed .exm-book-frame { width: 100%; min-height: 640px; border: 0; display: block; max-width: 820px; margin: 0 auto; }

/* Base modal styles live in style.css, which the homepage does not load
   (it loads exm-home.css instead), so the booking modal rendered unstyled
   there. Repeated here because this file is loaded on every template. */
.exm-modal {
	position: fixed;
	inset: 0;
	z-index: 200;
	background: rgba(6, 3, 14, .92);
	backdrop-filter: blur(6px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4vh 4vw;
	opacity: 0;
	transition: opacity .25s;
	background-image: url(assets/brand-mark.png), linear-gradient(160deg, rgb(26, 16, 54) 0%, rgb(21, 12, 44) 100%);
	background-size: 120%;
}
.exm-modal[hidden]{display:none}
.exm-modal.on{opacity:1}
.exm-modal__panel{width:min(760px,100%);max-height:92vh;display:flex;flex-direction:column;background:#0B0616;border:1px solid var(--purple);border-radius:14px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.7)}
.exm-modal__head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 26px 18px;border-bottom:1px solid var(--line)}
.exm-modal__eyebrow{display:block;font-family:Montserrat,sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--purple-soft)}
.exm-modal__title{margin:6px 0 0;font-size:26px;line-height:1.1;font-family:Oswald,Montserrat,sans-serif;font-weight:600;text-transform:uppercase;color:#fff}
.exm-modal__close{flex:0 0 auto;background:none;border:1px solid var(--purple);color:#fff;border-radius:999px;width:40px;height:40px;font-size:20px;line-height:1;cursor:pointer;transition:background .2s}
.exm-modal__close:hover{background:rgba(128,50,216,.3)}
.exm-modal__body{flex:1 1 auto;min-height:60vh}
.exm-modal__body iframe{display:block;width:100%;height:100%;min-height:60vh;border:0}

/* Closing section, single column: copy stays left aligned like the rest of
   the page rather than inheriting the centered treatment. */
.closing .wrap:not(.split),
.s-home-closing .wrap:not(.split) { text-align: left; }
.closing .wrap:not(.split) h2,
.closing .wrap:not(.split) p,
.closing .wrap:not(.split) .checks,
.closing .wrap:not(.split) .checks li,
.s-home-closing .wrap:not(.split) h2,
.s-home-closing .wrap:not(.split) p,
.s-home-closing .wrap:not(.split) .checks,
.s-home-closing .wrap:not(.split) .checks li { text-align: left; margin-left: 0; margin-right: 0; }
.closing .wrap:not(.split) .btnrow,
.s-home-closing .wrap:not(.split) .btnrow { justify-content: flex-start; }

/* Report: attempt history ("Your progress") and the delta chip. */
.rep-delta{display:inline-block;margin-top:10px;padding:5px 12px;border-radius:999px;
  font:600 12px/1 "din-2014",sans-serif;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--line);color:var(--body)}
.rep-delta.is-up{border-color:rgba(128,50,216,.55);color:var(--purple-bright)}
.rep-delta.is-down{border-color:rgba(210,72,60,.55);color:var(--accent)}
.rep-history{margin-top:34px;padding:32px 34px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
.rep-history h2{margin:0 0 8px}
.rep-history > p{margin:0 0 20px;color:var(--body)}
.rh-list{list-style:none;margin:0;padding:0}
.rh-row{display:grid;grid-template-columns:120px 92px 1fr 90px 78px;gap:14px;align-items:center;
  padding:14px 0;border-top:1px solid var(--line)}
.rh-row:first-child{border-top:0}
.rh-row.is-current{color:var(--ink)}
.rh-date,.rh-band,.rh-delta{font-size:14px;color:var(--body)}
.rh-score{font-family:"oswald",sans-serif;font-size:20px;color:var(--ink)}
.rh-score b{font-size:26px}
.rh-row.is-current .rh-date,.rh-row.is-current .rh-band{color:var(--ink)}
.rh-delta{font-weight:600}
.rh-link{font-size:14px;color:var(--purple-bright);text-decoration:none}
.rh-this{color:var(--body)}
@media(max-width:760px){
  .rh-row{grid-template-columns:1fr auto;grid-row-gap:4px}
  .rh-band{grid-column:1/2}
  .rh-delta{grid-column:2/3;text-align:right}
  .rh-link{grid-column:1/3}}

/* Team view: per-person heat map across the three dimensions. */
.tm-cell{display:block;width:100%;box-sizing:border-box;padding:12px 8px;border-radius:10px;
  text-align:center;font-family:"oswald",sans-serif;font-size:20px;color:var(--ink);
  background:rgba(255,255,255,.03)}
.tm-cell.heat-0{background:rgba(210,72,60,.42)}
.tm-cell.heat-1{background:rgba(210,72,60,.22)}
.tm-cell.heat-2{background:rgba(128,50,216,.22)}
.tm-cell.heat-3{background:rgba(128,50,216,.42)}
.tm-cell.heat-4{background:rgba(177,107,255,.62)}
.tm-cell.is-focus{box-shadow:inset 0 0 0 2px var(--purple-bright)}
.tm-legend{display:flex;align-items:center;gap:6px;margin:0 0 20px;
  font:600 11px/1 "din-2014",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--body)}
.tm-legend i{width:30px;height:12px;border-radius:3px;display:inline-block}
.tm-legend i.heat-0{background:rgba(210,72,60,.42)}
.tm-legend i.heat-1{background:rgba(210,72,60,.22)}
.tm-legend i.heat-2{background:rgba(128,50,216,.22)}
.tm-legend i.heat-3{background:rgba(128,50,216,.42)}
.tm-legend i.heat-4{background:rgba(177,107,255,.62)}

/* Signed-in results dashboard, reached by magic link. */
.exm-my{padding:140px 0 100px}
.exm-my .my-lede{max-width:640px;color:var(--body);font-size:17px;line-height:1.7;margin:0 0 32px}
.my-note{border-radius:12px;padding:18px 22px;margin:0 0 28px;max-width:640px;border:1px solid var(--line);background:var(--card)}
.my-note.is-good{border-color:rgba(177,107,255,.5)}
.my-note.is-warn{border-color:rgba(210,72,60,.5)}
.my-note p{margin:0;color:var(--body);line-height:1.6}
.my-signin{max-width:640px}
.my-form{display:flex;gap:12px;flex-wrap:wrap}
.my-input{flex:1 1 280px;background:var(--panel);border:1px solid var(--line);border-radius:999px;
  padding:15px 22px;color:var(--ink);font-family:"din-2014",sans-serif;font-size:15px}
.my-input:focus{outline:none;border-color:var(--purple-bright)}
.my-list{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.my-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px}
.my-h2{font-family:"oswald",sans-serif;font-size:22px;color:var(--ink);margin:0 0 4px;text-transform:uppercase}
.my-meta{font-size:13px;color:var(--body);margin:0 0 18px}
.my-score{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;margin:0 0 8px}
.my-num{font-family:"oswald",sans-serif;font-size:52px;line-height:1;color:var(--ink)}
.my-den{font-size:15px;color:var(--body)}
.my-delta{flex:0 0 100%;font-size:13px;font-weight:700;margin-top:6px}
.my-delta.up{color:#7BD88F}
.my-delta.down{color:var(--accent)}
.my-band{color:var(--body);font-size:14px;margin:0 0 22px}
.my-acts{display:flex;gap:10px;flex-wrap:wrap}
.my-acts .btn-ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.my-acts .btn-ghost:hover{border-color:var(--purple-bright)}
@media(max-width:640px){.exm-my{padding:110px 0 70px}.my-list{grid-template-columns:1fr}}

/* Coach dashboard. */
.exm-coach{padding:140px 0 100px}
.exm-coach .co-out{color:var(--purple-bright);margin-left:8px}
.co-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.co-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px}
.co-name{font-family:"oswald",sans-serif;font-size:21px;color:var(--ink);margin:0 0 4px;text-transform:uppercase}
.co-sub{font-size:13px;color:var(--body);margin:0 0 18px}
.co-stats{display:flex;gap:26px;margin:0 0 18px}
.co-stats b{font-family:"oswald",sans-serif;font-size:30px;color:var(--ink);display:block;line-height:1.1}
.co-stats i{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--body);font-style:normal}
.co-assign{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 18px;
  padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.co-assign label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--body)}
.co-assign select{flex:1 1 150px;background:var(--panel);border:1px solid var(--line);border-radius:8px;
  padding:9px 12px;color:var(--ink);font-family:"din-2014",sans-serif;font-size:14px}
.co-assign select:focus{outline:none;border-color:var(--purple-bright)}
.co-save{padding:9px 18px;font-size:13px}
.co-acts{display:flex;gap:10px;flex-wrap:wrap}
.co-acts .btn-ghost,.co-assign .btn-ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.co-acts .btn-ghost:hover,.co-assign .btn-ghost:hover{border-color:var(--purple-bright)}
@media(max-width:640px){.exm-coach{padding:110px 0 70px}.co-grid{grid-template-columns:1fr}}
.co-said{font-size:12px;color:var(--purple-soft);min-width:64px}

.co-lines{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--line)}
.co-line{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 0;border-bottom:1px solid var(--line)}
.co-line-t b{display:block;font-size:14px;color:var(--ink);font-weight:600}
.co-line-t i{font-size:12px;color:var(--body);font-style:normal}
.co-line-a{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.co-line-a a,.co-copy{display:inline-flex;align-items:center;gap:7px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--purple-bright);background:none;border:0;padding:0;cursor:pointer;font-family:"din-2014",sans-serif}
.co-line-a a:hover,.co-copy:hover{color:var(--ink)}

.exm-coach{padding-top:150px}
@media(max-width:1024px){.exm-coach{padding-top:120px}}

.co-ico{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:#fff;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
/* Coach dashboard: search, sort, accordion rows. */
.co-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 18px}
.co-find{position:relative;flex:1 1 260px;max-width:320px}
.co-find input{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:10px;
color:var(--ink);padding:11px 14px 11px 40px;font-size:14px;font-family:inherit}
.co-find input::placeholder{color:var(--body)}
.co-find input:focus{outline:none;border-color:var(--purple-bright)}
.co-ico-find{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;
stroke:var(--purple-soft);pointer-events:none}
.co-sort{display:flex;align-items:center;gap:9px}
.co-sort label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--body)}
.co-sort select{background:var(--panel);border:1px solid var(--line);border-radius:10px;color:var(--ink);
padding:10px 12px;font-size:13px;font-family:inherit}
.co-sort select:focus{outline:none;border-color:var(--purple-bright)}
.co-none{color:var(--body);font-size:14px;margin:0 0 18px}
.co-grid{display:flex;flex-direction:column;gap:12px}
.co-card{padding:0;overflow:hidden}
.co-head{width:100%;display:flex;align-items:center;gap:16px;padding:17px 22px;background:none;
border:0;cursor:pointer;text-align:left;font-family:inherit}
.co-chev{width:16px;height:16px;flex:0 0 auto;fill:none;stroke:var(--purple-soft);stroke-width:2;
stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.co-card.is-open .co-chev{transform:rotate(90deg)}
.co-head .co-name{flex:1 1 auto;margin:0;font-size:17px}
.co-who{font-size:13px;color:var(--body);flex:0 0 auto}
.co-who.is-open-seat{color:var(--purple-soft)}
.co-when{font-size:13px;color:var(--body);flex:0 0 auto;text-align:right}
.co-when i{font-style:normal;opacity:.75}
.co-badge{flex:0 0 auto;min-width:44px;text-align:center;border-radius:100px;padding:5px 11px;
font-family:"oswald",sans-serif;font-size:15px;letter-spacing:.02em}
.co-badge.is-good{background:rgba(84,168,68,.18);color:#8FCB79}
.co-badge.is-mid{background:rgba(214,140,32,.18);color:#EDAB53}
.co-badge.is-low{background:rgba(210,72,60,.2);color:#F0968C}
.co-badge.is-none{background:var(--panel);color:var(--body)}
.co-panel{max-height:0;overflow:hidden;transition:max-height .22s ease}
.co-panel-in{padding:2px 22px 22px 54px}
.co-panel .co-sub{margin:0 0 14px}
.co-panel .co-lines{margin-top:14px}
@media(max-width:900px){
.co-head{flex-wrap:wrap;gap:9px 14px;padding:15px 17px}
.co-head .co-name{flex:1 1 auto;order:1;min-width:0}
.co-chev{order:0}
.co-badge{order:2}
.co-who,.co-when{order:3;text-align:left;font-size:12px;flex:0 0 auto}
.co-who{flex-basis:100%}
.co-line-a{width:100%;justify-content:flex-start}
.co-panel-in{padding:2px 17px 18px}
.co-line{flex-wrap:wrap}
}


/* ---------- Coach view: tabs, health strip, sortable roster (Trenton, 2026-08-26) ---------- */
.exm-team .tm-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 4px}
.exm-team .tm-tab{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;
  border:1px solid var(--line);background:var(--panel);color:var(--body);
  font-family:Montserrat,sans-serif;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.exm-team .tm-tab i{font-style:normal;font-size:10px;min-width:18px;height:18px;line-height:18px;text-align:center;
  border-radius:999px;background:rgba(128,50,216,.3);color:var(--ink)}
.exm-team .tm-tab:hover{color:var(--ink);border-color:var(--purple)}
.exm-team .tm-tab.is-on{background:var(--purple);border-color:var(--purple);color:#fff}
.exm-team .tm-tab.is-on i{background:rgba(255,255,255,.25)}
.exm-team .tm-stat{display:flex;flex-direction:column}
.exm-team .tm-tag{align-self:flex-start;margin-top:10px;padding:4px 10px;border-radius:999px;
  font-family:Montserrat,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.exm-team .tm-tag.is-up{background:rgba(84,168,68,.18);color:#8FCB79}
.exm-team .tm-tag.is-down{background:rgba(214,140,32,.18);color:#EDAB53}
.exm-team .tm-sub{display:block;margin-top:9px;font-size:12px;color:rgba(233,233,238,.55)}
.exm-team .tm-fine{margin:14px 0 0;font-size:12px;color:rgba(233,233,238,.5)}
.exm-team .tm-range b{position:absolute;left:0;top:0;bottom:0;border-radius:999px;display:block}
.exm-team .tm-range b.heat-0{background:rgba(210,72,60,.75)}
.exm-team .tm-range b.heat-1{background:rgba(210,72,60,.5)}
.exm-team .tm-range b.heat-2{background:rgba(128,50,216,.62)}
.exm-team .tm-range b.heat-3{background:linear-gradient(90deg,var(--purple),var(--purple-bright))}
.exm-team .tm-range b.heat-4{background:linear-gradient(90deg,var(--purple-bright),var(--purple-soft))}
.exm-team .tm-range i{background:rgba(255,255,255,.34);height:3px;top:50%;bottom:auto;transform:translateY(-50%);z-index:2}
.exm-team .tm-al.is-wide .tm-range i{background:rgba(255,255,255,.5)}
.exm-team .tm-h2row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.exm-team .tm-h2row .tm-h2{margin-bottom:14px}
.exm-team .tm-sort{display:inline-flex;align-items:center;gap:10px;margin-bottom:16px;
  font-family:Montserrat,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--purple-soft)}
.exm-team .tm-sort select{background:var(--panel);border:1px solid var(--line);border-radius:999px;color:var(--ink);
  padding:9px 14px;font-family:Montserrat,sans-serif;font-size:12px;font-weight:600;letter-spacing:0;text-transform:none}
@media(max-width:760px){
  .exm-team .tm-h2row{align-items:flex-start}
  .exm-team .tm-sort{margin-bottom:14px}
  .exm-team .tm-tabs{gap:6px}
  .exm-team .tm-tab{padding:8px 12px;font-size:10px}
}

/* ---------- Coach view: per-person accordion for wide assessments (Trenton, 2026-08-26) ---------- */
.exm-team .tm-table.is-wide{padding:0}
.exm-team .tm-wrow{display:grid;grid-template-columns:1.9fr .6fr 1.5fr 22px;gap:14px;align-items:center;padding:15px 20px;width:100%}
.exm-team .tm-whead{background:rgba(128,50,216,.14);font-family:Montserrat,sans-serif;font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--purple-soft)}
.exm-team .tm-person + .tm-person,.exm-team .tm-whead + .tm-person{border-top:1px solid var(--line)}
.exm-team .tm-whead-btn{background:none;border:0;cursor:pointer;text-align:left;font-family:inherit;color:inherit}
.exm-team .tm-whead-btn:hover{background:rgba(128,50,216,.1)}
.exm-team .tm-person.is-owner .tm-whead-btn{background:rgba(128,50,216,.08)}
.exm-team .tm-whead-btn .tm-who b{display:block;font-family:"din-2014",sans-serif;font-size:15px;color:var(--ink)}
.exm-team .tm-whead-btn .tm-who i{display:block;margin-top:3px;font-style:normal;font-size:12.5px;color:rgba(233,233,238,.55)}
.exm-team .tm-wscore{font-family:Oswald,sans-serif;font-size:22px;color:var(--ink)}
.exm-team .tm-weak{display:inline-flex;align-items:center;gap:10px}
.exm-team .tm-weak b{min-width:42px;text-align:center;padding:4px 9px;border-radius:7px;font-family:Oswald,sans-serif;font-size:14px}
.exm-team .tm-weak i{font-style:normal;font-size:13px;color:var(--body)}
.exm-team .tm-weak b.heat-0{background:rgba(210,72,60,.42);color:#F5C4B3}
.exm-team .tm-weak b.heat-1{background:rgba(210,72,60,.22);color:#F0B7A8}
.exm-team .tm-weak b.heat-2{background:rgba(128,50,216,.22);color:#CECBF6}
.exm-team .tm-weak b.heat-3{background:rgba(128,50,216,.42);color:#EEEDFE}
.exm-team .tm-weak b.heat-4{background:rgba(177,107,255,.62);color:#fff}
.exm-team .tm-chev{color:var(--purple-soft);transition:transform .2s}
.exm-team .tm-person.is-open .tm-chev{transform:rotate(90deg)}
.exm-team .tm-pdetail{max-height:0;overflow:hidden;transition:max-height .25s ease}
.exm-team .tm-pdetail-in{display:grid;grid-template-columns:1fr 1fr;gap:16px 34px;padding:6px 20px 20px;
  border-top:1px solid var(--line)}
.exm-team .tm-cat{padding-top:12px}
.exm-team .tm-cat-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:7px}
.exm-team .tm-cat-h span{font-size:13.5px;color:var(--ink)}
.exm-team .tm-cat-h b{font-family:Oswald,sans-serif;font-size:14px;color:var(--purple-soft)}
.exm-team .tm-cat.is-focus .tm-cat-h span{color:var(--purple-bright)}
.exm-team .tm-cat-bar{background:var(--bg);border-radius:999px;height:6px;overflow:hidden}
.exm-team .tm-cat-bar i{display:block;height:100%;border-radius:999px}
.exm-team .tm-cat-bar i.heat-0{background:rgba(210,72,60,.75)}
.exm-team .tm-cat-bar i.heat-1{background:rgba(210,72,60,.5)}
.exm-team .tm-cat-bar i.heat-2{background:rgba(128,50,216,.62)}
.exm-team .tm-cat-bar i.heat-3{background:linear-gradient(90deg,var(--purple),var(--purple-bright))}
.exm-team .tm-cat-bar i.heat-4{background:linear-gradient(90deg,var(--purple-bright),var(--purple-soft))}
.exm-team .tm-hist-in{padding:0 20px 18px;margin:0}
@media(max-width:760px){
  .exm-team .tm-wrow{grid-template-columns:1fr auto 22px;gap:10px}
  .exm-team .tm-whead span:nth-child(3){display:none}
  .exm-team .tm-weak{grid-column:1/-1;justify-content:flex-start}
  .exm-team .tm-pdetail-in{grid-template-columns:1fr;gap:4px 0}
}

/* ---------- Slim app chrome for /coach/ and /team/ (Trenton, 2026-08-26) ---------- */
body.exm-app{background:var(--bg)}
.exm-appbar{border-bottom:1px solid var(--line);background:rgba(18,10,39,.9);position:sticky;top:0;z-index:60;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.exm-appbar .wrap,.exm-appfoot .wrap{display:flex;align-items:center;gap:16px;padding-top:13px;padding-bottom:13px}
.exm-appbar-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.exm-appbar .exm-appbar-brand img{height:34px!important;width:auto!important;max-width:none;display:block}
.exm-appbar-label{font-family:Montserrat,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--purple-soft);padding:5px 10px;border:1px solid var(--line);border-radius:999px}
.exm-appbar-right{margin-left:auto;display:inline-flex;align-items:center;gap:14px;font-size:13px}
.exm-appbar-right i{font-style:normal;color:var(--body)}
.exm-appbar-right a{color:var(--purple-soft);text-decoration:none}
.exm-appbar-right a:hover{color:var(--purple-bright)}
.exm-appfoot{border-top:1px solid var(--line);margin-top:60px;font-size:12.5px;color:rgba(233,233,238,.5)}
.exm-appfoot a{color:var(--purple-soft);text-decoration:none;margin-left:auto}
body.exm-app .exm-coach,body.exm-app .exm-team{padding-top:44px}
body.admin-bar .exm-appbar{top:32px}
@media(max-width:782px){body.admin-bar .exm-appbar{top:46px}}
@media(max-width:600px){.exm-appbar-label{display:none}}

/* Results filter bars — Stage / Industry / Role (stacked, labelled) */
.filterbars{margin-bottom:34px}
.filterrow{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:center;gap:18px}
.filterfield{display:flex;flex-direction:column;gap:8px;flex:1 1 220px;max-width:320px;text-align:left}
.filterfield .filters-label{font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--purple-soft)}
.filterselect{width:100%;appearance:none;-webkit-appearance:none;font-family:Montserrat,sans-serif;font-size:14px;color:var(--ink);background-color:var(--card);border:1px solid var(--line);border-radius:999px;padding:13px 44px 13px 20px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23AF7EE7' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center;background-size:12px 8px;transition:border-color .2s,background-color .2s}
.filterselect:hover{border-color:var(--purple-bright)}
.filterselect:focus-visible{outline:2px solid var(--purple-bright);outline-offset:2px}
.filterselect option{background:var(--panel);color:var(--ink)}
@media(max-width:760px){.filterrow{flex-direction:column;align-items:stretch;gap:14px}.filterfield{flex:0 0 auto;max-width:none}}

/* ---------- Centered sections: body copy shares the headline's center line
   (Trenton, 2026-09-03). exm-design.css already caps these at 860px; this only
   adds the auto side margins so the measure is centered, never left-hung.
   Margins only — no width/alignment changes — so nothing else can shift. ---------- */
body section.center .wrap > p,
body section.center .wrap > .sub,
body .wrap.center > .sub{margin-left:auto;margin-right:auto}

/* ---------- Homepage 3D model: state labels around the collapse animation
   (EXM-52, Cullen / Trenton 2026-09-04). The break component runs with its own
   header off, so these two labels tell the reader which state is which:
   red = a side giving way, purple = all three holding. ---------- */
.s-home-method .mstate{max-width:860px;margin:34px auto 0;text-align:center}
.s-home-method .mstate--hold{margin-top:30px;margin-bottom:6px}
.s-home-method .mstate__pill{display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border-radius:999px;font-family:Montserrat,sans-serif;font-weight:700;font-size:12px;line-height:1;letter-spacing:.16em;text-transform:uppercase}
.s-home-method .mstate--break .mstate__pill{color:#E2695B;border:1px solid rgba(226,105,91,.4);background:rgba(226,105,91,.1)}
.s-home-method .mstate--hold .mstate__pill{color:#B16BFF;border:1px solid rgba(177,107,255,.4);background:rgba(177,107,255,.1)}
.s-home-method .mstate__line{margin:12px auto 0;max-width:720px;font-size:16px;line-height:1.6;color:var(--body)}
.s-home-method .exm-break{margin-top:22px}
/* Embedded on the homepage the viz sits in a much taller box than it needs. */
.s-home-method .exm-break__deck{min-height:0}
.s-home-method .exm-break{padding-block:0}
.s-home-method .exm-break__deck{padding:clamp(26px,3vw,40px) clamp(20px,4vw,52px)}
.s-home-method .exm-break__viz{width:100%;max-width:572px;margin-inline:auto} /* match the /3d-momentum-method/ chart size */
.s-home-method .mhead .msub{margin-top:40px !important} /* breathing room under the panel (Trenton, 09-04) */
@media(max-width:760px){.s-home-method .mstate{margin-top:26px}.s-home-method .mstate__line{font-size:15px}}

/* 92 ── Become a Coach (Video Application).
   Trenton, 2026-09-14: cards sit at equal height in a row but read from the
   top, the photo bands show the whole frame, and a button under left-aligned
   copy lines up with it instead of floating to the middle. */
.btnrow--start{justify-content:flex-start}
.page-template-become-a-coach-video .ccards{align-items:stretch}
.page-template-become-a-coach-video .ccard{justify-content:flex-start;height:100%}
.page-template-become-a-coach-video .ccard .cicowrap{margin-top:0}
.page-template-become-a-coach-video .ccard .stepno{margin-top:0;margin-bottom:14px}
.page-template-become-a-coach-video .ccard h3,
.page-template-become-a-coach-video .ccard p{margin-top:0}
@media(max-width:620px){
  .page-template-become-a-coach-video .bandphoto{aspect-ratio:var(--band-ratio,4/3)}
}
.page-template-become-a-coach-video .s-coach-diff .wrap.split{align-items:center}
.page-template-become-a-coach-video .s-coach-diff h2{margin:0}

/* ── Trenton review videos, 2026-09-15 ───────────────────────────────────── */

/* Become a Coach, "what we demand" band: five cards in a three-column grid
   left the last two hanging under cards one and two. Run that case on a
   six-column track so the final pair sits centered under the row above.
   Only above 1080px, where .ccards is still multi-column. */
@media(min-width:1081px){
  .s-coach-demands .ccards:has(> :last-child:nth-child(5)){grid-template-columns:repeat(6,1fr)}
  .s-coach-demands .ccards:has(> :last-child:nth-child(5)) > *{grid-column:span 2}
  .s-coach-demands .ccards:has(> :last-child:nth-child(5)) > :nth-child(4){grid-column:2 / span 2}
}

/* Same page: card rows sat at different heights, so the copy stepped up and
   down row to row. One track height for every row in these grids. */
.s-coach-nonneg .ccards,
.s-coach-demands .ccards,
.s-coach-apply .ccards{grid-auto-rows:1fr}

/* Lead pillar added to the primary nav. Ten top-level items plus the Book a
   Call button overflow the 1320px nav container between 1081px and 1299px and
   clip the button, so tighten the row through that band rather than dropping
   to the burger early. */
@media(min-width:1081px) and (max-width:1299px){
  .nav{gap:18px;padding:0 20px}
  .nav .links{gap:14px}
  .nav .links a{font-size:11px;letter-spacing:.10em}
  .nav .links a.btn{padding:12px 20px;font-size:11px}
  .nav .links .car{display:none}
}

/* Proof grid: records with an approved quote but no video render as
   .quote-card next to image cards, which read as an empty video slot
   (Trenton, 2026-09-15 review). Give them a deliberate quote treatment and
   the same footprint as a video card instead of an unexplained blank tile. */
.rcard.quote-card{position:relative;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:30px 30px 26px;overflow:hidden}
.rcard.quote-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;
  background:linear-gradient(180deg,#B16BFF 0%,#8032D8 100%)}
.rcard.quote-card::after{content:"\201C";position:absolute;right:22px;top:6px;
  font-family:Oswald,"oswald",sans-serif;font-size:74px;line-height:1;font-weight:600;
  color:rgba(177,107,255,.16);pointer-events:none}
.rcard.quote-card .kind{display:inline-block;font-family:Montserrat,sans-serif;font-size:10px;
  font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--purple-soft);
  border:1px solid rgba(128,50,216,.45);border-radius:999px;padding:6px 14px;margin-bottom:18px}

/* ------------------------------------------------------------------ *
 * Homepage advantage cards, photo treatment
 * Cullen asked for real event photography instead of the line-art
 * icons in this section (video review 2026-09-14). A card only picks
 * up this treatment when it actually has a photo, so icon-only cards
 * keep the original padded look.
 * ------------------------------------------------------------------ */
.gain.gain--photo{padding:0;overflow:hidden;display:flex;flex-direction:column}
.gain.gain--photo .gphoto{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--panel)}
.gain.gain--photo .gphoto img{width:100%;height:100%;object-fit:cover;display:block}
/* Keeps the card bottom dark where the photo meets the copy. */
.gain.gain--photo .gphoto::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,7,25,0) 62%,rgba(23,14,48,.72) 100%);pointer-events:none}
/* Oswald caps sit high in their line box, so a 26px margin still read as the
   heading touching the photo (Trenton, 2026-09-15). Copy block gets its own
   padding instead of per-element margins. */
.gain.gain--photo .gcopy,
.gain.gain--photo h3{margin:0}
.gain.gain--photo h3{padding:34px 28px 0}
.gain.gain--photo .gkick{margin:12px 28px 0}
.gain.gain--photo .gbody{margin:12px 28px 32px}
@supports not (aspect-ratio:16/9){
  .gain.gain--photo .gphoto{height:0;padding-bottom:56.25%}
  .gain.gain--photo .gphoto img{position:absolute;inset:0}
}
/* The section drops straight from three columns to one at 1080px, which
   leaves photo cards very tall on tablets. Two columns in between, scoped
   to this section so no other .cards3 grid changes. */
@media (min-width:701px) and (max-width:1080px){
  .s-home-gains .cards3{grid-template-columns:repeat(2,1fr);max-width:900px}
}
@media (max-width:700px){
  .gain.gain--photo h3{padding:28px 22px 0}
  .gain.gain--photo .gkick{margin:10px 22px 0}
  .gain.gain--photo .gbody{margin:10px 22px 26px}
}

/* ===========================================================================
   Momentum Method pyramid: hover prompt (2026-09-15)
   The travelling X logomark was removed from the chart; this line plus the
   scripted first-view tour in exm-momentum-method.js is what now tells people
   the pyramid is interactive.
   =========================================================================== */
.exm-mm .exm-mm-guide{margin:14px 0 0 !important;text-align:center;
  font-family:"Montserrat",Helvetica,Arial,sans-serif;font-size:11.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--body);opacity:.75}
.exm-mm.is-touring .exm-mm-guide{opacity:1;color:#A163F1}
@media(max-width:1080px){
  .exm-mm .exm-mm-guide{display:none}
}