@charset "utf-8";

/* NENA About Us page. Uses the site's existing rem, type and utility system. */
.n-ab-page {
	--n-ab-navy: #082d63;
	--n-ab-blue: var(--theme-color);
	--n-ab-orange: var(--sec-theme-color);
	--n-ab-ink: #10274a;
	--n-ab-text: #5a6678;
	--n-ab-light: #f4f7fb;
	--n-ab-line: #dce5ef;
	--n-ab-radius: .08rem;
	--n-ab-btn-radius: .06rem;
	color: var(--n-ab-ink);
	overflow: hidden
}

.n-ab-page h1,
.n-ab-page h2,
.n-ab-page h3 {
	letter-spacing: 0;
	text-wrap: balance
}

.n-ab-page img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover
}

.n-ab-page video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	background: var(--n-ab-navy)
}

.n-ab-section-head {
	max-width: 8.4rem;
	margin-left: auto;
	margin-right: auto
}

.n-ab-section-desc {
	max-width: 7.8rem;
	margin-left: auto;
	margin-right: auto
}

/* Hero */
.n-ab-hero {
	position: relative;
	isolation: isolate;
	min-height: 6.4rem;
	display: flex;
	align-items: center;
	background: var(--n-ab-navy);
	color: #fff
}

.n-ab-hero-bg,
.n-ab-hero-mask {
	position: absolute;
	inset: 0
}

.n-ab-hero-bg {
	z-index: -2;
	object-position: center
}

.n-ab-hero-mask {
	z-index: -1;
	background: linear-gradient(90deg, rgba(4, 32, 76, .94) 0%, rgba(4, 32, 76, .76) 45%, rgba(4, 32, 76, .2) 100%)
}

.n-ab-hero-inner {
	padding-top: .8rem;
	padding-bottom: .8rem
}

.n-ab-crumb {
	margin-bottom: .25rem;
	color: rgba(255, 255, 255, .72)
}

.n-ab-crumb a:hover {
	color: #fff
}

.n-ab-hero h1 {
	max-width: 8.5rem;
	color: #fff;
	line-height: 1.08
}

.n-ab-hero-desc {
	max-width: 7.2rem;
	margin-top: .25rem;
	color: rgba(255, 255, 255, .88)
}

.n-ab-actions {
	gap: .14rem;
	margin-top: .35rem
}

.n-ab-btn-outline,
.n-ab-btn-white {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: .5rem;
	padding: .12rem .3rem;
	border-radius: var(--n-ab-btn-radius);
	font-size: var(--f16);
	font-weight: 700;
	transition: all .25s ease
}

.n-ab-btn-outline {
	border: .01rem solid rgba(255, 255, 255, .72);
	color: #fff
}

.n-ab-btn-outline:hover {
	border-color: #fff;
	background: #fff;
	color: var(--n-ab-blue)
}

/* Profile */
.n-ab-profile {
	background: #fff
}

.n-ab-profile-grid {
	display: grid;
	grid-template-columns: minmax(0, .96fr) minmax(5.2rem, 1.04fr);
	gap: .9rem;
	align-items: center
}

.n-ab-lead {
	max-width: 7rem
}

.n-ab-copy {
	display: grid;
	gap: .15rem;
	max-width: 7.4rem
}

.n-ab-product-scope {
	display: flex;
	flex-wrap: wrap;
	gap: .08rem
}

.n-ab-product-scope span {
	padding: .09rem .14rem;
	border: .01rem solid var(--n-ab-line);
	border-radius: var(--n-ab-btn-radius);
	font-size: var(--f14);
	color: var(--n-ab-ink);
	background: #fff
}

.n-ab-video-frame {
	aspect-ratio: 4:3;
	overflow: hidden;
	border-radius: var(--n-ab-radius);
	background: var(--n-ab-navy)
}

.n-ab-media-caption {
	padding-top: .12rem
}

.n-ab-facts {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(.28rem, 3vw, .72rem);
	padding: .42rem 0 .36rem
}

.n-ab-fact {
	display: grid;
	grid-template-columns: .68rem minmax(0, 1fr);
	grid-template-rows: auto auto;
	column-gap: .22rem;
	align-items: center;
	min-width: 0
}

