.qab-main {
	overflow: hidden;
	background: var(--q-paper);
}

.qab-eyebrow {
	margin: 0 0 12px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.09em;
	line-height: 1.2;
	text-transform: uppercase;
}

.qab-hero,
.qab-principles,
.qab-story,
.qab-team,
.qab-close {
	padding-right: var(--q-page-gutter);
	padding-left: var(--q-page-gutter);
}

.qab-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.18fr) minmax(350px, 0.82fr);
	min-height: min(750px, calc(100svh - 72px));
	background: var(--q-blue-deep);
	color: var(--q-cool-white);
}

.qab-hero-copy {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding-top: clamp(80px, 10vw, 150px);
	padding-bottom: clamp(64px, 8vw, 122px);
}

.qab-hero .qab-eyebrow { color: #a9d9e6; }

.qab-hero h1,
.qab-principles h2,
.qab-story h2,
.qab-team h2,
.qab-close h2 {
	margin: 0;
	font-family: var(--q-display);
	font-weight: 780;
	letter-spacing: -0.04em;
	line-height: 0.94;
	text-wrap: balance;
}

body.q-about-page .qab-hero h1 {
	max-width: 8.8ch;
	color: var(--q-cool-white);
	font-size: clamp(60px, 7.9vw, 96px);
}

.qab-hero-copy > p:not(.qab-eyebrow) {
	max-width: 43ch;
	margin: 30px 0 0;
	color: #c2dbe4;
	font-size: clamp(17px, 1.45vw, 21px);
	line-height: 1.5;
}

.qab-button {
	display: inline-flex;
	gap: 30px;
	align-items: center;
	justify-content: space-between;
	width: fit-content;
	min-width: 208px;
	margin-top: 38px;
	padding: 16px 18px;
	font-size: 13px;
	font-weight: 800;
	transition: transform 180ms var(--q-ease-out), background-color 180ms var(--q-ease-out), color 180ms var(--q-ease-out);
}

.qab-button--orange { background: var(--q-orange); color: #322000; }
.qab-button--light { background: var(--q-cool-white); color: var(--q-ink); }
.qab-button:hover,
.qab-button:focus-visible { transform: translate(3px, -3px); background: var(--q-ink); color: var(--q-cool-white); }

.qab-hero-facts {
	display: grid;
	grid-template-rows: repeat(3, 1fr);
	border-left: 1px solid rgba(195, 222, 229, 0.35);
}

.qab-hero-facts p {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin: 0;
	padding: clamp(24px, 3.8vw, 58px) 0 clamp(23px, 3.5vw, 48px) clamp(25px, 4vw, 66px);
	border-bottom: 1px solid rgba(195, 222, 229, 0.35);
}

.qab-hero-facts p:nth-child(1) { background: var(--q-teal); color: var(--q-blue-deep); }
.qab-hero-facts p:nth-child(2) { background: var(--q-oat); color: var(--q-ink); }
.qab-hero-facts p:nth-child(3) { border-bottom: 0; background: var(--q-sky); color: var(--q-blue-deep); }

.qab-hero-facts strong {
	font-family: var(--q-display);
	font-size: clamp(64px, 7.4vw, 110px);
	font-weight: 790;
	letter-spacing: -0.04em;
	line-height: 0.78;
}

.qab-hero-facts span {
	max-width: 12ch;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.2;
	text-transform: uppercase;
}

.qab-principles {
	padding-top: clamp(85px, 11vw, 166px);
	padding-bottom: clamp(85px, 11vw, 166px);
	background: var(--q-cool-white);
}

.qab-principles > header {
	display: grid;
	grid-template-columns: minmax(0, 0.72fr) minmax(380px, 1.28fr);
	gap: clamp(60px, 13vw, 235px);
	align-items: start;
	margin-bottom: clamp(54px, 8vw, 114px);
}

.qab-principles h2 { max-width: 10ch; font-size: clamp(48px, 5.6vw, 84px); }

.qab-principle-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	border: 1px solid var(--q-ink);
}

.qab-principle {
	display: flex;
	min-height: clamp(350px, 33vw, 475px);
	flex-direction: column;
	padding: clamp(25px, 3.2vw, 50px);
	border-right: 1px solid var(--q-ink);
}

.qab-principle:last-child { border-right: 0; }
.qab-principle--teal { background: var(--q-teal); color: var(--q-blue-deep); }
.qab-principle--oat { background: var(--q-oat); color: var(--q-ink); }
.qab-principle--sky { background: var(--q-sky); color: var(--q-blue-deep); }

.qab-principle > span,
.qab-timeline span,
.qab-close nav span {
	font-size: 11px;
	font-weight: 820;
	letter-spacing: 0.08em;
}

.qab-principle h3 {
	max-width: 8ch;
	margin: auto 0 0;
	font-family: var(--q-display);
	font-size: clamp(31px, 3.35vw, 51px);
	font-weight: 760;
	letter-spacing: -0.04em;
	line-height: 0.96;
}

.qab-principle p {
	max-width: 28ch;
	margin: 22px 0 0;
	font-size: 15px;
	font-weight: 620;
	line-height: 1.5;
}

.qab-principle--teal p { max-width: 32ch; }

.qab-principle a {
	display: flex;
	justify-content: space-between;
	margin-top: 28px;
	padding-top: 15px;
	border-top: 1px solid currentColor;
	font-size: 13px;
	font-weight: 800;
}

.qab-principle a:hover,
.qab-principle a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }

.qab-story {
	display: grid;
	grid-template-columns: minmax(0, 0.83fr) minmax(400px, 1.17fr);
	gap: clamp(58px, 12vw, 220px);
	padding-top: clamp(88px, 11vw, 168px);
	padding-bottom: clamp(0px, 1vw, 15px);
	background: var(--q-paper);
}

.qab-story h2 { max-width: 9ch; font-size: clamp(48px, 5.5vw, 84px); }

.qab-story-copy {
	padding-top: 9px;
	border-top: 1px solid var(--q-line);
}

.qab-story-copy p {
	max-width: 47ch;
	margin: 0 0 22px;
	color: var(--q-muted);
	font-size: clamp(16px, 1.35vw, 19px);
	line-height: 1.56;
}

.qab-story-copy p:first-child { color: var(--q-ink); font-weight: 660; }

.qab-timeline {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: clamp(30px, 4vw, 72px) 0 0;
	padding: 0;
	border-top: 1px solid var(--q-ink);
	list-style: none;
}

.qab-timeline li {
	display: flex;
	min-height: 222px;
	flex-direction: column;
	padding: 20px 24px 27px 0;
	border-right: 1px solid var(--q-line);
}

.qab-timeline li + li { padding-left: 24px; }
.qab-timeline li:last-child { border-right: 0; }
.qab-timeline span { color: var(--q-muted); }
.qab-timeline strong { margin-top: auto; font-family: var(--q-display); font-size: clamp(25px, 2.45vw, 37px); letter-spacing: -0.04em; line-height: 1; }
.qab-timeline small { max-width: 24ch; margin-top: 12px; color: var(--q-muted); font-size: 12px; font-weight: 640; line-height: 1.4; }

.qab-team {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(390px, 0.92fr);
	margin-top: clamp(84px, 11vw, 168px);
	padding-right: 0;
	background: var(--q-teal-deep);
	color: var(--q-cool-white);
}

.qab-team-image { min-height: 540px; overflow: hidden; background: var(--q-blue-deep); }
.qab-team-image img { display: block; width: 100%; height: 100%; min-height: 540px; object-fit: cover; object-position: center; filter: saturate(0.84) contrast(1.03); }

.qab-team-copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(70px, 9vw, 140px) var(--q-page-gutter);
}

