:root {
	--hwi-ink: #11171b;
	--hwi-steel: #1d282e;
	--hwi-steel-2: #2b3940;
	--hwi-paper: #f3f0e8;
	--hwi-paper-2: #e8e5dc;
	--hwi-white: #ffffff;
	--hwi-yellow: #f2c316;
	--hwi-yellow-bright: #ffd63b;
	--hwi-blue: #20569b;
	--hwi-muted: #657076;
	--hwi-rule: rgba(17, 23, 27, .16);
	--hwi-copy: min(720px, calc(100vw - 40px));
	--hwi-wide: min(1140px, calc(100vw - 40px));
}

.obv-hwi-feature-page {
	background: var(--hwi-paper);
}

.obv-hwi-feature-page.hwi-lightbox-open {
	overflow: hidden;
}

.hwi-feature-main {
	overflow-x: hidden;
	overflow: clip;
	background: var(--hwi-paper);
	color: var(--hwi-ink);
}

.hwi-feature-main *,
.hwi-feature-main *::before,
.hwi-feature-main *::after {
	box-sizing: border-box;
}

.hwi-feature-main button,
.hwi-feature-main a {
	-webkit-tap-highlight-color: transparent;
}

.hwi-feature-main a:focus-visible,
.hwi-feature-main button:focus-visible,
.hwi-lightbox button:focus-visible {
	outline: 3px solid var(--hwi-yellow);
	outline-offset: 4px;
}

.hwi-reading-progress {
	position: fixed;
	z-index: 1002;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	pointer-events: none;
}

.hwi-reading-progress span {
	display: block;
	width: 0;
	height: 100%;
	background: var(--hwi-yellow);
	box-shadow: 0 0 18px rgba(242, 195, 22, .55);
	transform-origin: left center;
}

/* Hero */
.hwi-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 56%) minmax(0, 44%);
	min-height: max(790px, calc(100vh - 24px));
	background: var(--hwi-ink);
	color: var(--hwi-white);
	overflow: hidden;
}

.hwi-hero::before {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 56%;
	height: 6px;
	background: var(--hwi-yellow);
	content: "";
}

.hwi-hero-copy {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 80px max(42px, 6vw) 250px;
	background:
		radial-gradient(circle at 8% 12%, rgba(242, 195, 22, .09), transparent 24%),
		linear-gradient(135deg, #11171b 0%, #182126 100%);
}

.hwi-hero-copy::after {
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
	background-size: 44px 44px;
	mask-image: linear-gradient(135deg, #000, transparent 70%);
	content: "";
	pointer-events: none;
}

.hwi-hero-copy > * {
	position: relative;
	z-index: 1;
}

.hwi-hero-kicker,
.hwi-hero-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 9px 21px;
	align-items: center;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.hwi-hero-kicker span {
	color: var(--hwi-yellow-bright);
}

.hwi-hero-kicker a {
	color: rgba(255, 255, 255, .82);
	text-decoration: none;
}

.hwi-hero-kicker a:hover,
.hwi-hero-kicker a:focus-visible {
	color: var(--hwi-yellow-bright);
}

.hwi-hero-overline {
	margin: 32px 0 8px;
	color: var(--hwi-yellow-bright);
	font-size: clamp(12px, 1.2vw, 16px);
	font-weight: 900;
	letter-spacing: .22em;
	text-transform: uppercase;
}

.hwi-hero h1 {
	max-width: 760px;
	margin: 0;
	color: #fff;
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(50px, 5.55vw, 84px);
	font-weight: 500;
	line-height: .96;
	letter-spacing: -.045em;
	text-wrap: balance;
}

.hwi-hero-deck {
	max-width: 690px;
	margin: 24px 0 22px;
	color: rgba(255, 255, 255, .82);
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(17px, 1.4vw, 21px);
	line-height: 1.45;
}

.hwi-hero-meta {
	padding-top: 17px;
	border-top: 1px solid rgba(255, 255, 255, .24);
	color: rgba(255, 255, 255, .62);
}

.hwi-begin {
	display: inline-flex;
	gap: 14px;
	align-items: center;
	align-self: flex-start;
	margin-top: 28px;
	color: #fff;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .14em;
	text-decoration: none;
	text-transform: uppercase;
}

.hwi-begin i {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 1px solid rgba(255, 255, 255, .42);
	border-radius: 50%;
	color: var(--hwi-yellow-bright);
	font-style: normal;
	transition: transform .2s ease, background .2s ease, color .2s ease;
}

.hwi-begin:hover,
.hwi-begin:focus-visible {
	color: #fff;
}

.hwi-begin:hover i,
.hwi-begin:focus-visible i {
	background: var(--hwi-yellow);
	color: var(--hwi-ink);
	transform: translateY(3px);
}

.hwi-hero-photo {
	position: relative;
	min-height: 760px;
	background: #202c31;
}

.hwi-hero-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 48% center;
}

.hwi-hero-photo-shade {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(17, 23, 27, .52), transparent 32%),
		linear-gradient(0deg, rgba(17, 23, 27, .76), transparent 28%);
}