.n-ab-fact-icon {
	grid-row: 1 / 3;
	width: .64rem;
	height: .64rem;
	color: var(--n-ab-blue);
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round
}

.n-ab-fact-main {
	display: flex;
	align-items: center;
	gap: .18rem;
	min-width: 0
}

.n-ab-facts dt {
	flex: 0 0 auto;
	font-size: clamp(.42rem, 3.4vw, .62rem);
	line-height: 1;
	color: var(--n-ab-ink);
	white-space: nowrap
}

.n-ab-facts dt em {
	margin-left: .05rem;
	font-family: Arial, sans-serif;
	font-size: .42em;
	font-style: normal;
	font-weight: 700;
	color: var(--n-ab-orange)
}

.n-ab-facts dt sup {
	font-size: .65em;
	vertical-align: super
}

.n-ab-fact-line {
	flex: 0 0 .95rem;
	width: .95rem;
	height: .01rem;
	background: var(--n-ab-line)
}

.n-ab-facts dd {
	grid-column: 2;
	margin-top: .14rem;
	line-height: 1.4
}

/* Shared slider controls */
.n-ab-cert-prev,
.n-ab-cert-next,
.n-ab-market-prev,
.n-ab-market-next {
	width: .44rem !important;
	height: .44rem !important;
	margin-top: -.22rem !important;
	border: .01rem solid var(--n-ab-line);
	border-radius: 50%;
	background: #fff;
	color: var(--n-ab-blue)
}

.n-ab-cert-prev,
.n-ab-market-prev {
	left: 0 !important
}

.n-ab-cert-next,
.n-ab-market-next {
	right: 0 !important
}

.n-ab-cert-prev:after,
.n-ab-cert-next:after,
.n-ab-market-prev:after,
.n-ab-market-next:after {
	font-size: .15rem !important;
	font-weight: 700
}

.n-ab-factory-pagination,
.n-ab-cert-pagination,
.n-ab-market-pagination {
	bottom: 0 !important
}

.n-ab-page .swiper-pagination-bullet {
	width: .07rem;
	height: .07rem;
	background: var(--n-ab-blue);
	opacity: .2
}

.n-ab-page .swiper-pagination-bullet-active {
	width: .24rem;
	border-radius: .1rem;
	opacity: 1
}

/* Factory */
.n-ab-factory {
	background: var(--n-ab-light)
}

.n-ab-factory-wrap {
	position: relative;
	padding: 0 0 .42rem
}

.n-ab-factory-swiper {
	overflow: hidden;
	border-radius: var(--n-ab-radius)
}

.n-ab-factory-slide {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(3.8rem, .75fr);
	min-height: 5.1rem;
	background: #fff
}

.n-ab-factory-img {
	min-width: 0
}

.n-ab-factory-copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: .56rem;
	background: var(--n-ab-navy);
	color: rgba(255, 255, 255, .82)
}

.n-ab-factory-copy h3 {
	margin: .18rem 0 .22rem;
	color: #fff;
	line-height: 1.12
}

.n-ab-slide-index {
	width: .46rem;
	height: .32rem;
	border-bottom: .02rem solid var(--n-ab-orange);
	color: #fff;
	font-weight: 700
}

/* Quality and certificates */
.n-ab-quality {
	background: #fff
}

.n-ab-quality-grid {
	display: grid;
	grid-template-columns: minmax(0, .9fr) minmax(5.4rem, 1.1fr);
	gap: .8rem;
	align-items: center
}

.n-ab-quality-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .12rem .24rem
}

.n-ab-quality-list li {
	display: flex;
	gap: .14rem;
	padding: .16rem 0;
	border-bottom: .01rem solid var(--n-ab-line)
}

.n-ab-quality-list i {
	flex: 0 0 .42rem;
	width: .42rem;
	height: .42rem;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: #eaf2fc;
	color: var(--n-ab-blue);
	font-size: .18rem
}

.n-ab-quality-list strong,
.n-ab-quality-list span {
	display: block;
	line-height: 1.35
}

.n-ab-quality-list span {
	margin-top: .06rem
}

.n-ab-quality-media {
	aspect-ratio: 16/10;
	overflow: hidden;
	border-radius: var(--n-ab-radius)
}

