/* The Sales Cycle — site styles.
   Desktop sizes are written in Figma pixels × --u (1px at a 1920 frame, scaling down with the window).
   Up to 1024px the layout stacks and uses fixed mobile sizes. */

:root {
	--orange: #ff3c00;
	--orange-deep: #e85d04;
	--paper: #f2e7db;
	--paper-2: #e1d7cc;
	--ink: #131312;
	--ink-2: #202020;
	--tile: #1a1a1a;
	--shadow: #1e1e1e;
	--grey: #5d5d5d;
	--hair: #b0aca9;
	--rule: #d6ccc2;
	--mist: #c5beb6;
	--judge: 'F37 Judge', Impact, 'Arial Narrow Bold', 'Arial Narrow', 'Nimbus Sans Narrow', 'Liberation Sans Narrow', 'Roboto Condensed', sans-serif;
	--judge-c: 'F37 Judge Condensed', 'F37 Judge', Impact, 'Arial Narrow Bold', 'Arial Narrow', 'Nimbus Sans Narrow', 'Liberation Sans Narrow', 'Roboto Condensed', sans-serif;
	--radio: 'PP Radio Grotesk', 'Helvetica Neue', Arial, sans-serif;
	--mono: 'KH Interference', ui-monospace, 'SFMono-Regular', Menlo, monospace;
	--u: min(1px, calc(100vw / 1920));
	--ease: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--radio); font-size: 18px; line-height: 1.09; letter-spacing: -.02em; overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
.wp-site-blocks > * + *, .wp-site-blocks { margin-block-start: 0; }
.site-main { overflow: hidden; }
section { position: relative; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 700; }
mark { background: none; color: var(--orange); }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }

/* Film grain on everything */
body::after {
	content: ''; position: fixed; inset: 0; z-index: 900; pointer-events: none; opacity: .07;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Type ---------- */
.h-xl, .h-l, .h-m, .ftr__tag, .stepcard__title, .benefit__title, .phase__title, .verdicts__quote, .quote--lead .quote__text, .stepnum__n, .statbar b, .receipts b {
	font-family: var(--judge); font-weight: 700; line-height: .88; letter-spacing: 0; text-transform: uppercase;
}
.h-xl { font-size: max(52px, calc(var(--fs, 152) * var(--u))); }
.h-l { font-size: max(40px, calc(var(--fs, 84) * var(--u))); }
.h-m { font-size: max(32px, calc(var(--fs, 64) * var(--u))); }
.lead, .body { font-size: max(15px, calc(18 * var(--u))); line-height: 1.09; max-width: max(300px, calc(339 * var(--u))); }
.body { color: #616161; max-width: max(280px, calc(339 * var(--u))); }

/* Outlined display type (KH Interference, LORE, Ugly Dave, Palmer Lake) as colourable masks */
.t {
	--k: max(var(--u), var(--kmin, .8px));
	display: inline-block; vertical-align: middle; flex: none;
	width: calc(var(--w) * var(--k)); max-width: calc(100% + var(--p) * var(--k) * 2); aspect-ratio: var(--w) / var(--h);
	margin: calc(var(--p) * var(--k) * -1);
	background: currentColor;
	-webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat;
}
.label { display: block; color: var(--orange); margin-bottom: calc(26 * var(--u)); }
.label--paper { color: var(--paper); }

/* ---------- Buttons & links ---------- */
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: max(20px, calc(36 * var(--u))); margin-top: max(32px, calc(72 * var(--u))); }
.cta-row--center { justify-content: center; }
/* Buttons are core/button blocks (so the client can edit, relink and hide them): drop WP's pill styling */
.wp-block-buttons.wp-block-buttons { gap: max(20px, calc(36 * var(--u))); }
:where(.wp-block-button) .wp-block-button__link { all: unset; box-sizing: border-box; cursor: pointer; }
a.btn, .btn > a, .tlink > a { font: 400 max(12px, calc(16 * var(--u)))/1 var(--mono); text-transform: uppercase; letter-spacing: 0; white-space: nowrap; }
.tlink--small > a { font-size: max(11px, calc(12 * var(--u))); }
a.btn, .btn > a {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: max(52px, calc(72 * var(--u))); padding: 0 max(18px, calc(23 * var(--u)));
	background: var(--orange); color: var(--paper); border: 2px solid var(--ink-2);
	box-shadow: 8px 8px 0 var(--ink-2); transition: transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s;
}
:is(a.btn, .btn > a):hover { transform: translate(3px, 3px); box-shadow: 5px 5px 0 var(--ink-2); }
.btn--sm { font-size: max(12px, calc(18 * var(--u))) !important; min-height: max(44px, calc(58 * var(--u))); padding: 0 max(14px, calc(30 * var(--u))); }
.btn--paper > a { background: var(--paper); color: var(--orange); }
.tlink > a { position: relative; display: inline-flex; padding-bottom: 9px; color: var(--paper); transition: color .3s; }
.tlink > a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: currentColor; transform-origin: right; transition: transform .45s var(--ease); }
.tlink > a:hover { color: var(--orange); }
.tlink > a:hover::after { transform: scaleX(0); }
.tlink--ink > a { color: var(--ink-2); }
.tlink--small > a { padding-bottom: 6px; }