.hwi-hero-photo > p {
	position: absolute;
	z-index: 2;
	right: 24px;
	bottom: 25px;
	left: 24px;
	margin: 0;
	color: rgba(255, 255, 255, .72);
	font-size: 10px;
	line-height: 1.4;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.hwi-hero-route {
	position: absolute;
	z-index: 4;
	right: max(24px, 4vw);
	bottom: 38px;
	left: max(24px, 4vw);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	padding: 18px 20px 30px;
	border: 1px solid rgba(255, 255, 255, .18);
	background: rgba(10, 15, 18, .88);
	box-shadow: 0 25px 80px rgba(0, 0, 0, .28);
	backdrop-filter: blur(14px);
}

.hwi-hero-route > div {
	display: grid;
	grid-template-columns: 27px 1fr;
	gap: 2px 9px;
	padding: 4px 18px;
	border-right: 1px solid rgba(255, 255, 255, .14);
	opacity: .38;
	transform: translateY(7px);
	transition: opacity .45s ease, transform .45s ease;
}

.hwi-hero-route > div:first-child {
	padding-left: 0;
}

.hwi-hero-route > div:nth-child(4) {
	padding-right: 0;
	border-right: 0;
}

.hwi-hero-route > div.is-complete {
	opacity: 1;
	transform: none;
}

.hwi-hero-route div > span {
	grid-row: 1 / 3;
	color: var(--hwi-yellow);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .08em;
}

.hwi-hero-route strong {
	color: #fff;
	font-size: 12px;
	letter-spacing: .02em;
}

.hwi-hero-route em {
	color: rgba(255, 255, 255, .54);
	font-size: 9px;
	font-style: normal;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.hwi-hero-route > i {
	position: absolute;
	right: 20px;
	bottom: 14px;
	left: 20px;
	height: 2px;
	background: rgba(255, 255, 255, .14);
	overflow: hidden;
}

.hwi-hero-route > i b {
	display: block;
	width: 0;
	height: 100%;
	background: var(--hwi-yellow);
	transition: width 1.9s cubic-bezier(.22, .61, .36, 1);
}

.hwi-hero-route.is-complete > i b {
	width: 100%;
}

/* Chapter navigation */
.hwi-chapter-nav {
	position: sticky;
	z-index: 90;
	top: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	background: rgba(17, 23, 27, .96);
	box-shadow: 0 8px 25px rgba(0, 0, 0, .12);
	backdrop-filter: blur(12px);
}

.admin-bar .hwi-chapter-nav {
	top: 32px;
}

.hwi-chapter-nav > div {
	display: flex;
	width: var(--hwi-wide);
	margin: 0 auto;
	overflow-x: auto;
	scrollbar-width: none;
}

.hwi-chapter-nav > div::-webkit-scrollbar {
	display: none;
}

.hwi-chapter-label,
.hwi-chapter-nav a {
	flex: 0 0 auto;
	padding: 17px 14px 15px;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.hwi-chapter-label {
	padding-left: 0;
	color: var(--hwi-yellow);
}

.hwi-chapter-nav a {
	position: relative;
	color: rgba(255, 255, 255, .57);
	text-decoration: none;
}

.hwi-chapter-nav a::after {
	position: absolute;
	right: 14px;
	bottom: 0;
	left: 14px;
	height: 3px;
	background: var(--hwi-yellow);
	content: "";
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform .2s ease;
}

.hwi-chapter-nav a:hover,
.hwi-chapter-nav a:focus-visible,
.hwi-chapter-nav a.is-active {
	color: #fff;
}

.hwi-chapter-nav a.is-active::after {
	transform: scaleX(1);
}

/* Reading system */
.hwi-story-canvas {
	background: var(--hwi-paper);
}

.hwi-story-section {
	position: relative;
	padding: 110px max(20px, 4vw);
	scroll-margin-top: 58px;
}

.hwi-story-section + .hwi-story-section {
	border-top: 1px solid var(--hwi-rule);
}

.hwi-reading-grid {
	display: grid;
	grid-template-columns: minmax(0, 720px) minmax(260px, 330px);
	gap: 76px;
	align-items: start;
	width: var(--hwi-wide);
	margin: 0 auto;
}

.hwi-story-copy {
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(18px, 1.55vw, 21px);
	line-height: 1.72;
}

.hwi-story-copy > *:first-child {
	margin-top: 0;
}

.hwi-story-copy p {
	margin: 0 0 1.45em;
}

.hwi-story-copy a {
	color: var(--hwi-blue);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.hwi-story-copy a:hover,
.hwi-story-copy a:focus-visible {
	color: var(--hwi-ink);
}

.hwi-copy-narrow {
	width: var(--hwi-copy);
	margin-inline: auto;
}

.hwi-copy-after-grid {
	margin-top: 60px;
}

.hwi-dropcap > p:first-child::first-letter {
	float: left;
	margin: .04em .12em 0 0;
	color: var(--hwi-ink);
	font-size: 4.35em;
	font-weight: 700;
	line-height: .8;
}

.hwi-pullquote {
	position: sticky;
	top: 105px;
	padding: 28px 0 28px 26px;
	border-left: 5px solid var(--hwi-yellow);
}

.hwi-pullquote--yellow {
	padding: 28px;
	border: 0;
	background: var(--hwi-yellow);
}

.hwi-pullquote-label,
.hwi-section-number,
.hwi-route-heading > span,
.hwi-support-heading > span,
.hwi-full-throttle > span,
.hwi-bridge-heading > span,
.hwi-award-panel > div > span,
.hwi-source-notes > span,
.hwi-share > span {
	display: block;
	margin-bottom: 14px;
	color: var(--hwi-blue);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .15em;
	text-transform: uppercase;
}

.hwi-pullquote--yellow .hwi-pullquote-label {
	color: rgba(17, 23, 27, .62);
}

.hwi-pullquote blockquote {
	margin: 0;
	color: var(--hwi-ink);
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(25px, 2.3vw, 34px);
	font-weight: 600;
	line-height: 1.16;
	letter-spacing: -.025em;
}

.hwi-pullquote cite {
	display: block;
	margin-top: 20px;
	color: var(--hwi-muted);
	font-size: 10px;
	font-style: normal;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.hwi-pullquote--yellow cite {
	color: rgba(17, 23, 27, .62);
}

.hwi-section-intro {
	width: var(--hwi-wide);
	margin: 0 auto 58px;
}

.hwi-section-number {
	color: var(--hwi-blue);
}

.hwi-section-intro h2 {
	max-width: 920px;
	margin: 0;
	color: var(--hwi-ink);
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(43px, 5.2vw, 72px);
	font-weight: 500;
	line-height: .98;
	letter-spacing: -.045em;
	text-wrap: balance;
}

.hwi-inline-quote {
	margin: 2.2em 0;
	padding: 0 0 0 26px;
	border-left: 4px solid var(--hwi-yellow);
	color: var(--hwi-ink);
	font-size: clamp(23px, 2.15vw, 31px);
	font-weight: 600;
	line-height: 1.24;
	letter-spacing: -.02em;
}

/* Journey module */
.hwi-route-module {
	width: var(--hwi-wide);
	margin: 78px auto 0;
	padding: 52px 48px 44px;
	background: var(--hwi-steel);
	color: #fff;
	box-shadow: 0 26px 70px rgba(17, 23, 27, .16);
}

.hwi-route-heading {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 12px 40px;
	align-items: end;
	margin-bottom: 42px;
}

.hwi-route-heading > span {
	grid-column: 1 / -1;
	margin: 0;
	color: var(--hwi-yellow);
}

.hwi-route-heading h2 {
	max-width: 640px;
	margin: 0;
	color: #fff;
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(34px, 3.6vw, 52px);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -.035em;
}

.hwi-route-heading p {
	max-width: 380px;
	margin: 0;
	color: rgba(255, 255, 255, .63);
	font-size: 14px;
	line-height: 1.55;
}

.hwi-route-rail {
	position: relative;
	height: 3px;
	margin: 0 7.5%;
	background: rgba(255, 255, 255, .16);
}

.hwi-route-rail span {
	display: block;
	width: 0;
	height: 100%;
	background: var(--hwi-yellow);
	transition: width .55s cubic-bezier(.22, .61, .36, 1);
}

.hwi-route-module ol {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 8px;
	margin: -8px 0 0;
	padding: 0;
	list-style: none;
}

.hwi-route-module li {
	margin: 0;
	padding: 0;
}

.hwi-route-module button {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	min-height: 150px;
	padding: 27px 13px 17px;
	border: 0;
	background: transparent;
	color: rgba(255, 255, 255, .48);
	text-align: left;
	cursor: pointer;
	transition: color .2s ease, background .2s ease;
}

.hwi-route-module button::before {
	position: absolute;
	top: 0;
	left: 50%;
	width: 15px;
	height: 15px;
	border: 3px solid var(--hwi-steel);
	border-radius: 50%;
	background: #6d777c;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .22);
	content: "";
	transform: translateX(-50%);
	transition: background .2s ease, transform .2s ease;
}

.hwi-route-module li.is-active button {
	background: rgba(255, 255, 255, .055);
	color: #fff;
}

.hwi-route-module li.is-active button::before {
	background: var(--hwi-yellow);
	box-shadow: 0 0 0 1px var(--hwi-yellow), 0 0 18px rgba(242, 195, 22, .55);
	transform: translateX(-50%) scale(1.12);
}

.hwi-route-module button > span {
	color: var(--hwi-yellow);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .1em;
}

.hwi-route-module button strong {
	margin-top: auto;
	font-size: 13px;
	line-height: 1.2;
}

.hwi-route-module button small {
	margin-top: 5px;
	font-size: 9px;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.hwi-route-readout {
	display: grid;
	grid-template-columns: 85px 1fr;
	gap: 25px;
	align-items: start;
	min-height: 124px;
	padding: 29px;
	border-top: 1px solid rgba(255, 255, 255, .18);
	background: rgba(0, 0, 0, .14);
}

.hwi-route-readout > span {
	color: var(--hwi-yellow);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .1em;
}

.hwi-route-readout strong {
	display: block;
	color: #fff;
	font-family: var(--serif, Georgia, serif);
	font-size: 25px;
	font-weight: 600;
}

.hwi-route-readout p {
	max-width: 750px;
	margin: 8px 0 0;
	color: rgba(255, 255, 255, .66);
	font-size: 14px;
	line-height: 1.55;
}

/* Number line */
.hwi-starting-section {
	background: var(--hwi-paper-2);
}

.hwi-number-line {
	display: grid;
	grid-template-columns: 1.25fr repeat(3, 1fr);
	width: var(--hwi-wide);
	margin: 68px auto 0;
	border: 1px solid var(--hwi-rule);
	background: rgba(255, 255, 255, .34);
}

.hwi-number {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 190px;
	padding: 27px;
	border-right: 1px solid var(--hwi-rule);
}

.hwi-number:last-child {
	border-right: 0;
}

.hwi-number--lead {
	background: var(--hwi-yellow);
}

.hwi-number strong {
	color: var(--hwi-ink);
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(54px, 6vw, 80px);
	font-weight: 500;
	line-height: .9;
	letter-spacing: -.05em;
}

.hwi-number span {
	color: var(--hwi-muted);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.hwi-number--lead span {
	color: rgba(17, 23, 27, .65);
}

/* Work Ready */
.hwi-work-ready-section {
	background: #fbfaf6;
}

.hwi-reading-grid--light {
	padding: 52px;
	background: var(--hwi-paper);
}

.hwi-support-module {
	width: var(--hwi-wide);
	margin: 74px auto 0;
	border-top: 6px solid var(--hwi-blue);
	background: var(--hwi-white);
	box-shadow: 0 20px 60px rgba(23, 34, 40, .09);
}

.hwi-support-heading {
	display: grid;
	grid-template-columns: 1fr 1.55fr;
	gap: 10px 44px;
	align-items: end;
	padding: 40px 42px 35px;
	border-bottom: 1px solid var(--hwi-rule);
}

.hwi-support-heading > span {
	grid-column: 1 / -1;
	margin: 0;
}

.hwi-support-heading h3 {
	margin: 0;
	color: var(--hwi-ink);
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(34px, 4vw, 52px);
	font-weight: 500;
	letter-spacing: -.035em;
}

.hwi-support-heading p {
	margin: 0;
	color: var(--hwi-muted);
	font-size: 14px;
	line-height: 1.55;
}

.hwi-support-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.hwi-support-grid button {
	display: grid;
	grid-template-columns: 36px 1fr;
	grid-template-rows: auto 1fr;
	gap: 7px 13px;
	min-height: 190px;
	padding: 31px;
	border: 0;
	border-right: 1px solid var(--hwi-rule);
	background: transparent;
	color: var(--hwi-ink);
	text-align: left;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}

.hwi-support-grid button:last-child {
	border-right: 0;
}

.hwi-support-grid button.is-active {
	background: var(--hwi-blue);
	color: #fff;
}

.hwi-support-grid button > span {
	grid-row: 1 / 3;
	color: var(--hwi-blue);
	font-size: 11px;
	font-weight: 900;
}

.hwi-support-grid button.is-active > span {
	color: var(--hwi-yellow-bright);
}

.hwi-support-grid button strong {
	font-family: var(--serif, Georgia, serif);
	font-size: 26px;
	font-weight: 600;
}

.hwi-support-grid button small {
	color: var(--hwi-muted);
	font-size: 13px;
	line-height: 1.55;
}

.hwi-support-grid button.is-active small {
	color: rgba(255, 255, 255, .76);
}

/* Job and photographs */
.hwi-job-section {
	background: var(--hwi-paper);
}

.hwi-cinematic-photo {
	position: relative;
	width: var(--hwi-wide);
	height: min(54vw, 620px);
	min-height: 420px;
	margin: 76px auto;
	background: var(--hwi-steel);
	cursor: zoom-in;
	overflow: hidden;
}

.hwi-cinematic-photo::after {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 23%;
	height: 8px;
	background: var(--hwi-yellow);
	content: "";
}

.hwi-cinematic-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .55s ease;
}

.hwi-cinematic-photo:hover img {
	transform: scale(1.015);
}

.hwi-cinematic-photo figcaption,
.hwi-portrait-photo figcaption,
.hwi-award-panel figcaption {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 36px 22px 18px;
	background: linear-gradient(transparent, rgba(5, 8, 10, .84));
	color: rgba(255, 255, 255, .82);
	font-size: 10px;
	line-height: 1.45;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.hwi-job-grid {
	align-items: stretch;
}

.hwi-full-throttle {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 420px;
	padding: 34px;
	background:
		linear-gradient(145deg, rgba(242, 195, 22, .96), rgba(255, 214, 59, .84)),
		var(--hwi-yellow);
}

.hwi-full-throttle > span {
	margin-bottom: auto;
	color: rgba(17, 23, 27, .58);
}

.hwi-full-throttle blockquote {
	margin: 0;
	color: var(--hwi-ink);
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(27px, 2.5vw, 36px);
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -.025em;
}

/* Employer handoff */
.hwi-employers-section {
	background: #fff;
}

.hwi-portrait-photo {
	position: sticky;
	top: 90px;
	min-height: 560px;
	margin: 0;
	background: var(--hwi-steel);
	cursor: zoom-in;
	overflow: hidden;
}

.hwi-portrait-photo img {
	width: 100%;
	height: 100%;
	min-height: 560px;
	object-fit: cover;
	object-position: center 35%;
	transition: transform .45s ease;
}

.hwi-portrait-photo:hover img {
	transform: scale(1.018);
}

.hwi-bridge {
	width: var(--hwi-wide);
	margin: 78px auto 0;
	padding: 45px;
	background: var(--hwi-steel);
	color: #fff;
}

.hwi-bridge-heading {
	display: flex;
	gap: 30px;
	align-items: flex-end;
	justify-content: space-between;
}

.hwi-bridge-heading > span {
	margin: 0;
	color: var(--hwi-yellow);
}

.hwi-bridge-heading h3 {
	max-width: 680px;
	margin: 0;
	color: #fff;
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(33px, 3.8vw, 51px);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -.035em;
	text-align: right;
}

.hwi-bridge-line {
	height: 4px;
	margin: 45px 0 0;
	background: rgba(255, 255, 255, .15);
}

.hwi-bridge-line span {
	display: block;
	width: 0;
	height: 100%;
	background: linear-gradient(90deg, var(--hwi-blue), var(--hwi-yellow));
	transition: width 1.5s cubic-bezier(.22, .61, .36, 1);
}

.hwi-bridge.is-visible .hwi-bridge-line span {
	width: 100%;
}

.hwi-bridge ol {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hwi-bridge li {
	min-height: 190px;
	padding: 25px 24px 5px;
	border-right: 1px solid rgba(255, 255, 255, .14);
}

.hwi-bridge li:first-child {
	padding-left: 0;
}

.hwi-bridge li:last-child {
	padding-right: 0;
	border-right: 0;
}

.hwi-bridge li span {
	color: var(--hwi-yellow);
	font-size: 10px;
	font-weight: 900;
}

.hwi-bridge li strong {
	display: block;
	margin-top: 27px;
	color: #fff;
	font-family: var(--serif, Georgia, serif);
	font-size: 26px;
}

.hwi-bridge li small {
	display: block;
	margin-top: 9px;
	color: rgba(255, 255, 255, .63);
	font-size: 13px;
	line-height: 1.5;
}

/* Final */
.hwi-final-section {
	padding-bottom: 0;
	background: var(--hwi-paper-2);
}

.hwi-award-panel {
	display: grid;
	grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
	width: min(1320px, calc(100vw - 40px));
	margin: 78px auto 0;
	background: var(--hwi-ink);
	color: #fff;
}

.hwi-award-panel figure {
	position: relative;
	min-height: 610px;
	margin: 0;
	background: #05070a;
	cursor: zoom-in;
	overflow: hidden;
}

.hwi-award-panel figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	transition: transform .45s ease;
}

.hwi-award-panel figure:hover img {
	transform: scale(1.015);
}

.hwi-award-panel > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(42px, 6vw, 82px);
}

.hwi-award-panel > div > span {
	color: var(--hwi-yellow);
}

.hwi-award-panel > div > p {
	margin: 0 0 1.2em;
	color: rgba(255, 255, 255, .7);
	font-size: 15px;
	line-height: 1.6;
}

.hwi-award-panel blockquote {
	margin: 25px 0 0;
	color: #fff;
	font-family: var(--serif, Georgia, serif);
	font-size: clamp(34px, 4.2vw, 60px);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -.04em;
}

.hwi-route-complete {
	display: flex;
	gap: 17px;
	align-items: center;
	width: var(--hwi-wide);
	margin: 0 auto;
	padding: 48px 0 70px;
	color: var(--hwi-muted);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.hwi-route-complete i {
	flex: 1;
	height: 2px;
	background: var(--hwi-rule);
}

.hwi-route-complete strong {
	color: var(--hwi-blue);
}

/* Footer */
.hwi-story-footer {
	padding: 70px max(20px, 4vw);
	background: var(--hwi-ink);
	color: #fff;
}

.hwi-story-footer-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 200px;
	gap: 80px;
	width: var(--hwi-wide);
	margin: 0 auto;
}

.hwi-source-notes > span,
.hwi-share > span {
	color: var(--hwi-yellow);
}

.hwi-source-notes p {
	max-width: 790px;
	margin: 0;
	color: rgba(255, 255, 255, .62);
	font-size: 13px;
	line-height: 1.65;
}

.hwi-source-notes a,
.hwi-share a,
.hwi-share button {
	color: #fff;
}

.hwi-share {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.hwi-share > span {
	margin-bottom: 5px;
}

.hwi-share a,
.hwi-share button {
	padding: 0;
	border: 0;
	background: transparent;
	font-size: 13px;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.hwi-related,
.hwi-newsletter {
	margin-block: 70px;
}

/* Motion */
.hwi-js .hwi-reveal {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity .7s ease, transform .7s cubic-bezier(.22, .61, .36, 1);
}

.hwi-js .hwi-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Lightbox */
.hwi-lightbox[hidden] {
	display: none;
}

.hwi-lightbox {
	position: fixed;
	z-index: 10000;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 75px 34px 34px;
	background: rgba(4, 7, 9, .96);
}

.hwi-lightbox-stage {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 96vw;
	max-height: 88vh;
}

.hwi-lightbox-stage img {
	max-width: 100%;
	max-height: 78vh;
	object-fit: contain;
}

.hwi-lightbox-stage p {
	max-width: 900px;
	margin: 16px 0 0;
	color: rgba(255, 255, 255, .7);
	font-size: 11px;
	line-height: 1.45;
	letter-spacing: .05em;
	text-align: center;
	text-transform: uppercase;
}

.hwi-lightbox-close {
	position: absolute;
	top: 20px;
	right: 20px;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .45);
	border-radius: 50%;
	background: transparent;
	color: #fff;
	font-size: 29px;
	line-height: 1;
	cursor: pointer;
}

/* Tablet */
@media (max-width: 1020px) {
	.hwi-hero { grid-template-columns: 60% 40%; }
	.hwi-hero::before { width: 60%; }
	.hwi-hero-copy { padding-inline: 42px; }
	.hwi-hero h1 { font-size: clamp(48px, 6.4vw, 68px); }
	.hwi-reading-grid { grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; }
	.hwi-route-module { padding-inline: 30px; }
	.hwi-route-module button { padding-inline: 8px; }
	.hwi-support-grid button { padding: 25px 20px; }
	.hwi-award-panel figure { min-height: 540px; }
}

/* Mobile */
@media (max-width: 760px) {
	:root {
		--hwi-copy: calc(100vw - 34px);
		--hwi-wide: calc(100vw - 34px);
	}

	.admin-bar .hwi-chapter-nav { top: 46px; }

	.hwi-hero {
		display: block;
		min-height: 0;
	}

	.hwi-hero::before {
		width: 100%;
	}

	.hwi-hero-copy {
		min-height: 700px;
		padding: 66px 17px 65px;
	}

	.hwi-hero-overline { margin-top: 24px; }
	.hwi-hero h1 { font-size: clamp(44px, 13vw, 59px); }
	.hwi-hero-deck { font-size: 17px; }
	.hwi-hero-meta { gap: 8px 15px; }
	.hwi-hero-photo { min-height: 72vh; }
	.hwi-hero-photo-shade { background: linear-gradient(0deg, rgba(17, 23, 27, .78), transparent 35%); }

	.hwi-hero-route {
		position: relative;
		right: auto;
		bottom: auto;
		left: auto;
		grid-template-columns: 1fr 1fr;
		margin: 0;
		padding: 21px 17px 32px;
		border-width: 1px 0 0;
	}

	.hwi-hero-route > div,
	.hwi-hero-route > div:first-child,
	.hwi-hero-route > div:nth-child(4) {
		padding: 12px;
		border-right: 1px solid rgba(255, 255, 255, .14);
		border-bottom: 1px solid rgba(255, 255, 255, .14);
	}

	.hwi-hero-route > div:nth-child(2),
	.hwi-hero-route > div:nth-child(4) {
		border-right: 0;
	}

	.hwi-hero-route > div:nth-child(3),
	.hwi-hero-route > div:nth-child(4) {
		border-bottom: 0;
	}

	.hwi-chapter-label { display: none; }
	.hwi-chapter-nav a:first-of-type { padding-left: 17px; }

	.hwi-story-section { padding: 78px 17px; }
	.hwi-reading-grid { grid-template-columns: 1fr; gap: 43px; }
	.hwi-pullquote,
	.hwi-portrait-photo { position: static; }
	.hwi-copy-after-grid { margin-top: 42px; }
	.hwi-section-intro { margin-bottom: 40px; }
	.hwi-section-intro h2 { font-size: 43px; }

	.hwi-route-module {
		margin-top: 56px;
		padding: 34px 18px 24px;
	}

	.hwi-route-heading { display: block; margin-bottom: 30px; }
	.hwi-route-heading h2 { margin-top: 10px; font-size: 37px; }
	.hwi-route-heading p { margin-top: 14px; }
	.hwi-route-rail { display: none; }
	.hwi-route-module ol { grid-template-columns: 1fr 1fr; margin: 0; }
	.hwi-route-module button { min-height: 118px; padding: 16px; border: 1px solid rgba(255, 255, 255, .11); }
	.hwi-route-module button::before { display: none; }
	.hwi-route-readout { grid-template-columns: 1fr; gap: 12px; margin-top: 9px; padding: 22px; }

	.hwi-number-line { grid-template-columns: 1fr 1fr; }
	.hwi-number { min-height: 150px; border-bottom: 1px solid var(--hwi-rule); }
	.hwi-number:nth-child(2) { border-right: 0; }
	.hwi-number:nth-child(3),
	.hwi-number:nth-child(4) { border-bottom: 0; }
	.hwi-number strong { font-size: 54px; }

	.hwi-reading-grid--light { padding: 28px 22px; }
	.hwi-support-heading { display: block; padding: 31px 24px; }
	.hwi-support-heading h3 { margin-top: 9px; }
	.hwi-support-heading p { margin-top: 13px; }
	.hwi-support-grid { grid-template-columns: 1fr; }
	.hwi-support-grid button { min-height: 145px; border-right: 0; border-bottom: 1px solid var(--hwi-rule); }
	.hwi-support-grid button:last-child { border-bottom: 0; }

	.hwi-cinematic-photo { width: 100vw; height: 56vh; min-height: 390px; margin: 58px -17px; }
	.hwi-cinematic-photo img { object-position: 63% center; }
	.hwi-full-throttle { min-height: 370px; }
	.hwi-portrait-photo,
	.hwi-portrait-photo img { min-height: 540px; }

	.hwi-bridge { padding: 32px 22px; }
	.hwi-bridge-heading { display: block; }
	.hwi-bridge-heading h3 { margin-top: 12px; text-align: left; }
	.hwi-bridge-line { display: none; }
	.hwi-bridge ol { grid-template-columns: 1fr 1fr; margin-top: 30px; }
	.hwi-bridge li,
	.hwi-bridge li:first-child,
	.hwi-bridge li:last-child { min-height: 170px; padding: 20px; border-right: 1px solid rgba(255, 255, 255, .14); border-bottom: 1px solid rgba(255, 255, 255, .14); }
	.hwi-bridge li:nth-child(2),
	.hwi-bridge li:nth-child(4) { border-right: 0; }
	.hwi-bridge li:nth-child(3),
	.hwi-bridge li:nth-child(4) { border-bottom: 0; }

	.hwi-award-panel { grid-template-columns: 1fr; width: 100vw; margin-inline: -17px; }
	.hwi-award-panel figure { min-height: 60vh; }
	.hwi-award-panel > div { padding: 45px 24px 55px; }
	.hwi-award-panel blockquote { font-size: 40px; }
	.hwi-route-complete { gap: 8px; padding-bottom: 55px; font-size: 8px; }

	.hwi-story-footer-inner { grid-template-columns: 1fr; gap: 35px; }
	.hwi-lightbox { padding: 60px 16px 20px; }
	.hwi-lightbox-close { top: 11px; right: 11px; }
}

@media (max-width: 420px) {
	.hwi-hero-copy { min-height: 730px; }
	.hwi-number-line,
	.hwi-route-module ol,
	.hwi-bridge ol { grid-template-columns: 1fr; }
	.hwi-number,
	.hwi-number:nth-child(2),
	.hwi-number:nth-child(3) { border-right: 0; border-bottom: 1px solid var(--hwi-rule); }
	.hwi-bridge li,
	.hwi-bridge li:first-child,
	.hwi-bridge li:nth-child(2),
	.hwi-bridge li:nth-child(3) { min-height: 135px; border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
	.hwi-route-complete { flex-wrap: wrap; }
	.hwi-route-complete i { flex-basis: 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.hwi-js .hwi-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.hwi-hero-route > div {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.hwi-hero-route > i b,
	.hwi-route-rail span,
	.hwi-bridge-line span,
	.hwi-cinematic-photo img,
	.hwi-portrait-photo img,
	.hwi-award-panel figure img {
		transition: none;
	}
}