.n-ab-cert-block {
	padding-top: .7rem;
	border-top: .01rem solid var(--n-ab-line)
}

.n-ab-cert-wrap {
	position: relative;
	padding: 0 .62rem .42rem
}

.n-ab-cert-swiper {
	overflow: hidden
}

.n-ab-cert-swiper .swiper-slide {
	height: auto
}

.n-ab-cert-card {
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: .18rem;
	border: .01rem solid var(--n-ab-line);
	border-radius: var(--n-ab-radius);
	background: #fff;
	transition: border-color .25s ease, transform .25s ease
}

.n-ab-cert-card:hover {
	border-color: var(--n-ab-blue);
	transform: translateY(-.04rem)
}

.n-ab-cert-img {
	height: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--n-ab-light);
	padding: 0.15rem 0;
	overflow: hidden
}

.n-ab-cert-img img {
	object-fit: contain
}

.n-ab-cert-card strong {
	margin-top: .16rem;
	color: var(--n-ab-ink);
	line-height: 1.35
}

.n-ab-cert-card span {
	margin-top: .05rem
}

/* Culture */
.n-ab-culture {
	background: var(--n-ab-light)
}

.n-ab-culture-grid {
	display: grid;
	grid-template-columns: minmax(5rem, .95fr) minmax(0, 1.05fr);
	gap: .85rem;
	align-items: center
}

.n-ab-culture-media {
	height: 5.6rem;
	overflow: hidden;
	border-radius: var(--n-ab-radius)
}

.n-ab-values {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .16rem
}

.n-ab-values article {
	display: flex;
	gap: .16rem;
	min-height: 1.65rem;
	padding: .22rem;
	border: .01rem solid var(--n-ab-line);
	border-radius: var(--n-ab-radius);
	background: #fff
}

.n-ab-values article>i {
	flex: 0 0 .44rem;
	width: .44rem;
	height: .44rem;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: #eaf2fc;
	color: var(--n-ab-blue);
	font-size: .2rem
}

/* Exhibitions */
.n-ab-market {
	background: #fff
}

.n-ab-market-wrap {
	position: relative;
	padding: 0 .62rem .42rem
}

.n-ab-market-swiper {
	overflow: hidden
}

.n-ab-market-swiper .swiper-slide {
	height: auto
}

.n-ab-market-card {
	height: 100%;
	overflow: hidden;
	border-radius: var(--n-ab-radius);
	background: #fff;
	border: .01rem solid var(--n-ab-line)
}

.n-ab-market-img {
	aspect-ratio: 16/10;
	overflow: hidden
}

.n-ab-market-img img {
	transition: transform .45s ease
}

.n-ab-market-card:hover .n-ab-market-img img {
	transform: scale(1.035)
}

.n-ab-market-copy {
	padding: .22rem
}

/* OEM and CTA */
.n-ab-oem {
	background: var(--n-ab-light)
}

.n-ab-oem-grid {
	display: grid;
	grid-template-columns: minmax(0, .92fr) minmax(5.2rem, 1.08fr);
	gap: .8rem;
	align-items: center
}

.n-ab-oem-copy {
	padding: .35rem 0
}

.n-ab-oem-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .12rem .22rem
}

.n-ab-oem-list li {
	position: relative;
	padding-left: .2rem;
	line-height: 1.5;
	color: var(--n-ab-ink)
}

.n-ab-oem-list li:before {
	content: "";
	position: absolute;
	left: 0;
	top: .1rem;
	width: .07rem;
	height: .07rem;
	border-radius: 50%;
	background: var(--n-ab-orange)
}

.n-ab-oem-media {
	min-height: 4.8rem;
	overflow: hidden;
	border-radius: var(--n-ab-radius)
}

.n-ab-cta {
	padding: .7rem 0;
	background: var(--n-ab-navy);
	color: rgba(255, 255, 255, .82)
}

.n-ab-cta-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: .5rem;
	align-items: center
}

.n-ab-cta h2 {
	color: #fff
}

.n-ab-btn-white {
	min-width: 1.7rem;
	background: #fff;
	color: var(--n-ab-blue);
	white-space: nowrap
}

.n-ab-btn-white:hover {
	background: var(--n-ab-orange);
	color: #fff
}