/* ---------- Decorations ---------- */
.steps { position: absolute; z-index: 2; width: calc(var(--sw, 169) * var(--u)); aspect-ratio: 169 / 135; color: var(--orange); pointer-events: none; }
.steps i { position: absolute; background: currentColor; }
.steps i:nth-child(1) { left: 0; top: 0; width: 100%; height: 17.5%; }
.steps i:nth-child(2) { left: 37.9%; top: 16.5%; width: 62.1%; height: 42.5%; }
.steps i:nth-child(3) { left: 71%; top: 58%; width: 29%; height: 42%; }
.steps--paper { color: var(--paper); }
.steps--paper2 { color: var(--paper-2); }
.steps--br, .steps--seat, .steps--photo-br, .steps--persona-b { transform: scaleY(-1); }
.steps--tl { transform: scaleX(-1); }
.steps--bl, .steps--persona-a { transform: scale(-1, -1); }
.hero > .steps--br { right: 0; bottom: 0; }
.steps--tl { left: calc(-24 * var(--u)); top: calc(-24 * var(--u)); --sw: 181; } /* past the manifesto's side margin, to the screen edge */
.manifesto .steps--br { right: 0; bottom: 0; --sw: 111; }
.tape { position: absolute; z-index: 3; pointer-events: none; }
.grid-tex {
	position: absolute; inset: 0; pointer-events: none;
	background-image: linear-gradient(rgba(242, 231, 219, .1) 1px, transparent 1px), linear-gradient(90deg, rgba(242, 231, 219, .1) 1px, transparent 1px);
	background-size: calc(36 * var(--u)) calc(36 * var(--u));
}
.grid-tex--ink { background-image: linear-gradient(rgba(19, 19, 18, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(19, 19, 18, .07) 1px, transparent 1px); bottom: auto; height: calc(1080 * var(--u)); }
.ph { overflow: hidden; }
.ph img { width: 100%; height: 100%; object-fit: cover; }
.ill { position: relative; }
.ill img { width: 100%; }
.underline { width: calc(240 * var(--u)); min-width: 160px; margin: calc(8 * var(--u)) auto 0; }

/* ---------- Header ---------- */
.site-header { position: fixed; z-index: 50; top: var(--wp-admin--admin-bar--height, 0px); left: 0; right: 0; }
.hdr { display: flex; align-items: center; justify-content: space-between; padding: max(20px, calc(52 * var(--u))) calc(160 * var(--u)) 0; color: var(--paper); transition: padding .4s var(--ease), background-color .4s; }
/* Sticky: a dark bar fades in once the page scrolls */
.is-stuck .hdr { padding-top: 10px; padding-bottom: 10px; background: rgba(19, 19, 18, .88); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.site-header.is-stuck .hdr__nav { color: var(--paper); }
.hdr__logo img { transition: width .4s var(--ease); }
.is-stuck .hdr__logo img { width: max(48px, calc(64 * var(--u))); }
body:has(.page-how-we-help) .hdr__nav, body:has(.page-our-talent) .hdr__nav, body:has(.page-generic) .hdr__nav { color: var(--ink); }
body:has(.page-generic) .hdr { background: var(--ink); padding-bottom: 24px; }
.hdr__logo img { width: max(64px, calc(98 * var(--u))); }
.hdr__nav { display: flex; align-items: center; gap: calc(39 * var(--u)); font-size: max(15px, calc(18 * var(--u))); }
.hdr__link { position: relative; padding: 8px 0; }
.hdr__circle { position: absolute; left: 50%; top: 50%; width: calc(100% + 40px); max-width: none; translate: -50% -50%; opacity: 0; pointer-events: none; clip-path: inset(0 100% 0 0); }
.hdr__link[aria-current] .hdr__circle { opacity: 1; clip-path: inset(0 0 0 0); }
.hdr__nav .btn { margin-left: calc(9 * var(--u)); }
.hdr__burger { display: none; }
.hdr__menu[hidden] { display: none; }

/* ---------- Contact (Jetpack form) — styled by element, so it holds whatever classes Jetpack prints ---------- */
.contact { padding: calc(110 * var(--u)) calc(160 * var(--u)) calc(160 * var(--u)); overflow: hidden; }
.contact .steps--bl { left: 0; bottom: 0; --sw: 260; }
.contact__title { --fs: 104; margin-bottom: calc(48 * var(--u)); color: var(--ink); }
.contact form { display: grid; grid-template-columns: 1fr 1fr; gap: calc(36 * var(--u)) calc(80 * var(--u)); }
.contact form > div, .contact .wp-block-jetpack-contact-form { display: contents; }
.contact :is(.grunion-field-wrap, .grunion-field-text-wrap, .grunion-field-name-wrap, .grunion-field-email-wrap) { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.contact label { font: 400 max(11px, calc(13 * var(--u)))/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #6a6459; }
.contact label :is(span, .grunion-label-required) { display: none; }
.contact input:not([type=hidden], [type=submit]), .contact textarea { width: 100%; padding: 0 0 12px; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: none; font: 400 max(20px, calc(38 * var(--u)))/1.2 var(--radio); letter-spacing: -.01em; color: var(--ink); }
.contact input::placeholder { color: rgba(19, 19, 18, .28); }
.contact input:focus { outline: none; border-bottom-color: var(--orange); }
.contact :is(.wp-block-jetpack-button, .contact-submit) { grid-column: 1 / -1; justify-self: end; margin-top: calc(40 * var(--u)); }
.contact button, .contact [type=submit] { all: unset; position: relative; cursor: pointer; padding-bottom: max(18px, calc(34 * var(--u))) !important; font: 400 max(22px, calc(48 * var(--u)))/1 var(--mono); letter-spacing: -.02em; text-transform: uppercase; color: var(--orange); background: none !important; transition: translate .3s var(--ease); }
/* the marker line is its own layer under the text, so button styles from Jetpack can't stretch it over the label */
.contact button::after, .contact [type=submit]::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: max(12px, calc(26 * var(--u))); background: url(../logos/marker-underline.svg) center / 100% 100% no-repeat; pointer-events: none; }
.contact button:hover, .contact [type=submit]:hover { translate: 6px 0; }

/* ---------- Footer ---------- */
.ftr { position: relative; z-index: 3; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: max(80px, calc(104 * var(--u))); padding: 0 calc(150 * var(--u)) 0 calc(169 * var(--u)); background: var(--orange); color: var(--paper); }
.ftr__logo img { width: max(56px, calc(81 * var(--u))); }
.ftr__tag { font-size: max(28px, calc(48 * var(--u))); }
.ftr__copy { justify-self: end; max-width: max(260px, calc(360 * var(--u))); font-size: max(13px, calc(18 * var(--u))); color: #efefef; }

/* ---------- Hero ---------- */
.hero { min-height: max(620px, calc(1080 * var(--u))); overflow: hidden; color: var(--paper); background: var(--ink); }
.hero__bg { position: absolute; inset: 0; }
.hero--photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(19, 19, 18, .55), rgba(19, 19, 18, 0) 60%); pointer-events: none; }
.hero__inner { position: relative; z-index: 2; padding: max(150px, calc(200 * var(--u))) calc(160 * var(--u)) 0; }
.hero__inner--low { padding-top: max(190px, min(calc(451 * var(--u)), calc(100svh - 620px))); }
.hero__inner.hero__inner--low .rv { max-width: calc(1300 * var(--u)); }
.hero:has(.hero__inner--low) { min-height: max(620px, min(100svh, calc(1080 * var(--u)))); }
.hero__inner .rv { max-width: calc(800 * var(--u)); margin-top: calc(16 * var(--u)); }
.hero__inner .lead { margin-top: calc(40 * var(--u)); }
.hero__eyebrow { color: var(--paper); }

/* ---------- Home ---------- */
.statbar { position: relative; z-index: 2; display: flex; justify-content: center; align-items: center; min-height: max(76px, calc(94 * var(--u))); background: var(--orange); color: var(--paper); }
.statbar__item { display: flex; align-items: center; gap: calc(11 * var(--u)); padding: 0 calc(20 * var(--u)); }
.statbar__item + .statbar__item { border-left: 1px solid rgba(242, 231, 219, .6); }
.statbar b { font-size: max(28px, calc(40.6 * var(--u))); color: #fff; }
.statbar span { font-size: max(12px, calc(16 * var(--u))); max-width: calc(130 * var(--u)); min-width: 90px; line-height: 1.09; }

.manifesto { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: calc(24 * var(--u)) calc(24 * var(--u)) 0; min-height: calc(605 * var(--u)); padding: calc(88 * var(--u)) 20px; background: var(--ink); color: var(--paper); text-align: center; }
.manifesto__bg { position: absolute; inset: 0; z-index: -1; }
.manifesto__bg img { object-position: 50% 19%; }
.manifesto__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(19, 19, 18, 0), var(--ink)); }
.manifesto { isolation: isolate; }
.manifesto__title { --fs: 88.66; max-width: calc(902 * var(--u)); margin: calc(30 * var(--u)) auto calc(24 * var(--u)); color: #fff; }
.inline-ill { display: inline-block; width: calc(107 * var(--u)); vertical-align: middle; margin: calc(-40 * var(--u)) calc(8 * var(--u)) calc(-20 * var(--u)); position: relative; z-index: 2; }
.inline-ill--stamp { width: calc(100 * var(--u)); vertical-align: bottom; margin: calc(-60 * var(--u)) 0 calc(-10 * var(--u)) calc(-10 * var(--u)); }
.manifesto__sign { color: var(--orange); }
.manifesto__dot { position: absolute; left: calc(23 * var(--u)); bottom: calc(23 * var(--u)); width: calc(31 * var(--u)); aspect-ratio: 1; background: var(--paper); }

.transfer { padding: calc(48 * var(--u)) calc(160 * var(--u)) calc(150 * var(--u)); }
.transfer__intro { position: relative; z-index: 2; padding-left: calc(39 * var(--u)); max-width: calc(650 * var(--u)); }
.transfer__intro .rv { margin-bottom: calc(42 * var(--u)); }
.personas { isolation: isolate; position: relative; display: grid; grid-template-columns: repeat(3, calc(456 * var(--u))); gap: calc(45 * var(--u)); margin: calc(-30 * var(--u)) 0 0 calc(63 * var(--u)); align-items: start; }
.persona { position: relative; min-height: calc(445 * var(--u)); padding: calc(294 * var(--u)) calc(32 * var(--u)) calc(32 * var(--u)); background: var(--paper); border: 2px solid var(--ink-2); box-shadow: calc(20 * var(--u)) calc(16 * var(--u)) 0 var(--shadow); }
.persona--0 { margin-top: calc(240 * var(--u)); }
.persona--1 { margin-top: calc(160 * var(--u)); }
.persona--2 { margin-top: calc(80 * var(--u)); }
.persona__tag { position: absolute; z-index: 3; left: calc(-12 * var(--u)); top: calc(-90 * var(--u)); color: var(--orange); rotate: -9deg; }
.persona__ill { position: absolute; left: calc(20 * var(--u)); top: calc(-48 * var(--u)); width: calc(280 * var(--u)); }
.persona--0 .persona__ill { width: calc(222 * var(--u)); left: calc(32 * var(--u)); top: calc(-46 * var(--u)); }
.persona--1 .persona__ill { width: calc(302 * var(--u)); left: 0; top: calc(-58 * var(--u)); }
.persona--2 .persona__ill { width: calc(273 * var(--u)); left: calc(27 * var(--u)); top: calc(-44 * var(--u)); }
.persona__title { font-size: max(18px, calc(24 * var(--u))); letter-spacing: -.02em; margin-bottom: calc(24 * var(--u)); }
.persona__body { font-size: max(14px, calc(18 * var(--u))); color: var(--grey); max-width: calc(300 * var(--u)); }
.steps--persona-a { left: calc(-8 * var(--u)); bottom: calc(-40 * var(--u)); color: var(--paper-2); z-index: -1; } /* behind the card, not over its text */
.persona__title, .persona__body { position: relative; z-index: 2; }
.steps--persona-b { right: calc(-24 * var(--u)); top: calc(500 * var(--u)); z-index: 0; }

.fracture { padding: calc(40 * var(--u)) calc(120 * var(--u)) calc(120 * var(--u)); text-align: center; }
.fracture__label { color: var(--orange); }
.fracture__title { --fs: 141.7; max-width: calc(1290 * var(--u)); margin: calc(30 * var(--u)) auto 0; color: var(--ink); }
.fracture__ill { width: calc(1098 * var(--u)); margin: calc(-110 * var(--u)) auto 0; }

.install { padding: calc(80 * var(--u)) 0 calc(120 * var(--u)); }
.install__panel { position: relative; margin: 0 calc(96 * var(--u)) 0 calc(156 * var(--u)); min-height: calc(645 * var(--u)); padding: calc(75 * var(--u)) calc(64 * var(--u)); background: var(--ink); color: var(--paper); }
.install__copy { position: relative; z-index: 2; max-width: calc(560 * var(--u)); }
.install__copy .rv { --fs: 64; margin-bottom: calc(38 * var(--u)); }
.install__copy .lead { margin-bottom: calc(88 * var(--u)); }
.install__photo { position: absolute; right: calc(65 * var(--u)); top: calc(-81 * var(--u)); width: calc(857 * var(--u)); height: calc(545 * var(--u)); }
.install__tape-a { width: calc(225 * var(--u)); right: calc(775 * var(--u)); top: calc(-78 * var(--u)); rotate: -38deg; } /* across the photo's top-left corner */
.install__tape-b { width: calc(104 * var(--u)); right: calc(24 * var(--u)); top: calc(380 * var(--u)); z-index: 3; } /* over the photo's bottom-right corner */
.install__panel { isolation: isolate; background: none; }
.install__panel::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--ink); }
.steps--install, .steps--install-b { z-index: -2; }
.steps--install { right: calc(-21 * var(--u)); top: calc(-88 * var(--u)); transform: matrix(0, -1, -1, 0, 0, 0); }
.steps--install-b { right: calc(-28 * var(--u)); bottom: calc(-13 * var(--u)); transform: scaleY(-1); }
.stepcards { position: relative; display: grid; grid-template-columns: repeat(3, calc(456 * var(--u))); gap: calc(21 * var(--u)); margin: calc(48 * var(--u)) 0 0 calc(251 * var(--u)); }
.stepcard { position: relative; z-index: 1; min-height: calc(277 * var(--u)); padding: calc(28 * var(--u)) calc(36 * var(--u)) calc(36 * var(--u)); background: var(--paper); border: 2px solid var(--ink-2); box-shadow: calc(14 * var(--u)) calc(10 * var(--u)) 0 var(--shadow); }
.stepcard__meta { color: var(--orange); }
.stepcard__title { font-size: max(28px, calc(48 * var(--u))); margin: calc(20 * var(--u)) 0 calc(44 * var(--u)); max-width: calc(360 * var(--u)); }
.stepcard__body { font-size: max(14px, calc(18 * var(--u))); max-width: calc(347 * var(--u)); }
.stepcards__tape { width: calc(138 * var(--u)); left: calc(-149 * var(--u)); top: calc(-98 * var(--u)); }
.stepcards__mascot { position: absolute; z-index: 2; width: calc(309 * var(--u)); left: calc(1292 * var(--u)); top: calc(-16 * var(--u)); }

.pullquote { padding: calc(120 * var(--u)) 20px calc(150 * var(--u)); text-align: center; color: var(--orange); }
.pullquote .t { --kmin: .3px; }

