.spo-about { overflow: hidden; background: #fff; color: #111a30; }
.spo-about__eyebrow { margin: 0 0 18px; color: #59baff; font-size: 11px; font-weight: 800; line-height: 1.4; letter-spacing: .18em; text-transform: uppercase; }
.spo-about h1, .spo-about h2 { font-family: "Space Grotesk", Arial, sans-serif; }
.spo-about-hero { position: relative; isolation: isolate; min-height: min(930px, 90svh); background: #060d20; color: #fff; }
.spo-about-hero__image { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.spo-about-hero__shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgb(3 9 24 / 96%) 0%, rgb(3 9 24 / 82%) 38%, rgb(3 9 24 / 22%) 70%, rgb(3 9 24 / 12%) 100%); }
.spo-about-hero__inner { display: flex; flex-direction: column; justify-content: center; width: min(calc(100% - 64px), 1480px); min-height: min(930px, 90svh); padding-top: 88px; margin-inline: auto; }
.spo-about-hero h1 { max-width: 700px; margin: 0; color: #fff; font-size: clamp(56px, 5.5vw, 84px); font-weight: 650; line-height: .91; letter-spacing: -.055em; text-transform: uppercase; }
.spo-about-hero__copy { max-width: 630px; margin: 34px 0 0; color: #d0daeb; font-size: clamp(15px, 1.3vw, 18px); line-height: 1.75; }
.spo-about__button { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; min-height: 52px; padding: 0 24px; margin-top: 30px; border: 1px solid #59baff; border-radius: 4px; background: rgb(8 31 64 / 50%); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; transition: background-color 180ms ease, color 180ms ease; }
.spo-about__button:hover, .spo-about__button:focus-visible { background: #59baff; color: #061126; }
.spo-about-ledger { background: #061126; color: #fff; }
.spo-about-ledger__inner { display: grid; grid-template-columns: repeat(4, 1fr); width: min(calc(100% - 64px), 1320px); margin-inline: auto; }
.spo-about-ledger__inner > div { display: grid; place-items: center; min-height: 154px; padding: 28px; border-left: 1px solid rgb(89 186 255 / 32%); text-align: center; }
.spo-about-ledger__inner > div:first-child { border-left: 0; }
.spo-about-ledger strong { display: block; color: #fff; font-family: "Space Grotesk", Arial, sans-serif; font-size: clamp(34px, 3vw, 48px); font-weight: 600; line-height: 1; }
.spo-about-ledger span { display: block; margin-top: 8px; color: #c4cfe1; font-size: 12px; line-height: 1.35; }
.spo-about-mission { padding: clamp(90px, 9vw, 150px) 32px; background: #fff; }
.spo-about-mission__inner { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(64px, 8vw, 130px); width: min(100%, 1320px); margin-inline: auto; }
.spo-about-mission__content h2 { max-width: 570px; margin: 0 0 30px; color: #07142d; font-size: clamp(42px, 4vw, 60px); font-weight: 600; line-height: 1; letter-spacing: -.05em; text-transform: none; }
.spo-about-mission__content > p:not(.spo-about__eyebrow) { max-width: 610px; margin: 0 0 20px; color: #455269; font-size: 15px; line-height: 1.8; }
.spo-about-mission__canada { display: flex; align-items: center; gap: 14px; margin-top: 36px; color: #0b4387; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .035em; }
.spo-about-mission__canada img { width: 42px; height: 42px; padding: 9px; border: 1px solid #59baff; border-radius: 50%; filter: brightness(0) saturate(100%) invert(58%) sepia(88%) saturate(1734%) hue-rotate(181deg) brightness(102%); }
.spo-about-mission__visual { margin: 0; overflow: hidden; border-radius: 18px; }
.spo-about-mission__visual img { display: block; width: 100%; aspect-ratio: 6 / 5; object-fit: cover; }
.spo-about-testing { padding: clamp(90px, 9vw, 150px) 32px; background: #060d20; color: #fff; }
.spo-about-testing__inner { display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: clamp(64px, 8vw, 132px); width: min(100%, 1320px); margin-inline: auto; }
.spo-about-testing__intro h2 { max-width: 620px; margin: 0 0 24px; color: #fff; font-size: clamp(42px, 4vw, 60px); font-weight: 600; line-height: 1; letter-spacing: -.05em; }
.spo-about-testing__intro > p:not(.spo-about__eyebrow) { max-width: 620px; margin: 0; color: #b8c4d8; font-size: 15px; line-height: 1.8; }
.spo-about-testing__intro > img { display: block; width: 100%; max-height: 520px; margin-top: 46px; border-radius: 16px; object-fit: cover; object-position: center; }
.spo-about-testing__steps { padding: 0; margin: 0; list-style: none; }
.spo-about-testing__steps li { position: relative; display: grid; grid-template-columns: 66px 1fr; gap: 26px; padding: 30px 0; border-top: 1px solid rgb(129 178 232 / 20%); }
.spo-about-testing__steps li:first-child { border-top: 0; }
.spo-about-testing__steps li > span { color: #59baff; font-family: "Space Grotesk", Arial, sans-serif; font-size: 18px; font-weight: 650; }
.spo-about-testing__steps h3 { margin: 0; color: #fff; font-family: "Space Grotesk", Arial, sans-serif; font-size: clamp(22px, 2vw, 29px); font-weight: 550; line-height: 1.15; }
.spo-about-testing__steps p { max-width: 390px; margin: 9px 0 0; color: #aebbd0; font-size: 14px; line-height: 1.65; }

@media (max-width: 900px) {
	.spo-about-hero, .spo-about-hero__inner { min-height: 760px; }
	.spo-about-mission__inner, .spo-about-testing__inner { grid-template-columns: 1fr; }
	.spo-about-mission__visual { grid-row: 1; }
	.spo-about-testing__steps { padding-top: 8px; }
}

@media (max-width: 640px) {
	.spo-about-hero, .spo-about-hero__inner { min-height: 720px; }
	.spo-about-hero__inner { width: calc(100% - 36px); padding-top: 72px; }
	.spo-about-hero__image { object-position: 68% center; }
	.spo-about-hero__shade { background: linear-gradient(90deg, rgb(3 9 24 / 97%) 0%, rgb(3 9 24 / 83%) 64%, rgb(3 9 24 / 30%) 100%); }
	.spo-about-hero h1 { max-width: 92%; font-size: clamp(46px, 13.5vw, 66px); }
	.spo-about-hero__copy { max-width: 95%; margin-top: 25px; font-size: 13px; }
	.spo-about-ledger__inner { grid-template-columns: repeat(2, 1fr); width: 100%; }
	.spo-about-ledger__inner > div { min-height: 124px; padding: 20px 12px; border-top: 1px solid rgb(89 186 255 / 32%); }
	.spo-about-ledger__inner > div:nth-child(odd) { border-left: 0; }
	.spo-about-mission, .spo-about-testing { padding: 78px 18px; }
	.spo-about-mission__inner, .spo-about-testing__inner { gap: 48px; }
	.spo-about-mission__content h2, .spo-about-testing__intro h2 { font-size: 44px; }
	.spo-about-mission__visual { border-radius: 12px; }
	.spo-about-testing__intro > img { min-height: 360px; margin-top: 34px; object-position: 42% center; }
	.spo-about-testing__steps li { grid-template-columns: 46px 1fr; gap: 16px; padding: 24px 0; }
}