@media screen and (max-width:1200px) {

	.n-ab-profile-grid,
	.n-ab-quality-grid,
	.n-ab-culture-grid,
	.n-ab-oem-grid {
		gap: .5rem
	}

	.n-ab-facts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: .36rem .6rem
	}


	.n-ab-factory-slide {
		grid-template-columns: minmax(0, 1.35fr) minmax(3.4rem, .65fr)
	}
}

@media screen and (max-width:900px) {
	.n-ab-hero {
		min-height: 5.8rem
	}

	.n-ab-profile-grid,
	.n-ab-quality-grid,
	.n-ab-culture-grid,
	.n-ab-oem-grid {
		grid-template-columns: 1fr
	}

	.n-ab-profile-media {
		order: -1
	}

	.n-ab-factory-slide {
		grid-template-columns: 1fr
	}

	.n-ab-factory-img {
		min-height: 3.8rem
	}

	.n-ab-factory-copy {
		min-height: 2.8rem;
		padding: .4rem
	}

	.n-ab-culture-media,
	.n-ab-oem-media {
		min-height: 4rem
	}

	.n-ab-cta-grid {
		grid-template-columns: 1fr
	}
}

@media screen and (max-width:767px) {
	.n-ab-hero {
		min-height: 5.3rem
	}

	.n-ab-hero-mask {
		background: rgba(4, 32, 76, .82)
	}

	.n-ab-hero-inner {
		padding-top: .65rem;
		padding-bottom: .65rem
	}

	.n-ab-hero h1 {
		font-size: .52rem
	}

	.n-ab-actions {
		display: grid;
		grid-template-columns: 1fr
	}

	.n-ab-actions a {
		width: 100%
	}

	.n-ab-video-frame {
		aspect-ratio: 16/11
	}

	.n-ab-product-scope {
		gap: .1rem
	}

	.n-ab-product-scope span {
		padding: .12rem .16rem
	}

	.n-ab-facts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: .3rem .24rem;
		padding: .3rem 0
	}

	.n-ab-fact {
		display: flex;
		flex-direction: column;
		align-items: flex-start
	}

	.n-ab-fact-icon {
		width: .8rem;
		height: .8rem
	}

	.n-ab-fact-main {
		width: 100%;
		gap: .1rem;
		margin-top: .14rem
	}

	.n-ab-fact-line {
		flex-basis: .36rem;
		width: .36rem
	}

	.n-ab-facts dt {
		font-size: .58rem
	}

	.n-ab-facts dd {
		margin-top: .1rem;
	}

	.n-ab-cert-wrap,
	.n-ab-market-wrap {
		padding-right: .48rem;
		padding-left: .48rem
	}

	.n-ab-cert-prev,
	.n-ab-cert-next,
	.n-ab-market-prev,
	.n-ab-market-next {
		width: .72rem !important;
		height: .72rem !important;
		margin-top: -.36rem !important
	}

	.n-ab-factory-copy {
		padding: .3rem
	}

	.n-ab-quality-list,
	.n-ab-values,
	.n-ab-oem-list {
		grid-template-columns: 1fr
	}

	.n-ab-quality-media,
	.n-ab-culture-media,
	.n-ab-oem-media {
		min-height: 3.1rem
	}

	.n-ab-cert-img {
		height: 5rem
	}

	.n-ab-market-copy {
		padding: .18rem
	}

	.n-ab-cta {
		padding: .55rem 0
	}

	.n-ab-btn-white {
		width: 100%
	}
	
	.n-ab-btn-outline, .n-ab-btn-white{
		min-height: 0.8rem;
	}
}

@media(prefers-reduced-motion:reduce) {

	.n-ab-page *,
	.n-ab-page *:before,
	.n-ab-page *:after {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important
	}
}

/* Keep every factory slide image at the same presentation ratio. */
.n-ab-factory-slide {
	min-height: 0;
	align-items: stretch
}

.n-ab-factory-img {
	width: 100%;
	min-height: 0 !important;
	aspect-ratio: 16/9;
	overflow: hidden;
	align-self: start
}

.n-ab-factory-img img {
	width: 100%;
	height: 100%;
	object-fit: cover
}

.n-ab-factory-copy {
	height: 100%
}