.cost { margin: calc(40 * var(--u)) calc(160 * var(--u)) calc(260 * var(--u)) calc(159 * var(--u)); min-height: calc(645 * var(--u)); padding: calc(106 * var(--u)) 0 calc(80 * var(--u)) calc(61 * var(--u)); background: var(--orange); color: var(--paper); }
.cost__copy { max-width: calc(600 * var(--u)); }
.cost__copy .rv { max-width: calc(580 * var(--u)); margin-bottom: calc(40 * var(--u)); }
.cost__copy .lead { margin-bottom: calc(48 * var(--u)); }
.cost__panel { position: absolute; right: 0; top: calc(-34 * var(--u)); width: calc(813 * var(--u)); height: calc(861 * var(--u)); padding: calc(95 * var(--u)) calc(60 * var(--u)) 0; background: var(--shadow); color: var(--paper); text-align: center; }
.cost__panel-lead { max-width: calc(477 * var(--u)); margin: calc(32 * var(--u)) auto 0; font-size: max(14px, calc(18 * var(--u))); }
.chart { position: absolute; left: calc(48 * var(--u)); right: calc(48 * var(--u)); bottom: calc(30 * var(--u)); height: calc(560 * var(--u)); display: flex; gap: calc(38 * var(--u)); padding: 0 calc(10 * var(--u)); }
.chart__grid { position: absolute; inset: 0 0 calc(44 * var(--u)); display: flex; flex-direction: column; justify-content: space-between; }
.chart__grid i { height: 1px; background: rgba(242, 231, 219, .1); }
.chart__line { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.chart__line polyline { fill: none; stroke: #383838; stroke-width: 2.5; }
.chart__col { position: relative; flex: 1; }
.chart__bar { position: absolute; left: 0; right: 0; bottom: calc(44 * var(--u)); height: calc(var(--h) * var(--u)); background: var(--c); transform-origin: bottom; }
.chart__label { position: absolute; left: -20px; right: -20px; bottom: calc((var(--h) + 58) * var(--u)); font-size: max(12px, calc(18 * var(--u))); text-align: center; }
.chart__label b { display: block; }
.chart__label span { display: block; margin-top: 4px; font-size: max(10px, calc(14 * var(--u))); color: var(--mist); }
.chart__dot { --dw: max(10px, calc(20 * var(--u))); position: absolute; left: 50%; bottom: calc(var(--d) * var(--u)); width: var(--dw); height: var(--dw); margin: 0 0 calc(var(--dw) / -2) calc(var(--dw) / -2); border-radius: 50%; background: #383838; }
.chart__q { position: absolute; left: 0; right: 0; bottom: 0; font-size: max(13px, calc(18 * var(--u))); }

.finance { min-height: calc(760 * var(--u)); padding: 0 calc(160 * var(--u)) 0 calc(943 * var(--u)); }
.finance__photo { position: absolute; left: calc(52 * var(--u)); top: 0; width: calc(740 * var(--u)); height: calc(685 * var(--u)); }
.finance__copy .rv { margin-bottom: calc(26 * var(--u)); max-width: calc(660 * var(--u)); }
.finance__copy .lead { max-width: calc(585 * var(--u)); margin-bottom: calc(36 * var(--u)); }
.stepcards--finance { margin: calc(36 * var(--u)) 0 0 calc(-692 * var(--u)); }
.stepcards__paper { position: absolute; z-index: 2; width: calc(181 * var(--u)); left: calc(1322 * var(--u)); bottom: calc(-47 * var(--u)); }

.logowall { margin-top: calc(60 * var(--u)); padding: calc(109 * var(--u)) calc(160 * var(--u)) calc(150 * var(--u)); background: var(--ink); color: var(--paper); text-align: center; }
.logowall__ill { width: calc(150 * var(--u)); margin: calc(-63 * var(--u)) auto calc(-32 * var(--u)); z-index: 2; }
.logowall__title { --fs: 70.14; }
.tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: calc(19 * var(--u)); margin-top: calc(87 * var(--u)); padding-bottom: calc(50 * var(--u)); }
.tile {
	position: relative; aspect-ratio: 1; padding: 0; border: 0; background: var(--tile); cursor: pointer; overflow: hidden; color: inherit;
	transition: transform .5s var(--ease), background-color .35s, box-shadow .5s var(--ease);
}
.tile:nth-child(6n+2), .tile:nth-child(6n+4), .tile:nth-child(6n+6) { translate: 0 calc(50 * var(--u)); }
.tile img { position: relative; width: 100%; height: 100%; }
.tile__photo { position: absolute; inset: 0; background: center / cover; opacity: 0; transition: opacity .4s; }
.tile:hover, .tile.is-on { z-index: 2; transform: translateY(-10px) rotate(var(--tilt)) scale(1.13); background: var(--orange); box-shadow: 0 18px 40px rgba(255, 60, 0, .35); }
.tile:hover .tile__photo, .tile.is-on .tile__photo { opacity: .25; }
.tile--dup { display: none; }

.programs { padding: calc(130 * var(--u)) calc(160 * var(--u)) calc(260 * var(--u)); text-align: center; }
.programs__label { margin-left: auto; margin-right: auto; }
.programs .cta-row { position: relative; z-index: 3; }
/* Orange band that arcs up in the middle and ends flat: an orange ellipse cut off by a paper strip */
.programs { overflow: clip; }
.programs::before, .programs::after { content: ''; position: absolute; left: -40%; right: -40%; top: calc(910 * var(--u)); height: calc(1180 * var(--u)); border-radius: 50%; background: var(--orange); }
.programs::after { top: auto; left: 0; right: 0; bottom: 0; height: calc(80 * var(--u)); border-radius: 0; background: var(--paper); }
.programs__title { max-width: calc(800 * var(--u)); margin: 0 auto calc(42 * var(--u)); --fs: 70.14; }
.programs__lead { max-width: max(320px, calc(529 * var(--u))); margin: 0 auto; color: var(--grey); }
.progs { position: relative; z-index: 2; display: flex; justify-content: center; align-items: flex-start; gap: calc(13 * var(--u)); margin-top: calc(245 * var(--u)); text-align: left; }
.progs__fire { position: absolute; z-index: -1; left: 50%; top: calc(-199 * var(--u)); width: calc(290 * var(--u)); translate: -50% 0; margin-left: calc(-42 * var(--u)); transform-origin: 50% 100%; rotate: 30deg; } /* tilt as in Figma. No !important: GSAP folds translate/rotate into its transform, and forcing them again doubled both */
.prog { position: relative; width: calc(367 * var(--u)); min-width: 250px; min-height: calc(511 * var(--u)); margin-top: calc(49 * var(--u)); padding: calc(33 * var(--u)) calc(36 * var(--u)) calc(36 * var(--u)); background: var(--paper); border: 2px solid var(--ink-2); box-shadow: calc(16 * var(--u)) calc(18 * var(--u)) 0 var(--shadow); color: var(--ink-2); }
.prog--featured { width: calc(390 * var(--u)); min-height: calc(543 * var(--u)); margin-top: 0; padding-top: calc(52 * var(--u)); background: var(--tile); border-color: var(--orange); box-shadow: calc(17 * var(--u)) calc(19 * var(--u)) 0 var(--orange); color: var(--paper); }
.prog__meta { color: var(--orange); }
.prog__title { font-family: var(--judge-c); font-weight: 700; font-size: max(28px, calc(42 * var(--u))); line-height: .88; text-transform: uppercase; letter-spacing: 0; margin: calc(14 * var(--u)) 0 calc(28 * var(--u)); }
.prog__kicker { font-size: max(13px, calc(14 * var(--u))); font-weight: 700; margin-bottom: calc(10 * var(--u)); }
.prog__kicker--rule { margin-top: calc(24 * var(--u)); padding-top: calc(24 * var(--u)); border-top: 1px solid var(--rule); }
.prog--featured .prog__kicker--rule { border-color: rgba(242, 231, 219, .5); }
.prog__body, .prog__list { font-size: max(13px, calc(14 * var(--u))); color: var(--grey); }
.prog--featured .prog__body { color: #c0bdba; }
.prog--featured .prog__list { color: var(--paper); }
.prog__list { list-style: none; margin: 0 0 calc(36 * var(--u)); padding: 0; }
.prog__list li { position: relative; padding-left: calc(11 * var(--u) + 6px); margin-bottom: calc(18 * var(--u)); }
.prog__list li::before { content: ''; position: absolute; left: 0; top: .3em; width: 5px; height: 5px; background: var(--orange-deep); }
.prog__ctas.wp-block-buttons { justify-content: space-between; flex-wrap: nowrap; gap: 12px; }
.prog .tlink > a { color: var(--ink-2); }
.prog--featured .tlink > a { color: var(--orange); }
.prog--featured .tlink--pdf > a { color: #fff; }

.proof { padding: calc(60 * var(--u)) calc(160 * var(--u)) calc(256 * var(--u)); }
.proof__head { position: relative; display: inline-block; margin-bottom: calc(47 * var(--u)); }
.proof__head .rv { --fs: 70.14; color: var(--ink-2); }
.proof__bubble { position: absolute; width: calc(100 * var(--u)); right: calc(-18 * var(--u)); top: calc(-66 * var(--u)); }
.proof__grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--hair); }
.quote { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; min-height: calc(386 * var(--u)); padding: calc(46 * var(--u)) calc(44 * var(--u)) calc(30 * var(--u)); border: 1px solid var(--hair); }
.quote--lead { grid-column: span 2; background: var(--orange); border-color: var(--orange); color: var(--paper); }
.quote__text { font-size: max(18px, calc(28 * var(--u))); font-weight: 700; color: #1a1a1a; }
.quote--lead .quote__text { font-size: max(26px, calc(44.4 * var(--u))); line-height: 1.02; color: var(--paper); max-width: calc(835 * var(--u)); }
.quote__who { font-size: max(12px, calc(14 * var(--u))); color: var(--grey); line-height: 1.3; }
.quote__who strong { font-size: max(17px, calc(24 * var(--u))); color: #1a1a1a; }
.quote--lead .quote__who, .quote--lead .quote__who strong { color: var(--paper); }

.team { min-height: calc(827 * var(--u)); padding: calc(118 * var(--u)) calc(160 * var(--u)) calc(100 * var(--u)) calc(211 * var(--u)); background: var(--ink); color: var(--paper); }
.team__bg { position: absolute; inset: 0; }
.team__bg::after { content: ''; position: absolute; inset: 0; background: rgba(19, 19, 18, .55); }
.team__copy { position: relative; z-index: 2; max-width: calc(480 * var(--u)); }
.team__copy .rv { color: var(--paper); margin-bottom: calc(52 * var(--u)); }
.team__copy .lead { color: #efefef; max-width: max(300px, calc(360 * var(--u))); }
.team__copy .cta-row { margin-top: calc(60 * var(--u)); flex-wrap: nowrap; }
.team .steps--tr { right: 0; top: 0; --sw: 260; }
.team .steps--bl { left: 0; bottom: 0; --sw: 260; }
.team__people { position: absolute; z-index: 2; left: calc(780 * var(--u)); top: calc(40 * var(--u)); display: flex; gap: calc(-40 * var(--u)); }
.person { width: calc(461 * var(--u)); }
.person + .person { margin-left: calc(-40 * var(--u)); }
.person--dan .polaroid { rotate: -4deg; }
.person--jason .polaroid { rotate: 3deg; }
.polaroid { position: relative; margin: 0 0 calc(-24 * var(--u)); aspect-ratio: 461 / 576; }
.polaroid__frame { position: absolute; inset: 0; width: 100%; height: 100%; }
.polaroid__photo { position: absolute; left: 11.3%; top: 11.6%; width: 74%; height: 62%; object-fit: cover; filter: grayscale(1); }
.polaroid__tape { width: 34%; left: 33%; top: 2%; } /* bottom edge overlaps the photo */
.person--dan .polaroid__tape { width: 18%; left: 41%; top: 3%; }
.polaroid figcaption { position: absolute; left: 0; right: 0; top: 77%; text-align: center; color: var(--ink-2); }
.person__role { font-size: max(13px, calc(16 * var(--u))); margin: 0 calc(130 * var(--u)) calc(16 * var(--u)) calc(130 * var(--u)); color: #efefef; }
.person__bio { font-size: max(13px, calc(18 * var(--u))); margin: 0 calc(80 * var(--u)) 0 calc(130 * var(--u)); color: #efefef; }

/* ---------- Why Us ---------- */
[data-time] { position: absolute; top: 0; left: 0; width: 1px; height: 1px; }
.ghost { position: absolute; top: 0; z-index: 0; color: rgba(197, 197, 197, .22); pointer-events: none; }
.ghost .t { --kmin: 0px; }
.ghost--r { right: calc(-160 * var(--u)); }
.ghost--low { top: calc(540 * var(--u)); }
.ghost--c { left: 50%; translate: -50% 0; top: calc(60 * var(--u)); color: rgba(197, 197, 197, .08); }
.timecode { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: calc(12 * var(--u)); color: var(--orange); margin-bottom: calc(30 * var(--u)); }
.seat, .halffix, .both, .receipts { padding: calc(111 * var(--u)) calc(160 * var(--u)) calc(140 * var(--u)) calc(224 * var(--u)); }
.seat__head { position: relative; display: inline-block; z-index: 1; }
.seat__chair { position: absolute; width: calc(118 * var(--u)); }
.seat__chair--a { left: calc(374 * var(--u)); top: calc(-108 * var(--u)); } /* spaced as in Jack's design screenshot (2026-11-02) */
.seat__chair--a img { scale: -1 1; } /* mirrored so the chairs face each other. No !important: GSAP folds it into its transform, and forcing it again cancelled the flip */
.seat__chair--b { left: calc(593 * var(--u)); top: calc(-19 * var(--u)); }
.seat .lead { margin-top: calc(37 * var(--u)); position: relative; }
.seat__photo { position: relative; height: calc(650 * var(--u)); margin: calc(69 * var(--u)) 0 0 calc(-64 * var(--u)); }
.steps--seat { right: calc(148 * var(--u)); bottom: calc(131 * var(--u)); --sw: 111; }
.halffix { padding-left: calc(160 * var(--u)); text-align: center; }
.halffix .timecode { justify-content: center; }
.halffix__title { --fs: 120; max-width: calc(1100 * var(--u)); margin: 0 auto; }
.halffix__cols { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, calc(360 * var(--u))); justify-content: center; gap: calc(90 * var(--u)); margin-top: calc(110 * var(--u)); }
/* same-height tags and drawings, so the titles below share a baseline; the drawing sits over the tag */
.halffix__tag { position: relative; z-index: 1; max-width: none; color: var(--orange); }
.halffix__col .ill { z-index: 2; height: calc(250 * var(--u)); margin: calc(-28 * var(--u)) auto 0; mix-blend-mode: multiply; } /* the tag reads through the drawing */
.halffix__col .ill img { width: auto; height: 100%; margin: 0 auto; }
.halffix__name { font-size: max(18px, calc(24 * var(--u))); margin: calc(57 * var(--u)) 0 calc(24 * var(--u)); }
.halffix__body { font-size: max(14px, calc(18 * var(--u))); color: var(--grey); max-width: calc(275 * var(--u)); margin: 0 auto; }
.halffix .pullquote { padding-bottom: 0; }

.op { display: grid; grid-template-columns: calc(618 * var(--u)) calc(706 * var(--u)); justify-content: space-between; align-items: center; padding: calc(60 * var(--u)) calc(160 * var(--u)) calc(60 * var(--u)) calc(345 * var(--u)); }
.op__name { --fs: 120; margin-bottom: calc(32 * var(--u)); }
.op__role { color: #717171; margin-bottom: calc(40 * var(--u)); }
.op__clients { display: block; box-sizing: content-box; width: auto; height: max(24px, calc(35 * var(--u))); max-width: 100%; margin: calc(-14 * var(--u)) 0 calc(40 * var(--u)); padding-top: calc(20 * var(--u)); border-top: 1px solid #80786b; padding-right: calc(250 * var(--u)); }
.op--jason .op__clients { height: max(20px, calc(29 * var(--u))); padding-right: calc(177 * var(--u)); }
.op__sub { color: #717171; margin-top: calc(40 * var(--u)); padding-bottom: calc(12 * var(--u)); border-bottom: 1px solid var(--hair); width: calc(540 * var(--u)); max-width: 100%; }
.op__sub.t { display: block; margin: calc(40 * var(--u)) 0 0; }
.opgrid { display: grid; grid-template-columns: repeat(2, 1fr); max-width: max(320px, calc(491 * var(--u))); margin: calc(18 * var(--u)) 0 calc(42 * var(--u)); border: 1px solid var(--rule); }
.opgrid > div { padding: calc(12 * var(--u)); border: 1px solid var(--rule); }
.opgrid dt { font-size: max(10px, calc(12 * var(--u))); font-weight: 700; text-transform: uppercase; color: var(--orange); margin-bottom: 8px; }
.opgrid dd { margin: 0; font-size: max(11px, calc(12.5 * var(--u))); line-height: 1.35; color: #717171; }
.op__sign { color: var(--orange); }
.op__photo { margin: 0; }
.op__photo img { -webkit-mask-image: linear-gradient(#000 62%, transparent 97%); mask-image: linear-gradient(#000 62%, transparent 97%); }
.op--jason { grid-template-columns: calc(649 * var(--u)) calc(560 * var(--u)); padding: calc(70 * var(--u)) calc(300 * var(--u)) calc(90 * var(--u)) calc(251 * var(--u)); background: var(--ink); color: var(--paper); }
.op--jason .op__sub { color: var(--paper); }
.op--jason .opgrid, .op--jason .opgrid > div { border-color: rgba(242, 231, 219, .6); }
.op--jason .opgrid dd { color: var(--paper); }
.chips { display: flex; flex-wrap: wrap; gap: calc(6 * var(--u)) 6px; list-style: none; padding: 0; margin: 0 0 calc(40 * var(--u)); color: #fff; }
.chips li { display: inline-flex; padding: 9px 14px; border: 2px solid var(--orange); border-radius: 99px; background: rgba(255, 60, 0, .12); }

.stay { min-height: calc(968 * var(--u)); padding: calc(179 * var(--u)) calc(160 * var(--u)) calc(120 * var(--u)) calc(170 * var(--u)); color: var(--paper); background: var(--ink); }
.stay__bg { position: absolute; inset: 0; }
.stay__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(19, 19, 18, .45), rgba(19, 19, 18, 0) 65%); }
.stay__title { position: relative; --fs: 120; max-width: calc(900 * var(--u)); margin-bottom: calc(45 * var(--u)); }
.stay .lead { position: relative; max-width: max(320px, calc(484 * var(--u))); margin-bottom: 1em; }

.both__title { position: relative; --fs: 120; max-width: calc(1010 * var(--u)); }
.phases { position: relative; margin-top: calc(107 * var(--u)); border-bottom: 1px solid var(--rule); }
.phase { display: grid; grid-template-columns: calc(489 * var(--u)) calc(524 * var(--u)) 1fr; grid-template-rows: auto auto auto; column-gap: 0; padding: 20px 0 calc(24 * var(--u)); border-top: 1px solid var(--rule); }
.phase__name { grid-column: 1; grid-row: 1; color: var(--orange); }
.phase__title { grid-column: 1; grid-row: 2 / 4; font-size: max(30px, calc(64 * var(--u))); color: var(--ink); margin-top: 6px; }
.phase__col { grid-column: 2; grid-row: 1; color: var(--orange); }
.phase__col--b { grid-column: 3; }
.phase__text { grid-row: 2; margin-top: 14px; font-size: max(13px, calc(16 * var(--u))); line-height: 1.4; color: #6a6459; max-width: calc(463 * var(--u)); }
.phase__text--dan { grid-column: 2; }
.phase__text--jason { grid-column: 3; }

.belief { min-height: calc(784 * var(--u)); margin-top: calc(120 * var(--u)); padding: calc(165 * var(--u)) calc(160 * var(--u)) calc(100 * var(--u)) calc(224 * var(--u)); background: var(--ink); color: var(--paper); }
.belief__title { position: relative; z-index: 2; max-width: calc(1000 * var(--u)); margin-bottom: calc(60 * var(--u)); }
.belief .lead { position: relative; z-index: 2; }
.belief__photo { position: absolute !important; right: calc(160 * var(--u)); top: calc(70 * var(--u)); width: calc(868 * var(--u)); aspect-ratio: 1; z-index: 1; }
.steps--photo-tr { right: calc(14 * var(--u)); top: 0; --sw: 140; transform: none; }
.steps--photo-br { right: calc(14 * var(--u)); bottom: calc(14 * var(--u)); --sw: 111; }
.receipts { padding-top: calc(230 * var(--u)); padding-left: calc(195 * var(--u)); }
.receipts__row { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); justify-content: start; column-gap: calc(70 * var(--u)); margin-top: calc(85 * var(--u)); }
.receipts b { display: block; font-size: max(56px, calc(136 * var(--u))); margin-bottom: calc(26 * var(--u)); }
.receipts .t { color: var(--orange); }
.receipts__label { display: block; font: 400 max(14px, calc(25 * var(--u)))/1.1 var(--mono); letter-spacing: 0; text-transform: uppercase; color: var(--orange); } /* editable text labels (KH Interference webfont), same look as the outlined ones */

.verdicts { padding: calc(50 * var(--u)) calc(280 * var(--u)) calc(160 * var(--u)); background: var(--ink); color: var(--paper); text-align: center; }
.verdicts__time { color: var(--paper); }
.verdicts__title { display: block; margin: calc(16 * var(--u)) auto calc(40 * var(--u)); color: var(--orange); }
.verdicts__lead { padding: calc(40 * var(--u)) calc(40 * var(--u)) calc(50 * var(--u)); background: var(--orange); text-align: left; }
.verdicts__quote { font-size: max(32px, calc(64 * var(--u))); margin-bottom: calc(50 * var(--u)); }
.verdicts__lead .quote__who, .verdicts__lead .quote__who strong { color: var(--paper); }
.verdicts__lead .quote__who { color: #ffcccc; }
.verdicts__grid { display: grid; grid-template-columns: 1fr 1fr; gap: calc(60 * var(--u)) calc(100 * var(--u)); margin-top: calc(50 * var(--u)); text-align: left; }
.verdict:nth-child(-n+2) { padding-bottom: calc(40 * var(--u)); border-bottom: 2px solid rgba(242, 231, 219, .5); }
.verdict .quote__text { color: var(--paper); margin-bottom: calc(40 * var(--u)); }
.verdict .quote__who strong { color: var(--paper); }

.finale { min-height: calc(826 * var(--u)); padding: calc(200 * var(--u)) 20px calc(220 * var(--u)); background: var(--ink); color: var(--paper); text-align: center; }
.finale .timecode { justify-content: center; }
.finale .rv { position: relative; max-width: calc(560 * var(--u)); margin: 0 auto calc(50 * var(--u)); }
/* Session scrubber (from the prototype): fixed to the bottom of the viewport while the timeline runs */
.scrub { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; height: 132px; pointer-events: none; color: var(--paper); opacity: 0; transition: opacity .5s var(--ease); background: linear-gradient(0deg, #0b0908 0%, #0b0908 26%, rgba(11, 9, 8, .82) 52%, rgba(11, 9, 8, .34) 78%, transparent 100%); }
.scrub.is-on { opacity: 1; }
.scrub__cap { position: absolute; left: clamp(16px, 3vw, 44px); bottom: 22px; font: 9px/1.5 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: rgba(242, 231, 219, .55); }
.scrub__time { position: absolute; left: 50%; bottom: 78px; translate: -50% 0; font: 700 28px/1 var(--judge); letter-spacing: 1px; color: var(--orange); }
.scrub__window { position: absolute; left: 0; right: 0; bottom: 18px; height: 54px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent 4%, #000 16%, #000 84%, transparent 96%); mask-image: linear-gradient(90deg, transparent 4%, #000 16%, #000 84%, transparent 96%); }
.scrub__ruler { position: absolute; inset: 0; }
.scrub__tick { position: absolute; left: 0; bottom: 0; width: 2px; height: 17px; border-radius: 1px; background: rgba(242, 231, 219, .34); transform-origin: bottom center; }
.scrub__tick.is-major { height: 34px; }
.scrub__tick.is-on { background: var(--orange); }
.scrub__caret { position: absolute; left: 50%; bottom: 12px; translate: -50% 0; border: 6px solid transparent; border-top: 0; border-bottom: 9px solid var(--paper); }
.scrub__caret::before { content: ''; position: absolute; left: -1px; bottom: 0; width: 2px; height: 42px; background: linear-gradient(0deg, var(--paper), transparent); opacity: .6; }
.finale .lead { position: relative; max-width: max(320px, calc(419 * var(--u))); margin: 0 auto; }
.finale .steps--bl { left: 0; bottom: 0; --sw: 260; }


/* ---------- How We Help ---------- */
.hero--paper { background: transparent; color: var(--ink); min-height: max(640px, calc(1080 * var(--u))); overflow: visible; z-index: 2; }
.hero__inner--help { padding-top: max(150px, calc(202 * var(--u))); }
.hero__inner--help .hero__eyebrow { color: var(--orange); }
.help__title { --fs: 124; max-width: calc(980 * var(--u)) !important; }
.hero--paper .lead { margin-top: calc(80 * var(--u)) !important; }
/* absolute with no offsets = sits where the text ends, without changing how the headline wraps */
.help__title { position: relative; }
.inline-ill.help__knight { position: absolute; width: calc(107 * var(--u)); margin: calc(-20 * var(--u)) 0 0 calc(14 * var(--u)); }
.help__knight::before { content: ''; position: absolute; left: calc(-34 * var(--u)); top: calc(2 * var(--u)); width: calc(178 * var(--u)); aspect-ratio: 1; border-radius: 50%; background: rgba(0, 0, 0, .25); filter: blur(calc(45 * var(--u))); }
.help__knight img { position: relative; }
.help__photo { position: absolute; right: calc(160 * var(--u)); top: calc(399 * var(--u)); width: calc(919 * var(--u)); height: calc(657 * var(--u)); z-index: 1; }
.help__queen { position: absolute; z-index: 3; width: calc(295 * var(--u)); left: calc(1505 * var(--u)); top: calc(745 * var(--u)); }

.band { min-height: calc(757 * var(--u)); padding: calc(243 * var(--u)) calc(160 * var(--u)) calc(100 * var(--u)) calc(175 * var(--u)); background: var(--ink); color: var(--paper); }
.band__bg { position: absolute; inset: 0; }
.band__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(19, 19, 18, .45), rgba(19, 19, 18, 0) 60%); }
.band__copy { position: relative; z-index: 1; max-width: calc(760 * var(--u)); }
.band__copy .rv { margin-bottom: calc(38 * var(--u)); }
.band .steps--br { right: calc(-10 * var(--u)); bottom: 0; --sw: 111; }

.msteps { padding: calc(100 * var(--u)) 0 calc(120 * var(--u)); }
.mstep { position: relative; display: grid; grid-template-columns: calc(395 * var(--u)) calc(667 * var(--u)) 1fr; align-items: start; min-height: calc(600 * var(--u)); padding: 0 calc(52 * var(--u)); }
.mstep__body .rv { margin-bottom: calc(48 * var(--u)); max-width: calc(760 * var(--u)); }
.mstep__body .h-m { --fs: 54; }
.stepnum__note { font-size: max(12px, calc(14 * var(--u))); color: #919191; max-width: calc(213 * var(--u)); margin-bottom: calc(30 * var(--u)); }
.stepnum__n { display: flex; align-items: flex-start; gap: 3px; color: #919191; }
.stepnum__n b { font-size: max(24px, calc(36 * var(--u))); color: var(--orange); }
.stepnum__n span { font-size: max(10px, calc(14.6 * var(--u))); margin-top: .2em; }
.stepnum__n small { font-size: max(14px, calc(22 * var(--u))); }
.subs { display: flex; gap: calc(65 * var(--u)); margin-top: calc(120 * var(--u)); }
.sub__title { font-size: max(15px, calc(18 * var(--u))); margin-bottom: calc(18 * var(--u)); color: #000; }
.ill--shape { width: calc(460 * var(--u)); margin-left: calc(50 * var(--u)); }
.ill--shape img { position: relative; }
.ill__shape { position: absolute; background: var(--orange); }
.ill--circle .ill__shape { left: 16.9%; top: 50%; width: 66.2%; margin-top: -33.1%; aspect-ratio: 1; border-radius: 50%; } /* centred on the drawing, as in Figma (margin % is of the width) */
.ill--square .ill__shape { left: 18%; top: -8%; width: 70%; aspect-ratio: 1; }
.msteps__field { width: calc(849 * var(--u)); height: calc(321 * var(--u)); margin: calc(-40 * var(--u)) 0 calc(160 * var(--u)) calc(52 * var(--u)); }

.leave { padding: calc(110 * var(--u)) 0 calc(100 * var(--u)); background: var(--ink); color: var(--paper); }
.mstep--dark .rv { color: var(--paper); }
.leave__title { --fs: 153; white-space: nowrap; }
.mstep--dark .body { color: #fff; margin-left: calc(18 * var(--u)); }
.leave__keys { position: absolute; z-index: 2; width: calc(517 * var(--u)); left: calc(1083 * var(--u)); top: calc(-110 * var(--u)); }
.mstep--after { min-height: calc(300 * var(--u)); margin-top: calc(60 * var(--u)); }
.leave__photo { position: absolute; right: calc(25 * var(--u)); top: calc(-60 * var(--u)); width: calc(528 * var(--u)); aspect-ratio: 1; }
.leave__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(19, 19, 18, .9), rgba(19, 19, 18, .1)); }
.benefits { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, calc(310 * var(--u))); gap: calc(36 * var(--u)); padding-left: calc(355 * var(--u)); margin-top: calc(-40 * var(--u)); }
.benefit__icon { width: max(28px, calc(36 * var(--u))); margin-bottom: calc(22 * var(--u)); color: var(--mist); }
.benefit__title { font-size: max(22px, calc(38 * var(--u))); margin-bottom: calc(36 * var(--u)); }
.benefit__body { font-size: max(14px, calc(18 * var(--u))); color: #b9b9b9; }
.leave__cta { padding-left: calc(355 * var(--u)); margin-top: calc(90 * var(--u)); }

.smaller { display: grid; grid-template-columns: calc(742 * var(--u)) 1fr; padding: calc(120 * var(--u)) 0 calc(150 * var(--u)) calc(160 * var(--u)); }
.smaller__copy .rv { max-width: calc(620 * var(--u)); margin-bottom: calc(80 * var(--u)); }
.pill { --pu: var(--u); position: relative; display: inline-block; width: calc(187 * var(--pu)); height: calc(67 * var(--pu)); margin-right: calc(14 * var(--pu)); vertical-align: -0.1em; background: var(--orange); border-radius: 99px; }
/* Pieces rise out of the pill and are cut off at its rounded bottom, as in the Figma mask */
.pill__clip { position: absolute; left: calc(16 * var(--pu)); top: calc(-32 * var(--pu)); width: calc(187 * var(--pu)); height: calc(99 * var(--pu)); border-radius: 99px; overflow: hidden; }
.pill__clip img { position: absolute; }
.pill__rook { left: calc(11 * var(--pu)); top: calc(20 * var(--pu)); width: calc(83 * var(--pu)); }
.pill__bishop { left: calc(128 * var(--pu)); top: calc(2 * var(--pu)); width: calc(85 * var(--pu)); transform: rotate(43deg); transform-origin: 0 0; }
.assets { align-items: stretch; display: flex; gap: calc(33 * var(--u)); overflow-x: auto; padding: 0 calc(160 * var(--u)) 30px 0; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.assets.is-scrolling { scrollbar-color: rgba(19, 19, 18, .45) transparent; }
.assets.is-dragging { scroll-snap-type: none; user-select: none; }
.assets::-webkit-scrollbar { height: 6px; }
.assets::-webkit-scrollbar-thumb { border-radius: 3px; background: transparent; }
.assets.is-scrolling::-webkit-scrollbar-thumb { background: rgba(19, 19, 18, .45); }
.prog--asset { flex: none; margin-top: calc(10 * var(--u)); min-height: calc(410 * var(--u)); border-width: 3px; box-shadow: calc(14 * var(--u)) calc(14 * var(--u)) 0 var(--shadow); scroll-snap-align: start; }
.prog--asset .prog__list { margin-top: calc(60 * var(--u)); min-height: calc(130 * var(--u)); }
/* equal-height cards with the button pinned to the bottom, so all three share a baseline */
.prog--asset { display: flex; flex-direction: column; }
.prog--asset .prog__ctas { margin-top: auto; }

.cta { padding: calc(110 * var(--u)) 20px calc(130 * var(--u)); background: var(--orange); color: var(--paper); text-align: center; }
.cta__label { margin-bottom: calc(30 * var(--u)); }
.cta .rv { --fs: 124; margin-bottom: calc(40 * var(--u)); }
.cta .lead { margin: 0 auto; }
.cta .tlink > a { color: var(--paper); }

/* ---------- Our Talent ---------- */
.hero--talent { min-height: max(620px, calc(1000 * var(--u))); text-align: center; }
.hero__inner--talent { padding-top: max(150px, calc(270 * var(--u))); }
.hero__inner--talent .hero__eyebrow { color: var(--orange); }
.hero__inner.hero__inner--talent .rv.talent__title { --fs: 108; max-width: calc(1600 * var(--u)); margin: calc(36 * var(--u)) auto 0; line-height: 1.04; }
.inline-ill.talent__faces { width: calc(265 * var(--u)); margin: 0 .1em; vertical-align: -.06em; }
.hero--talent .cta-row { margin-top: calc(90 * var(--u)); }

/* People list. Each person is editable blocks (front: name, role, sub, leads; panel: photo, quote, details, button);
   site.js adds .is-ready, the toggle and the meta lines, and runs the flip. Without .is-ready (the editor) it all stacks. */
.talent { padding: calc(146 * var(--u)) calc(160 * var(--u)) calc(218 * var(--u)); }
.talent__labels { display: none; }
.is-ready .talent__labels { display: block; position: relative; height: 0; }
.is-ready .talent__labels span { position: absolute; top: calc(-31 * var(--u)); font-size: max(12px, calc(18 * var(--u))); letter-spacing: .13em; text-transform: uppercase; color: #5f5f5f; }
.is-ready .talent__labels span:nth-child(1) { left: calc(2 * var(--u)); }
.is-ready .talent__labels span:nth-child(2) { left: calc(527 * var(--u)); }
.is-ready .talent__labels span:nth-child(3) { left: calc(940 * var(--u)); }

.is-ready .talent__item { position: relative; height: calc(200 * var(--u)); border-top: 1px solid #bcbcbc; perspective: 2600px; perspective-origin: 50% calc(100 * var(--u)); transition: height .8s cubic-bezier(.7, 0, .2, 1); }
.is-ready .talent__item:last-child { border-bottom: 1px solid #bcbcbc; }
.is-ready .talent__item.is-open { z-index: 2; transition-delay: .12s; border-color: transparent; }
.is-ready .talent__front { position: absolute; left: 0; right: 0; top: -1px; height: calc(200 * var(--u)); transform-origin: 50% calc(100 * var(--u)); backface-visibility: hidden; transition: transform .34s cubic-bezier(.5, 0, .75, 0) .3s; }
.is-ready .is-open .talent__front { transform: rotateX(90deg); transition-delay: 0s; }
.is-ready .talent__name { position: absolute; left: 0; top: calc(64 * var(--u)); margin: 0; font: 700 max(40px, calc(94 * var(--u)))/1.09 var(--judge); letter-spacing: -.02em; text-transform: uppercase; white-space: nowrap; color: var(--ink); transition: color .2s; }
.is-ready .talent__role { position: absolute; left: calc(527 * var(--u)); top: calc(82 * var(--u)); font-size: max(12px, calc(18 * var(--u))); font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: #000; white-space: nowrap; }
.is-ready .talent__sub { position: absolute; left: calc(527 * var(--u)); top: calc(105 * var(--u)); font-size: max(12px, calc(18 * var(--u))); color: #6f6f6f; white-space: nowrap; }
.is-ready .talent__leads { position: absolute; left: calc(925 * var(--u)); top: calc(72 * var(--u)); display: flex; gap: calc(10 * var(--u)); margin: 0; padding: 0; list-style: none; }
.is-ready .talent__leads li { display: flex; align-items: center; height: max(28px, calc(41 * var(--u))); padding: 0 calc(16 * var(--u)); border-radius: 72px; background: var(--orange); color: #fff; font-size: max(11px, calc(18 * var(--u))); font-weight: 700; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; transition: background-color .2s, box-shadow .2s, color .2s; }
.talent__toggle { all: unset; position: absolute; inset: 0; cursor: pointer; }
.talent__toggle:focus-visible { outline: 2px solid var(--orange); outline-offset: -2px; }
.talent__pm, .talent__x { position: absolute; display: grid; place-items: center; width: max(36px, calc(45 * var(--u))); aspect-ratio: 1; border-radius: 50%; font: 400 max(28px, calc(37 * var(--u)))/1 var(--radio); }
.talent__pm { left: calc(1528 * var(--u)); top: calc(72 * var(--u)); box-shadow: inset 0 0 0 1px #7a7a7a; color: #424242; }
.talent__pm span, .talent__x span { translate: 0 -1px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* hover: the name goes outline, the other rows' chips go quiet, a polaroid follows the pointer */
.talent.is-hovering .is-hov .talent__name { color: var(--paper); -webkit-text-stroke: 2px var(--orange); paint-order: stroke fill; }
.talent.is-hovering .talent__item:not(.is-hov) .talent__leads li { background: transparent; box-shadow: inset 0 0 0 1px #3a3a3a; color: #3a3a3a; }
.talent-follow { position: fixed; left: 0; top: 0; z-index: 60; width: calc(180 * var(--u)); aspect-ratio: 461 / 576; margin: calc(-120 * var(--u)) 0 0 calc(-101 * var(--u)); pointer-events: none; opacity: 0; transition: opacity .18s; }
.talent-follow.is-on { opacity: 1; }
.talent-follow__in { position: absolute; inset: 0; transform-origin: 36% 55%; filter: drop-shadow(0 20px 12px rgba(0, 0, 0, .3)); background: url(../img/polaroid.webp) center / 100% 100% no-repeat; }
.talent-follow__in img { position: absolute; left: 11.3%; top: 11.6%; width: 74%; height: 62%; object-fit: cover; filter: grayscale(1); }

/* open card */
.is-ready .talent__panel { position: absolute; left: 0; right: 0; top: 0; display: flex; background: #161616; color: #f7efe5; transform-origin: 50% calc(99 * var(--u)); transform: rotateX(-90deg); visibility: hidden; backface-visibility: hidden; transition: transform .34s cubic-bezier(.5, 0, .75, 0), visibility 0s .34s; }
.is-ready .is-open .talent__panel { transform: none; visibility: visible; transition: transform .75s cubic-bezier(.15, .85, .25, 1) .3s, visibility 0s .3s; }
.is-ready .talent__photo { position: relative; flex: none; width: calc(440 * var(--u)); margin: 0; overflow: hidden; }
.is-ready .talent__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.talent__cap { display: none; }
.is-ready .talent__content { flex: 1; padding: calc(56 * var(--u)) calc(160 * var(--u)) calc(60 * var(--u)) calc(72 * var(--u)); }
.talent__meta { display: flex; gap: calc(28 * var(--u)); font: 400 max(11px, calc(15 * var(--u)))/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: rgba(247, 239, 229, .45); }
.talent__meta span + span { color: var(--orange); }
.is-ready .talent__quote { max-width: calc(760 * var(--u)); margin-top: calc(38 * var(--u)); font: 700 max(30px, calc(68 * var(--u)))/.98 var(--judge); text-transform: uppercase; color: #f7efe5; }
.is-ready .talent__quote.is-long { font-size: max(26px, calc(52 * var(--u))); }
.is-ready .talent__quote::before, .is-ready .talent__quote::after { color: var(--orange); }
.is-ready .talent__quote::before { content: '“'; }
.is-ready .talent__quote::after { content: '”'; }
.is-ready .talent__details { display: flex; gap: calc(48 * var(--u)); margin-top: calc(38 * var(--u)); }
.is-ready .talent__col { width: calc(320 * var(--u)); }
.is-ready .talent__col:nth-child(2) { width: calc(330 * var(--u)); }
.is-ready .talent__col--proof { width: calc(216 * var(--u)); }
.is-ready .talent__h { margin-bottom: calc(16 * var(--u)); font: 400 max(11px, calc(14 * var(--u)))/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #a7a7a7; white-space: nowrap; }
.is-ready .talent__about, .is-ready .talent__known li { font-size: max(14px, calc(21 * var(--u))); line-height: 1.5; letter-spacing: -.01em; color: rgba(247, 239, 229, .86); }
.is-ready .talent__known { display: flex; flex-direction: column; gap: calc(12 * var(--u)); margin: 0; padding: 0; list-style: none; }
.is-ready .talent__known li { position: relative; padding-left: calc(30 * var(--u)); }
.is-ready .talent__known li::before { content: ''; position: absolute; left: 0; top: .7em; width: calc(16 * var(--u)); height: 2px; background: var(--orange); }
.is-ready .talent__logo { margin: 0 0 calc(15 * var(--u)); }
.is-ready .talent__logo img { width: calc(66 * var(--u)); min-width: 40px; height: auto; }
.is-ready .talent__logo--salesforce img { width: calc(44 * var(--u)); min-width: 28px; }
.is-ready .talent__logo--ibm img { width: calc(71 * var(--u)); min-width: 44px; }
.is-ready .talent__proof { display: flex; flex-direction: column; gap: calc(10 * var(--u)); margin: 0; padding: 0; list-style: none; font: 700 max(20px, calc(28 * var(--u)))/1 var(--judge); text-transform: uppercase; color: #f7efe5; }
.is-ready .talent__ctas { margin-top: calc(100 * var(--u)); }
.talent__book > a { position: relative; display: inline-block; padding-bottom: max(10px, calc(14 * var(--u))); font: 400 max(15px, calc(20.74 * var(--u)))/1 var(--mono); letter-spacing: -.02em; text-transform: uppercase; color: var(--orange); }
.talent__book > a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: max(6px, calc(9 * var(--u))); background: url(../logos/marker-underline.svg) left center / 100% 100% no-repeat; transition: clip-path .6s var(--ease); clip-path: inset(0 0 0 0); }
.talent__book > a:hover::after { clip-path: inset(0 100% 0 0); }
.talent__x { left: calc(1528 * var(--u)); top: calc(76 * var(--u)); padding: 0; border: 0; background: none; box-shadow: inset 0 0 0 1px rgba(247, 239, 229, .6); color: #f7efe5; rotate: 45deg; cursor: pointer; transition: background-color .2s; }
.talent__x:hover { background: rgba(247, 239, 229, .12); }

/* ---------- Generic pages ---------- */
.page-generic { max-width: 760px; margin: 0 auto; padding: 200px 20px 120px; }
.generic-title { font: 700 clamp(48px, 7vw, 96px)/.88 var(--judge); text-transform: uppercase; margin-bottom: 40px; }
.generic-content > * + * { margin-top: 1em; }
.generic-content { line-height: 1.5; }

/* ---------- Preloader & cursor ---------- */
.preloader { display: none; }
.js .preloader {
	position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: var(--ink); color: var(--paper);
	animation: pre-out .5s 4s forwards; /* safety net if scripts never load */
}
@keyframes pre-out { to { opacity: 0; visibility: hidden; } }
.preloader__logo { position: absolute; left: 4vw; bottom: 4vh; width: clamp(110px, 13vw, 240px); }
.preloader__count { position: absolute; right: 4vw; bottom: 4vh; font: clamp(40px, 7vw, 110px)/1 var(--mono); color: var(--orange); }
.cursor { display: none; }
.has-cursor .cursor { display: block; position: fixed; inset: 0; z-index: 1001; pointer-events: none; }
.cursor__dot, .cursor__ring { position: absolute; left: 0; top: 0; border-radius: 50%; translate: -50% -50%; }
.cursor__dot { width: 6px; height: 6px; background: var(--orange); }
.cursor__ring { width: 34px; height: 34px; border: 1.5px solid var(--orange); transition: width .3s var(--ease), height .3s var(--ease), background-color .3s; }
.cursor.is-link .cursor__ring { width: 64px; height: 64px; background: rgba(255, 60, 0, .12); }

@media (prefers-reduced-motion: no-preference) {
	.js :is(.help__knight, .help__queen) img { opacity: 0; }
}

/* SplitText block reveal */
.rv-block { position: absolute; inset: -.04em -.06em; background: var(--reveal, currentColor); transform-origin: left; transform: scaleX(0); pointer-events: none; }

/* ---------- Mobile ---------- */
@media (max-width: 1024px) {
	.contact { padding: 72px 20px 140px; }
	.contact form { grid-template-columns: 1fr; gap: 28px; }
	.contact :is(.wp-block-jetpack-button, .contact-submit) { justify-self: center; }
	.contact .steps--bl { --sw: 120; }
	:root { --u: .42px; }
	body { font-size: 15px; }
	.h-xl { font-size: 64px; }
	.h-l { font-size: 42px; }
	.h-m { font-size: 36px; }
	.lead, .body { font-size: 15px; max-width: none; }
	.t { --kmin: .62px; }

	.hdr { padding: 16px 20px; }
	@media (max-width: 600px) { .site-header { top: 0; } }
	.hdr__link { display: none; }
	.hdr__burger { display: grid; gap: 5px; width: 44px; height: 44px; place-content: center; margin-left: 12px; padding: 0; background: none; border: 0; color: inherit; }
	.hdr__burger i { display: block; width: 22px; height: 2px; background: currentColor; transition: transform .35s var(--ease), opacity .2s; }
	.hdr__burger[aria-expanded=true] i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.hdr__burger[aria-expanded=true] i:nth-child(2) { opacity: 0; }
	.hdr__burger[aria-expanded=true] i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
	.hdr { gap: 0; }
	.hdr__nav { margin-left: auto; }
	.hdr__menu { position: fixed; inset: 0; z-index: 49; display: flex; flex-direction: column; justify-content: center; gap: 28px; padding: 40px 24px; background: var(--ink); font: 700 48px/.9 var(--judge); text-transform: uppercase; color: var(--paper); }
	.hdr__menu .btn { align-self: flex-start; margin-top: 12px; }
	.menu-open .hdr { position: relative; z-index: 50; color: var(--paper); }
	.menu-open .hdr__nav { color: var(--paper); }

	.ftr { grid-template-columns: 1fr; justify-items: center; gap: 16px; padding: 36px 20px; text-align: center; }
	.ftr__tag { font-size: 32px; }
	.ftr__copy { justify-self: center; font-size: 15px; max-width: 340px; }

	.hero { min-height: 580px; }
	.hero__inner, .hero__inner--low, .hero__inner--help { padding: 110px 20px 48px; }
	.hero__inner--low { padding-top: 290px; }
	.hero__inner--low .rv { font-size: min(64px, 13.4vw); }
	.hero:has(.hero__inner--low) { min-height: 580px; }
	.hero__inner .rv { max-width: none; margin-top: 10px; }
	.hero__inner .lead { margin-top: 20px; }
	.hero > .steps--br { display: none; }

	.statbar { justify-content: space-between; padding: 16px 20px; }
	.statbar__item { flex-direction: column; align-items: flex-start; gap: 4px; padding: 0 12px; }
	.statbar__item:first-child { padding-left: 0; }
	.statbar b { font-size: 26px; }
	.statbar span { min-width: 0; max-width: none; font-size: 10px; }

	.manifesto { margin: 20px 20px 0; padding: 48px 20px 56px; }
	.steps--tl { left: -20px; }
	.manifesto__title { font-size: 32px; }
	.inline-ill { width: 44px; margin: -14px -6px -6px; }
	.inline-ill--stamp { width: 48px; margin: -26px 0 -6px 6px; }

	.transfer, .fracture, .install, .cost, .finance, .programs, .proof, .team,
	.seat, .halffix, .op, .op--jason, .stay, .both, .belief, .receipts, .verdicts, .finale,
	.band, .msteps, .leave, .smaller, .cta { padding: 64px 20px; margin: 0; min-height: 0; }
	.transfer__intro, .install__copy, .cost__copy, .finance__copy, .team__copy, .band__copy { max-width: none; padding: 0; }

	.personas { display: flex; gap: 24px; margin: 72px -20px 0; padding: 70px 20px 30px; overflow-x: auto; scroll-snap-type: x mandatory; }
	.persona { flex: 0 0 82%; margin: 0 !important; min-height: 380px; padding: 220px 22px 24px; scroll-snap-align: center; box-shadow: 10px 10px 0 var(--shadow); }
	.persona__ill, .persona--0 .persona__ill, .persona--1 .persona__ill, .persona--2 .persona__ill { width: 190px; top: -40px; left: 20px; }
	.persona__tag { top: -64px; left: 0; }
	.persona__body { max-width: none; }
	.steps--persona-a, .steps--persona-b { display: none; }

	.fracture__title { font-size: 44px; }
	.fracture__ill { width: 100%; margin-top: -20px; }

	.install__panel { margin: 0 -20px; padding: 48px 20px 260px; }
	.install__photo { top: auto; bottom: 20px; right: 20px; left: 20px; width: auto; height: 220px; }
	.install__tape-a, .install__tape-b, .steps--install, .steps--install-b, .stepcards__tape { display: none; }
	.stepcards, .stepcards--finance { position: relative; left: auto; top: auto; grid-template-columns: 1fr; gap: 24px; margin: 32px 0 0; }
	.stepcard { min-height: 0; padding: 22px 24px 26px; box-shadow: 10px 10px 0 var(--shadow); }
	.stepcard__title { font-size: 34px; margin: 12px 0 20px; max-width: none; }
	.stepcard__body { max-width: none; }
	/* the mascot gets its own row between cards 2 and 3 */
	.stepcards__mascot { position: relative; left: auto; top: auto; order: 1; justify-self: end; width: 120px; height: 0; margin: -70px 16px 0 0; } /* zero-height row, so the mascot overlaps the cards */
	.stepcards:has(.stepcards__mascot) > .stepcard ~ .stepcard ~ .stepcard { order: 2; margin-top: -24px; } /* cancels the mascot row's extra gap */
	.stepcards__paper { left: auto; right: -6px; top: auto; bottom: -50px; width: 90px; }

	.pullquote { padding: 56px 20px; }

	.cost { padding: 0; }
	.cost__copy { padding: 48px 20px; }
	.cost__panel { position: relative; top: auto; width: auto; height: 540px; padding: 40px 16px 0; }
	.chart { left: 8px; right: 8px; height: 330px; gap: 12px; }
	.chart__bar { height: calc(var(--h) * .55px); }
	.chart__label { bottom: calc(var(--h) * .55px + 52px); font-size: 10px; left: -6px; right: -6px; }
	.chart__label span { font-size: 8px; }
	.chart__dot { bottom: calc(var(--d) * .55px); }

	.finance { padding-top: 0; }
	.finance__photo { position: relative; left: auto; width: auto; height: 260px; margin: 0 -20px 40px; }

	.logowall { padding: 72px 20px; }
	.logowall__title { font-size: 40px; }
	.logowall__ill { width: 80px; margin: 0 auto -10px; }
	.logowall { overflow: hidden; }
	.tiles { grid-template-columns: none; grid-template-rows: repeat(2, 120px); grid-auto-flow: column; grid-auto-columns: 120px; gap: 12px; width: max-content; margin: 40px -20px 0; padding: 0; animation: marquee 32s linear infinite; }
	.tile:nth-child(n) { translate: none; }
	.tile--dup { display: block; }

	.programs::before { top: 520px; bottom: 100px; height: auto; border-radius: 50% 50% 0 0 / 120px 120px 0 0; }
	.programs::after { height: 100px; }
	.programs__title { font-size: 34px; }
	.progs { flex-direction: column; align-items: stretch; gap: 32px; margin-top: 120px; }
	.prog, .prog--featured { width: auto; min-height: 0; margin: 0; padding: 28px 24px; box-shadow: 10px 10px 0 var(--shadow); }
	.prog--featured { box-shadow: 10px 10px 0 var(--orange); }
	.prog__title { font-size: 32px; }
	.progs__fire { left: auto; right: -14px; top: -92px; width: 110px; translate: none; margin-left: 0; }

	.proof__head .rv { font-size: 40px; }
	.proof__bubble { width: 56px; top: -40px; }
	.proof__grid { grid-template-columns: 1fr; }
	.quote, .quote--lead { grid-column: auto; min-height: 0; padding: 28px 22px; gap: 40px; }
	.quote--lead .quote__text { font-size: 28px; }

	.team__copy .cta-row { flex-wrap: wrap; }
	.team__people { position: relative; left: auto; top: auto; flex-direction: column; gap: 48px; margin-top: 56px; }
	.person, .person + .person { width: auto; margin: 0; }
	.polaroid { width: 80%; margin: 0 auto 24px; }
	.person__role, .person__bio { margin: 0 0 8px; }
	.team .steps--tr, .team .steps--bl { --sw: 120; }

	.ghost { display: none; }
	.timecode { gap: 8px; }
	.seat__chair { width: 44px; }
	.seat__head { display: block; } /* full width, so the chairs can sit in the space beside the short lines */
	.seat__chair--a { left: 196px; top: -30px; } /* just after "CHAIRS.", like desktop */
	.seat__chair--b { left: auto; right: 4px; top: 10px; } /* beside the end of line two */
	.seat__photo { height: 240px; margin: 32px -20px 0; }
	.steps--seat { right: 0; bottom: 62px; }
	.halffix__title, .both__title, .stay__title { font-size: 48px; }
	.halffix__title { font-size: 40px; }
	.halffix__title br { display: none; }
	.halffix__cols { grid-template-columns: 1fr; gap: 56px; margin-top: 56px; }
	.halffix__col .ill { height: 190px; }
	.op, .op--jason { grid-template-columns: 1fr; gap: 40px; }
	.op--jason .op__photo { order: 2; }
	.op__name { font-size: 72px; }
	.op__sub.t { width: calc(var(--w) * var(--k)); }
	.op__photo { max-width: 480px; margin: 0 auto; }
	.halffix__body { max-width: 320px; }
	.persona { flex-basis: min(82%, 380px); }
	.opgrid { grid-template-columns: 1fr; gap: 12px; max-width: none; border: 0; }
	.opgrid > div { padding: 16px; }
	.opgrid dt { font-size: 12px; }
	.opgrid dd { font-size: 14px; }
	.stay { padding-top: 120px; }
	.stay__bg::after { background: linear-gradient(rgba(19, 19, 18, .35), rgba(19, 19, 18, .92)); }
	.phase { grid-template-columns: 1fr; padding: 20px 0; }
	.phase > * { grid-column: 1 !important; grid-row: auto !important; }
	.phase__title { font-size: 40px; margin-bottom: 12px; }
	.phase__col { margin-top: 16px; }
	.phase__text { max-width: none; margin-top: 8px; font-size: 15px; }
	.phase .t { --kmin: .95px; }
	.belief__photo { position: relative !important; right: auto; top: auto; width: auto; margin: 40px 0 0; }
	.receipts__row { grid-template-columns: 1fr 1fr; gap: 40px 20px; margin-top: 40px; }
	.receipts__row > div { min-width: 0; } /* lets the long labels scale down instead of running off screen */
	.receipts b { font-size: 56px; }
	.verdicts__quote { font-size: 32px; }
	.verdicts__grid { grid-template-columns: 1fr; gap: 32px; }
	.verdict:nth-child(-n+2) { padding-bottom: 0; border: 0; }
	.verdict + .verdict { padding-top: 32px; border-top: 2px solid rgba(242, 231, 219, .5); }
	.scrub__cap { display: none; }
	.scrub__time { font-size: 22px; }

	.help__title { font-size: 56px; max-width: none !important; }
	.inline-ill.help__knight { right: -4px; top: 6px; width: 46px; margin: 0; } /* over the end of the first line, as in Figma; clear of the header */
	.help__knight::before { left: -3px; top: 7px; width: 64px; filter: blur(16px); }
	.help__photo { position: relative; right: auto; top: auto; width: auto; height: 260px; margin: 0 20px; }
	.help__queen { left: auto; right: 0; top: auto; bottom: -60px; width: 120px; }
	.hero--paper { padding-bottom: 40px; }
	.mstep, .mstep--after { grid-template-columns: 1fr; gap: 24px; min-height: 0; padding: 48px 0; }
	.stepnum__note { max-width: none; }
	.subs { flex-direction: column; gap: 28px; margin-top: 40px; }
	.ill--shape { width: 80%; margin: 0 auto; }
	.msteps__field { width: auto; height: 220px; margin: 0 -20px; }
	.leave__title { font-size: 72px; white-space: normal; }
	.leave__keys { position: relative; left: auto; top: auto; width: 60%; margin: -20px 0 0 auto; }
	.leave__photo { position: relative; right: auto; top: auto; width: 100%; }
	.benefits { grid-template-columns: 1fr 1fr; gap: 40px 20px; padding: 0; margin-top: 40px; }
	.leave__cta { padding-left: 0; }
	.smaller { grid-template-columns: 1fr; padding-right: 0; }
	.smaller__copy { padding-right: 20px; }
	.pill { --pu: .48px; }
	.assets { margin-top: 56px; padding-right: 20px; }
	.prog--asset { width: 78%; min-height: 380px; }
	.cta .rv { font-size: 52px; }
	/* Our Talent: rows stack, tap a row to flip it */
	.hero__inner--talent { padding: 130px 20px 64px; }
	.hero__inner.hero__inner--talent .rv.talent__title { font-size: clamp(38px, 11.3vw, 56px); margin-top: 18px; line-height: 1.04; }
	.inline-ill.talent__faces { width: 2.45em; margin: 0 .06em; vertical-align: -.08em; }
	.hero--talent { min-height: 0; }
	.talent { padding: 56px 20px 88px; }
	.is-ready .talent__labels { display: none; }
	.is-ready .talent__item { height: auto; perspective: 2200px; perspective-origin: 50% 90px; }
	.is-ready .talent__front { position: relative; top: 0; height: auto; padding: 26px 0 28px; transform-origin: 50% 50%; }
	.is-ready :is(.talent__name, .talent__role, .talent__sub, .talent__leads) { position: static; white-space: normal; }
	.is-ready .talent__name { padding-right: 52px; font-size: clamp(44px, 13.2vw, 60px); } /* room for the + button */
	.is-ready .talent__role { margin-top: 18px; font-size: 13px; }
	.is-ready .talent__sub { margin-top: 8px; font-size: 15px; }
	.is-ready .talent__leads { flex-wrap: wrap; gap: 8px; margin-top: 16px; }
	.is-ready .talent__leads li { height: 29px; padding: 0 11px; font-size: 12.6px; }
	.talent__pm { left: auto; right: 0; top: 30px; width: 40px; font-size: 32px; }
	.is-ready .talent__panel { flex-direction: column; transform-origin: 50% 90px; }
	.is-ready .talent__photo { width: 100%; aspect-ratio: 5 / 4; }
	.is-ready .talent__photo img { object-position: 50% 20%; }
	.talent__cap { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 9px; padding: 56px 20px 18px; background: linear-gradient(rgba(22, 22, 22, 0), rgba(22, 22, 22, .9) 72%); }
	.talent__cap span { font: 400 12px/1 var(--mono); letter-spacing: .12em; color: rgba(247, 239, 229, .55); }
	.talent__cap b { font: 700 44px/1.09 var(--judge); letter-spacing: -.02em; text-transform: uppercase; color: #f7efe5; }
	.talent__cap i { font: 700 12.6px/1.09 var(--radio); font-style: normal; letter-spacing: .13em; text-transform: uppercase; color: var(--orange); }
	.talent__meta { display: none; }
	.is-ready .talent__content { padding: 26px 20px 30px; }
	.is-ready .talent__quote { margin: 0; font-size: clamp(28px, 8.2vw, 38px); }
	.is-ready .talent__quote.is-long { font-size: clamp(23px, 6.6vw, 30px); }
	.is-ready .talent__details { flex-direction: column; gap: 24px; margin-top: 28px; }
	.is-ready .talent__col, .is-ready .talent__col:nth-child(2), .is-ready .talent__col--proof { width: auto; }
	.is-ready .talent__h { margin-bottom: 12px; font-size: 12px; }
	.is-ready .talent__about, .is-ready .talent__known li { font-size: 17px; }
	.is-ready .talent__known { gap: 8px; }
	.is-ready .talent__known li { padding-left: 26px; }
	.is-ready .talent__known li::before { width: 14px; }
	.is-ready .talent__col--proof:has(.talent__logo) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
	.is-ready .talent__col--proof:has(.talent__logo) .talent__h { flex-basis: 100%; margin-bottom: 0; }
	.is-ready .talent__logo { margin: 0; }
	.is-ready .talent__proof { font-size: 24px; }
	.is-ready .talent__ctas { margin-top: 32px; }
	.talent__x { left: auto; right: 12px; top: 12px; width: 40px; background: rgba(22, 22, 22, .55); }
}

@keyframes marquee { to { transform: translateX(calc(-50% - 6px)); } }

@media (prefers-reduced-motion: reduce) {
	.tiles { animation: none !important; }
	.js .preloader { display: none; }
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
	.tile:hover, .tile.is-on { transform: none; }
	:is(a.btn, .btn > a):hover { transform: none; }
}

:is(a.btn, .btn > a) { translate: var(--mx, 0px) var(--my, 0px); }
.has-cursor, .has-cursor a, .has-cursor button { cursor: none; }