main { padding: 0; }
.cat_text_large { font-size: 18px; }
.cat_text_large p { line-height: 1.5em; }
#column-left, .column-left { max-width: 100%; }
.content-container { max-width: 1200px; margin: 0 auto; padding: 4rem 2rem; box-sizing: border-box; }

main .cat_text_large h1 { padding: 0; font-size: 40px; line-height: 1.25em; color: #265897; }
.cat_text_large h2, .cat_text_large h3 { font-size: 1.75rem; line-height: 1.125em; color: #265897; }

.cat_text_large a.button { opacity: 1.0; padding: .75rem 4rem; border-radius: 8px; text-align: center; }

.intro { margin: 0 calc(50% - 50vw); background: linear-gradient(to right, #E5EEF9, #fff); }
.intro .content-container { position: relative; background: url('/images/quality/p1/banner-bg.webp?v=1') 120% 0 no-repeat; mix-blend-mode: multiply; }
.intro .content-container > * { position: relative; max-width: 380px; }

ul.cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; margin: 2rem -.5rem 0 -.5rem; padding: 0; list-style: none; }
ul.cards li { padding: 1.5rem; border-radius: .5rem; background: #e5eff8; }
ul.cards h3 { margin-bottom: .75rem; font-size: 1.5rem; color: #006cb6; }
ul.cards p { margin-bottom: 0; }

div.testing { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; background: #e5eff8; 
			  counter-reset: testing-counter; }
div.testing li { background: #fff; counter-increment: testing-counter; }
div.testing h3 { color: #265897; }
div.testing h3:before { content: counter(testing-counter); display: inline-block; width: 2.5rem; height: 2.5rem; line-height: 2.5rem; margin-right: .75rem; color: #fff; 
						border-radius: 50%; background: #006cb6; text-align: center; }

.nsf-wrapper { display: flex; gap: 4rem; align-items: center; }
.nsf-wrapper div + div { flex: 1; }
.nsf-wrapper h3 { margin: 1rem 0 1.5rem 0; font-size: 1.75rem; }

@media (max-width: 1200px) {
	.intro .content-container { background-position: 40vw 0; }
}
@media (max-width: 960px) {
}
@media (max-width: 840px) {
	.cat_text_large h1 { font-size: 36px; }
}
@media (max-width: 600px) {
	.intro .content-container { background-position: 0 0; }
	.intro .content-container:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #f6fbfe; opacity: .9; }
	.intro .content-container > * { max-width: 100%; }
	main .cat_text_large h1 { font-size: 32px; }

	ul.cards { grid-template-columns: 1fr; }
	ul.cards li { text-align: center; }
	
	div.testing li { text-align: left; }
	div.testing h3 { margin-left: 3.25rem; text-indent: -3.25rem; }
	div.testing h3:before { text-indent: 0; }
	
	.nsf-wrapper { flex-direction: column; }
}