.qab-team-copy .qab-eyebrow { color: #9ed6c0; }
body.q-about-page .qab-team h2 { max-width: 11ch; color: var(--q-cool-white); font-size: clamp(45px, 5vw, 76px); }
.qab-team-copy > p:not(.qab-eyebrow) { max-width: 42ch; margin: 29px 0 0; color: #c8e4d9; font-size: 17px; line-height: 1.56; }

.qab-close {
	padding-top: clamp(84px, 11vw, 165px);
	padding-bottom: clamp(84px, 11vw, 165px);
	background: var(--q-cool-white);
}

.qab-close h2 { max-width: 9ch; font-size: clamp(53px, 6.8vw, 96px); }
.qab-close nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1060px; margin: clamp(48px, 6vw, 86px) 0 0 auto; border: 1px solid var(--q-ink); }
.qab-close nav a { display: flex; min-height: 195px; flex-direction: column; justify-content: space-between; padding: 23px; border-right: 1px solid var(--q-ink); transition: transform 180ms var(--q-ease-out); }
.qab-close nav a:last-child { border-right: 0; }
.qab-close nav a:nth-child(1) { background: var(--q-blue); color: var(--q-cool-white); }
.qab-close nav a:nth-child(2) { background: var(--q-mint); color: var(--q-blue-deep); }
.qab-close nav a:nth-child(3) { background: var(--q-oat); color: var(--q-ink); }
.qab-close nav a:hover, .qab-close nav a:focus-visible { transform: translate(3px, -4px); }
.qab-close nav strong { margin-top: auto; font-family: var(--q-display); font-size: clamp(25px, 2.5vw, 39px); letter-spacing: -0.04em; line-height: 1; }
.qab-close nav small { margin-top: 10px; font-size: 12px; font-weight: 750; }

.q-about-page a:focus-visible { outline: 3px solid var(--q-orange); outline-offset: 4px; }

.q-about-page .q-wordmark,
.q-about-page .q-nav a,
.q-about-page .q-cart-link,
.q-about-page .q-footer-links a,
.q-about-page .qab-principle a {
	display: inline-flex;
	min-width: 44px;
	min-height: 44px;
	align-items: center;
	justify-content: center;
}

.q-about-page .q-footer-links a {
	color: var(--q-cool-white);
}

.q-about-page .q-skip-link {
	min-height: 44px;
}

@media (max-width: 900px) {
	.qab-hero,
	.qab-principles > header,
	.qab-story,
	.qab-team { grid-template-columns: 1fr; }
	.qab-hero { min-height: 0; }
	.qab-hero-copy { min-height: 590px; }
	.qab-hero-facts { grid-template-columns: repeat(3, 1fr); grid-template-rows: 1fr; border-top: 1px solid rgba(195, 222, 229, 0.35); border-left: 0; }
	.qab-hero-facts p { min-height: 190px; padding: 24px; border-right: 1px solid rgba(0, 47, 76, 0.25); border-bottom: 0; }
	.qab-hero-facts p:last-child { border-right: 0; }
	.qab-principles > header { gap: 26px; }
	.qab-story { gap: 42px; }
	.qab-team { padding-right: var(--q-page-gutter); }
	.qab-team-image { margin-left: calc(var(--q-page-gutter) * -1); margin-right: calc(var(--q-page-gutter) * -1); }
}

@media (max-width: 640px) {
	.qab-hero,
	.qab-principles,
	.qab-story,
	.qab-team,
	.qab-close { padding-right: 20px; padding-left: 20px; }
	.qab-hero-copy { min-height: 535px; padding-top: 75px; padding-bottom: 62px; }
	.qab-hero h1 { font-size: clamp(53px, 15vw, 75px); }
	.qab-hero-facts { grid-template-columns: 1fr; }
	.qab-hero-facts p { min-height: 145px; padding: 22px 20px; border-right: 0; border-bottom: 1px solid rgba(0, 47, 76, 0.25); }
	.qab-hero-facts strong { font-size: 63px; }
	.qab-principles h2,
	.qab-story h2,
	.qab-team h2 { font-size: clamp(42px, 12vw, 59px); }
	.qab-principle-grid,
	.qab-timeline,
	.qab-close nav { grid-template-columns: 1fr; }
	.qab-principle { min-height: 300px; border-right: 0; border-bottom: 1px solid var(--q-ink); }
	.qab-principle:last-child { border-bottom: 0; }
	.qab-principle h3 { font-size: 39px; }
	.qab-timeline li,
	.qab-timeline li + li { min-height: 165px; padding: 19px 0 25px; border-right: 0; border-bottom: 1px solid var(--q-line); }
	.qab-timeline li:last-child { border-bottom: 0; }
	.qab-team { padding-right: 20px; }
	.qab-team-image { min-height: 345px; margin-right: -20px; margin-left: -20px; }
	.qab-team-image img { min-height: 345px; }
	.qab-team-copy { padding: 68px 0; }
	.qab-close h2 { font-size: clamp(50px, 14vw, 70px); }
	.qab-close nav { margin-left: 0; }
	.qab-close nav a { min-height: 145px; border-right: 0; border-bottom: 1px solid var(--q-ink); }
	.qab-close nav a:last-child { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.qab-button,
	.qab-close nav a { transition: none; }
}