html, body { overflow-x: hidden!important; }
h1, h2, h3, h4, h5, h6 {
}
p { margin-block-end: 0 !important; } /*remove excess spacing for accuracy*/
/* ul, ol { padding-inline-start: 18px !important; } */
/* .elementor-widget-text-editor a { color: #0F366F !important } */
.elementor-widget-text-editor ul li {
	margin-block-end: 6px;
}
b, strong {
    font-weight: 800 !important;
}
header ul, header ol { padding-inline-start: unset !important; }
footer ul, footer ol { padding-inline-start: unset !important; }
ul.elementor-nav-menu--dropdown a, 
ul.elementor-nav-menu--dropdown a:focus, 
ul.elementor-nav-menu--dropdown a:hover {
	border-inline-start: unset !important;
}
.justify-start { justify-content: start !important; }
table caption+thead tr:first-child td,
table caption+thead tr:first-child th,
table colgroup+thead tr:first-child td,
table colgroup+thead tr:first-child th,
table thead:first-child tr:first-child td,
table thead:first-child tr:first-child th {
	border-block-start: unset !important;
}
body button:hover,
body button:focus,
body button:visited{
	background-color: inherit;
	color: inherit;
}
:root {
	--nanofilm-blue: #0F366F;
}
a {
	color: var(--nanofilm-blue);
}

.show-overlay {
	margin-top: auto;
}
/* .nti-border-btn a.elementor-button {
	border: 1px solid transparent;
} */
.nti-border-btn.elementor-widget-button,
.nti-circle-btn.elementor-widget-button {
	margin-top: auto !important;
}
.nti-border-btn.not-btm.elementor-widget-button {
	margin-top: unset !important;
}
.nti-border-btn a.elementor-button:hover,
a.nti-btn-primary:hover,
.nti-circle-btn a:hover,
.nti-overlay-btn a:hover {
	box-shadow: inset 0 0 0 1px #0F366F;
}

.nti-cont.e-con {
	--padding-top: 64px;
    --padding-bottom: 64px;
	--padding-left: 36px;
    --padding-right: 36px;
}
.nti-cont.pt-0.e-con {
	--padding-top: 0;
}
.nti-cont.pb-0.e-con {
	--padding-bottom: 0;
}
.hsform-cont.e-con {
	max-height: 85vh;
}
.img-16-9.elementor-widget-image img {
	aspect-ratio: 16 / 9;
    object-fit: cover;
}
#nti-nav-contact-1300 {
	display: none;
}

.nti-header-contact-btn a {
	box-shadow: inset 0 0 0 1px #0F366F !important;
}
.nti-header-contact-btn a:hover {
	box-shadow: none !important;
}
.nti-header-contact-btn span {
	white-space: nowrap;
}
.nti-btn-primary {
	display:inline-block;
	background-color: transparent;
	font-family: "Manrope", Sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 150%;
	fill: #FFFFFF;
	color: #FFFFFF !important;
	background-image: linear-gradient(190deg, var(--e-global-color-accent) 0%, var(--e-global-color-primary) 100%);
	transition-duration: 0.5s;
	border-style: none;
	border-radius: 50px 50px 50px 50px;
	padding: 14px 58px 14px 58px;
	white-space: nowrap;
}
.nti-btn-primary:hover {
	background-color: transparent;
	color: var(--e-global-color-primary) !important;
	background-image: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
}
.nti-btt .elementor-icon-wrapper,
.nti-sticky-btn {
	width: 42px !important;
	aspect-ratio: 1 / 1;
	cursor: pointer;
}
.nti-btt .elementor-icon-wrapper .elementor-icon {
	top: 20%;
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.nti-sticky-wrapper {
	width: auto !important;
}
.nti-sticky-btn .elementor-icon-wrapper {
	position: relative;
	height: 100%;
}
.nti-sticky-btn .elementor-icon-wrapper .elementor-icon {
	position: relative;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}


.nti-circle-btn a svg {
	width: 12px;
	height: 12px;
    transition: transform 0.3s ease;
}
.nti-circle-btn a svg path {
    transition: fill 0.3s ease;
}
.nti-circle-btn a:hover svg {
	transform: translate(2px, -2px);
}
.nti-circle-btn a:hover svg path {
	fill: #0F366F;
}

/* --------------------- Filters as Tabs --------------------- */
.nti-news-filter .e-filter {
	border: 2px solid transparent;
	border-radius: 100px;
	background: linear-gradient(white, white) padding-box, linear-gradient(195deg, #37C0EB, #0F366F) border-box;
	padding: 2px;
	margin: 0 auto;
}
.nti-news-filter .e-filter-item {
	min-width: 145px;
}
/* --------------------- Filter as Tabs --------------------- */

/* --------------------- Sticky Header --------------------- */
.nti-header a,
.nti-header p,
.nti-header span {
	transition: color 0.3s ease;
}
.nti-header svg * {
	transition: fill 0.3s ease;
}
.nti-header.initial a,
.nti-header.initial p,
.nti-header.initial span,
.nti-header.initial .nti-header-contact-btn a:hover span {
	color: #ffffff !important;
}

/* .nti-header.initial svg *, */
.nti-header.initial .nti-header-contact-btn a:hover svg * {
	fill: #ffffff !important;
}
.nti-header:not(.initial) {
	background-color: #0F366F !important;
}
.nti-header .nti-header-contact-btn span {
	color: #0F366F !important;
}
.nti-header .nti-header-contact-btn svg * {
	fill: #0F366F !important;
}
.nti-l1 a,
.nti-header:not(.initial) p,
.nti-header:not(.initial) .nti-header-contact-btn a:hover span {
	color: #FFF !important;
}

.nti-mega-inner a {
	color: #0F366F;
	display: inline-block;
	width: 100%;
}
.nti-header:not(.initial) .nti-header-contact-btn a:hover svg * {
	fill: #FFF !important;
}
.nti-header .nti-header-contact-btn a {
	background-color: #ffffff !important;
	background-image: none !important;
}
.nti-header .nti-header-contact-btn a:hover {
	background-color: unset !important;
}

.nti-header .nti-header-nav a.elementor-sub-item {
	color: #FFF !important;
}

.nti-header .nti-header-search .elementor-icon-wrapper {
	display: flex;
}
.nti-header .nti-header-nav .sub-arrow {
	padding: 0 0 0 6px;
}
.nti-header .nti-header-nav .sub-arrow svg {
	width: 16px !important;
	height: 16px !important;
}

/* Navigation */
/* LEVEL 1 */
.nti-megamenu,
.nti-mobile-menu{
	font-family: "Manrope";
}
.nti-megamenu {
	font-size: 16px;
}
.nti-l1 {
	display: flex;
	justify-content: center;
	gap: 20px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nti-l1 a {
	padding: 14px 0;
	display: block;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	color: #003a8f;
}

/* MEGA */
.nti-mega-container {
	position: fixed;
	left: 0;
	top: 93px;
	width: 100%;
	background: #fff;
	transform: translateY(-5px);
	pointer-events: none;
	transition: opacity 0.3s ease, transform 0.3s ease;
	z-index: 1000;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

}
body.admin-bar .nti-mega-container { top: 126px;}

.nti-mega-container.open {
	opacity: 1;
	border-top: 1px solid #eee;
	transition: opacity 0.3s ease, transform 0.3s ease;
	transform: translateY(0);
	pointer-events: auto;
}

.nti-mega-panel {
	display: none;
}

.nti-mega-panel.active {
	display: block;
}

.nti-mega-inner {
	width: 100%;
	max-width: 1440px;
	margin: auto;
	display: flex;
	padding: 32px 24px;
	/* 	min-height: min(450px, 100vh); */
}
.nti-l1-item a{
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
}
.nti-l1-item.has-mega a::after {
	content: '';
	position: relative;
	width: 8px;
	height: 8px;
	border-right: 2px solid #FFF;
	border-bottom: 2px solid #FFF;
	transform:  rotate(45deg);
	transition: transform 0.3s ease,
		margin 0.3s ease;
	margin-top: 0;
	top: -1px;
}
.nti-l1-item.has-mega a:hover::after {
	transform:   rotate(225deg);
	margin-top: 4px;

}

/* LEVEL 2 LEFT */
.nti-l2 {
	position: relative;
	width: 25%;
	border-right: 1px solid #eee;
}

.nti-l2 ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nti-mega-container .nti-l2 li {
	padding: 12px 16px;
	cursor: pointer;
	font-size: 1.125rem;
	font-weight: 700;
}
.nti-header.initial .nti-l2 a,
.nti-header.initial .nti-l3 a {
	color: #0F366F !important;
}
.nti-l2 li:hover,
.nti-l2 li.active a.l2-a,
.nti-l3 li:hover a{
	color: #28B5EE !important;
}

.nti-l2 li {
	position: relative;
}

.nti-l2 li.has-child::after {
	content: '';
	position: absolute;
	right: 16px;              
	top: 50%;
	width: 8px;
	height: 8px;
	border-top: 2px solid #1da1f2;
	border-right: 2px solid #1da1f2;
	transform: translateY(-50%) translateX(-10px) rotate(45deg);
	opacity: 0;
	transition:
		opacity 0.3s ease,
		transform 0.3s ease;
}

.nti-l2 li.active::after {
	opacity: 1;
	transform: translateY(-50%) translateX(0) rotate(45deg);
}


/* LEVEL 3 RIGHT */
.nti-l3 {
	flex: 1;
	padding-left: 32px;
}

/* LEVEL 3 SLIDE */
.nti-l3-panel {
	opacity: 0;
	transform: translateX(12px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	overflow:hidden;
	height: 0;
}

.nti-l3-panel.active {
	opacity: 1;
	transform: translateX(0);
	position: relative;
	height: fit-content;
}


.nti-l3 h3 {
	margin-bottom: 16px;
	color: #003a8f;
	font-size: 1.25rem;
	font-weight: 700;
}

.nti-l3 ul {
	list-style: none;
	padding: 0;
}

.nti-l3 li {
	margin-bottom: 8px;
	font-weight: 400;
	font-size: 1.125rem;
}

.nti-l3 a {
	text-decoration: none;
	color: #0F366F;
}

.nti-l3 a:hover {
	color: #007bff;
}




/* --------------------- Sticky Header --------------------- */

.nti-counter .elementor-counter-number,
.nti-counter .elementor-counter-number-prefix,
.nti-counter .elementor-counter-number-suffix,
.nti-counter .elementor-heading-title{
	background: linear-gradient(195deg, #37C3EB, #0F366F);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight:800;
}

.nti-counter .elementor-counter-number{
	font-size:48px;
}

/* Elementor's own .elementor-counter-number-wrapper is a flex row with no
   align-items set, so it defaults to stretch: the prefix ("S$") and suffix
   ("m") spans get stretched to the row's full height but their own text
   still sits at the top of that taller box, reading as misaligned against
   the big centered number. Center all three as a group instead. */
.nti-counter .elementor-counter-number-wrapper{
	align-items: center;
}

/* font-size above is a fixed 48px at every breakpoint by design (the big
   digits are kept on mobile, not shrunk). But line-height on the wrapper
   still follows whichever Elementor global typography token the widget is
   bound to, and on mobile several of those tokens drop line-height well
   below what a 48px glyph needs (e.g. 130% of a 22px mobile font-size =
   28.6px for a 48px glyph). Since the numbers are painted via
   background-clip:text, anything outside that undersized line box gets no
   gradient fill - the top of every digit reads as chopped off. Match
   desktop's own 150% pairing for 48px text at mobile widths too, sitewide,
   not just on one page. */
@media (max-width: 767px) {
	.nti-counter .elementor-counter-number-wrapper,
	.nti-counter .elementor-counter-number {
		line-height: 150% !important;
	}
}

.nti-counter .elementor-counter-number-suffix {
	color: #2FA6D1 !important;
}
.nti-counter.txt-suffix .elementor-counter-number-suffix {
	background: unset;
	-webkit-text-fill-color: unset;
	position: relative;
	bottom: -16px;
	font-size: 20px !important;
}


/* .nti-overlay {
	aspect-ratio: 16 / 9;
} */
.nti-overlay-container .nti-overlay-txt {
	position: relative;
	transition: .3s ease !important;
	opacity: 0;
}
.nti-overlay-container:hover .nti-overlay-txt {
	opacity: 1;
}
.nti-overlay-container .nti-overlay-btn .elementor-button-content-wrapper {
	align-items: center;
}
.nti-overlay-container .nti-overlay-btn .elementor-button-icon svg {
	display: inline;	
	width: 44px;
	aspect-ratio: 1 / 1;
}
.nti-diagonal-btn a svg {
	width: 12px;
	height: 12px;
    transition: transform 0.3s ease;
}
.nti-overlay-container .nti-overlay-btn a svg path,
.nti-diagonal-btn a:hover svg {
    transition: transform 0.3s ease;
}
.nti-overlay-container .nti-overlay-btn a:hover svg path,
.nti-diagonal-btn a:hover svg {
    transform: translate(2px, -2px);
}
/* .nti-diagonal-btn a:hover {
    box-shadow: inset 0 0 0 1px #0F366F;
} */
.nti-square-container {
	aspect-ratio: 1 / 1;
}
.nti-circle-container .elementor-heading-title {
	aspect-ratio: 1 / 1;
	display: flex;
    align-items: center;
    justify-content: center;
}

/* Latest News Articles */
.nti-news-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.nti-news-item {
	overflow: hidden;
	background: #fff;
}

.nti-news-item--featured {
	position: relative;
	border-radius: 12px;
}

.nti-news-media {
	display: grid;
	height: 100%;
	min-height: 420px;
	background-size: cover;
	background-position: center;
	width: 100%;
	position: relative;
	align-items: end;
}
.nti-news-media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgba(0, 0, 0, 0.85) 0%,
		rgba(0, 0, 0, 0.45) 35%,
		rgba(0, 0, 0, 0) 65%
	);
	z-index:1;
	pointer-events: none;
}
.nti-news-item--featured .nti-news-content {
	padding: 24px;
}
.nti-news-content {
	padding: 0px;
	z-index: 2;
	width: 100%;
	min-width: 0; /* lets the text column shrink inside the flex row instead of overflowing */
	color: #FFF;
}
/* Top row of every card: category pill left, date right */
.nti-news-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 4px 12px;
	margin-bottom: 6px;
}
.nti-news-pill {
	display: inline-block;
	background: #37C3EB;
	color: #fff;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 600;
	line-height: 100%;
	padding: 6px 12px;
	border-radius: 100px;
	height: 27px;
    align-content: center;
}
.nti-news-wrapper .nti-news-pill {
	font-weight: 900;
	text-transform: uppercase;
	background: none;
/* 	color: #005aaa; */
	color: #37C0EB;
	padding: 0;
}
.nti-news-content .nti-news-title {
	font-size: 26px;
	font-weight: 800;
	line-height: 140%;
	margin: 0;
	overflow-wrap: break-word;
}
.nti-news-content .nti-news-date {
	font-size: 14px;
	font-weight: 600;
	margin-left: auto; /* stays top-right even when there is no pill */
	white-space: nowrap;
}
/* Preview text under the title (clamped so cards stay a predictable height) */
.nti-news-excerpt {
	margin: 8px 0 0;
	font-size: 16px;
	font-weight: 500;
	line-height: 150%;
	overflow-wrap: break-word;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}
.nti-news-item--compact .nti-news-excerpt {
	color: var(--e-global-color-0610876, #323434);
}

.nti-news-meta {
	font-size: 0.875rem;
	font-weight: 700;
	margin-top: 12px;
}
.nti-news-item--featured .nti-news-meta {
	text-align: right;
}
.nti-news-item--compact .nti-news-content {
	color: #0F366F;	
}
.nti-news-item--compact .nti-news-link {
	width: 100%;
	display: flex;
	align-items: stretch; /* thumbnail grows to the full row height */
	gap: 24px;
}
.nti-news-secondary {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.nti-news-secondary .nti-news-title {
	font-size: 20px;
    font-weight: 800;
    line-height: 125%;
}
.nti-news-item--compact {
	display: flex;
	gap: 16px;
	flex: 1 1 auto; /* cards keep their content height; any spare column height is shared equally */
}
.nti-news-thumb {
	border-radius: 12px;
	flex: 0 0 260px;
	min-width: 260px;
	min-height: 150px;
	align-self: stretch;
	position: relative; /* image is absolutely filled, so its own size never drives the row height */
}
.nti-news-thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100% !important;
	display: block;
	object-fit: cover;
	border-radius: 8px;
	border-radius: 12px !important;
}
/* Narrow two-column desktop: smaller thumb keeps room for the text */
@media (min-width: 1025px) and (max-width: 1280px) {
	.nti-news-thumb {
		flex-basis: 200px;
		min-width: 200px;
	}
	.nti-news-thumb img {
		width: 200px;
	}
}
@media (max-width: 1024px) {
	.nti-news-wrapper {
		grid-template-columns: 1fr;
	}
	.nti-news-thumb {
		flex-basis: auto;
		min-width: 0;
		height: 250px;
		align-self: auto;
	}
	.nti-news-item--compact .nti-news-link {
		width: 100%;
		flex-direction:column;
	}
	.nti-news-thumb img {
		width: 100%;
	}
}
@media (max-width: 767px) {
	.nti-news-media {
		min-height: 380px;
	}
	.nti-news-item--featured .nti-news-content {
		padding: 16px;
	}
	.nti-news-content .nti-news-title {
		font-size: 22px;
	}
	.nti-news-secondary .nti-news-title {
		font-size: 18px;
	}
	.nti-news-thumb {
		height: 200px;
	}
}

/* --------------------------- Breakpoints For Mobile Devices --------------------------- */

/* ========== HAMBURGER ========== */

.nti-hamburger {
	width: 20px;
	height: 20px;
	position: relative;
	background: none;
	border: none;
	cursor: pointer;
	z-index: 1001;
}
.nti-hamburger:hover,
.nti-hamburger :focus {
	background: none !important;
	background-image: none !important;
}
.nti-hamburger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #FFF;
	transition: 0.3s;

}

.nti-hamburger span:nth-child(1) { top: 5px; }
.nti-hamburger span:nth-child(2) { top: 15px; }

.nti-hamburger.active span:nth-child(1) {
	transform: rotate(45deg);
	top: 10px;
}
.nti-hamburger.active span:nth-child(2) {
	transform: rotate(-45deg);
	top: 10px;
}

/* Migrated from Code Snippet 60 "Mobile Hamburger Width Fix" (now
   disabled) on 2026-10-08 - was a global wp_head-hooked <style> block with
   no page condition, i.e. truly sitewide, so it belongs here rather than
   in a snippet. */

/* The kit's global button rule (.elementor-kit-7 button, 28px side
   padding) matches this raw <button> too. With box-sizing:border-box,
   padding alone forces a 56px box no matter what width is set below -
   border-box can't shrink narrower than its own padding+border sum. */
.nti-hamburger {
	padding: 0 !important;
	border-style: none !important;
}
/* The kit's global button rule also sets a WHITE background-color on
   :hover/:focus for every real <button> element (.elementor-kit-7
   button:hover/:focus), same source as the padding leak above. That
   flashes a white box behind the hamburger and the mobile drill-down
   menu's Next/Back buttons (both real <button> elements, see Snippet 7)
   on tap/hover. Override it off for all menu buttons. */
.nti-hamburger:hover,
.nti-hamburger:focus,
.nti-mobile-menu button:hover,
.nti-mobile-menu button:focus {
	background: none !important;
	background-color: transparent !important;
}
/* base.css's ".nti-header.initial a/p/span { color:#fff !important }"
   is meant for the transparent header state at scrollTop 0, but it
   also matches every <span> inside the mobile drill-down drawer (the
   Back-button's arrow and title spans, e.g. "< Products") since they
   happen to be descendants of .nti-header too. At scrollTop 0 that
   makes them white text on the drawer's white background - invisible.
   Force the drawer's own text/arrows back to the kit's real link
   color regardless of the header's scroll state. */
.nti-header.initial .nti-mobile-menu a,
.nti-header.initial .nti-mobile-menu p,
.nti-header.initial .nti-mobile-menu span {
	color: var(--e-global-color-primary) !important;
}
@media (max-width: 767px) {
	.nti-hamburger {
		width: 30px !important;
	}
	/* The header's mobile icon row (search icon, language selector,
	   hamburger) is flex-wrap:wrap with a fit-content width from the
	   original build (sized for the hamburger alone). Adding the
	   search + language icons pushed it over that width, wrapping the
	   hamburger onto its own second line. Force one row. */
	.nti-header .elementor-hidden-desktop {
		flex-wrap: nowrap !important;
	}
}
/* Definitive override, 1024px and below: the original template set
   justify-content:center on this row at the <=1024px tier (fine when
   it only ever held the lone hamburger). With the search icon and
   language selector now also living in this row, "center" clusters
   all three in the middle of the row's own box with dead space on
   both sides, instead of flush against the row's right edge - visible
   and confirmed via the compiled CSS (--justify-content:center at
   <=1024px, overriding the base rule's flex-end). Force the intended
   flush-right, vertically-centered, non-overlapping layout directly,
   and stop any child from stretching to create uneven gaps.

   Targeted by class, not element id - element ids on this row have
   already been seen to change (Elementor regenerated all of header
   17's ids after it was opened/saved in the editor, silently breaking
   every id-based rule that used to target it). `.elementor-hidden-
   desktop` is Elementor's own auto-generated class from the row's
   "Hide on Desktop" responsive-visibility setting, not a custom
   _css_classes value - confirmed via a fresh render that it's the
   only element on either header carrying that class, so it survives
   id churn. A custom _css_classes control added directly to this
   container node (tried twice) never rendered into the markup at
   all, on this Elementor version, even after a full cache flush -
   so don't rely on that path for a container. */
@media (max-width: 1024px) {
	.nti-header .elementor-hidden-desktop {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		justify-content: flex-end !important;
		align-items: center !important;
		gap: 12px !important;
	}
	.nti-header .elementor-hidden-desktop > .elementor-element {
		flex-grow: 0 !important;
		flex-shrink: 0 !important;
		margin: 0 !important;
	}
	/* The hamburger's own widget wrapper div is the actual flex item
	   in this row (not the <button> itself) - measured taller than
	   the button, which sits top-anchored inside it by default block
	   flow, so the row's own align-items:center centers the wrapper
	   but the button still renders ~3-4px above true center relative
	   to the search icon and logo (both confirmed dead-center via
	   real getBoundingClientRect measurement). Make the wrapper a
	   flex container centering its one child, so the button centers
	   within whatever height the wrapper actually has.
	   `.elementor-widget-html` is the widget-TYPE class Elementor
	   always emits for an HTML widget - stable regardless of id,
	   and the hamburger is the only html widget in this row. */
	.nti-header .elementor-hidden-desktop .elementor-widget-html {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}
}

/* ========== MOBILE MENU CONTAINER ========== */
.nti-mobile-menu {
	position: fixed;
	inset: 0;
	background: #fff;
	z-index: 1000;
	transform: translateX(100%);
	transition: transform 0.3s ease;
	overflow: hidden;
	top: 85px;
	padding: 12px 0;
}

.nti-mobile-menu.open {
	transform: translateX(0);
}

/* ========== LEVEL WRAPPER ========== */
.nti-level {
	position: absolute;
	inset: 0;
	background: #fff;
	transform: translateX(100%);
	transition: transform 0.3s ease;
	overflow-y: auto;
}

.nti-level.active {
	transform: translateX(0);
}

/* ========== HEADER (BACK + TITLE) ========== */
/* .nti-header {
display: flex;
align-items: center;
padding: 16px;
border-bottom: 1px solid #eee;
font-weight: 600;
} */

/* ========== MENU LIST ========== */

/* Split link + arrow */
.nti-row {
	display: flex;
	align-items: center;
	border-bottom: 1px solid #eee;
}

.nti-row .nti-link {
	flex: 1;
	padding: 12px 21px;
	text-decoration: none;
	color: inherit;
}

.nti-row .nti-next {
	width: 50px;
	justify-content: center;
	padding: 12px 0;
}

/* Prevent double hover */
.nti-row:hover {
	background: #f7f7f7;
}

.nti-row .nti-next:hover {
	background: none;
}


.nti-mobile-nav-header {
	border-bottom: 1px solid #eee;
}
.nti-mobile-menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nti-mobile-menu *,
.nti-header .nti-mobile-menu a{
	font-size: 1rem;
	font-weight: 700;
	color: #0F366F !important;
}
.nti-mobile-menu a,
.nti-next,
.nti-back{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding: 15px 21px !important;
	text-decoration: none;
	background: none;
	border: none;
	cursor: pointer;
}

.nti-next .arrow,
.nti-back .arrow {
	font-size: 30px;
	line-height: 20px;
	margin-left: -3px;
}

/* Optional hover */
.nti-mobile-menu a:hover,
.nti-next:hover {
	background: #f7f7f7;
}
.mobile-dropdown .e-tabs-mobile-dropdown {
	display: none;

}
.e-tabs-mobile-dropdown select {
	/* Base styles */
	width: 100%;
	padding: 10px 48px 10px 16px; /* space for arrow */
	font-size: 16px;
	font-weight: 600;
	color: #0F366F;
	background-color: transparent;
	border: 1px solid #0F366F;
	border-radius: 100px;
	cursor: pointer;
	appearance: none; /* Remove default arrow */
	-webkit-appearance: none;
	-moz-appearance: none;
	position: relative;
	transition: border-color 0.3s ease;
}

/* Arrow icon using a pseudo-element */
.e-tabs-mobile-dropdown {
	position: relative;
	display: inline-block;
	width: 100%;
}

/* Add a downward arrow on the right */
.e-tabs-mobile-dropdown::after {
	content: "";
	position: absolute;
	top: calc(50% - 2px);
/* 	right: 16px;
	pointer-events: none;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #0F366F; */
	width: 10px;
    aspect-ratio: 1 / 1;
	border: solid #0F366F;
	border-width: 0 3px 3px 0;
	display: inline-block;
	padding: 3px;
	transform: translateY(-50%) rotate(45deg);
	-webkit-transform: translateY(-50%) rotate(45deg);
}

/* Focus state */
.e-tabs-mobile-dropdown select:focus {
	outline: none;
	border-color: #08305b;
	box-shadow: 0 0 6px #0F366F44;
}

/* Option styles (limited browser support) */
.e-tabs-mobile-dropdown select option {
	color: #0F366F;
	background-color: #fff;
	font-weight: 500;
}

/* Hover on options only works on some browsers */
.e-tabs-mobile-dropdown select option:hover {
	background-color: #0F366F;
	color: #fff;
}
.nti-carousel .swiper-pagination-bullet-active {
	width: 48px !important;
    border-radius: 12px;
}

.acf-download-wrapper {
	display: flex;
	grid-template-columns: 1fr 1fr;
	flex-wrap: wrap;
	gap: 12px;
	align-items: flex-start;
	justify-content: center;
}
.acf-download-btn {
	text-align: center;
	cursor: pointer;
}
.nti-btn-primary.acf-download-btn {
	padding: 7px 24px;
}
.hubspot-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.6);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hubspot-overlay-inner {
	background: #fff;
	border-radius: 8px;
	padding: 30px;
	max-width: 80vw;
	max-height: 90vh;
	width: 90%;
	position: relative;
	overflow-y: scroll;
}

.hubspot-close {
	color: black;
	position: absolute;
	top: 10px;
	right: 10px;
	background: none;
	border: none;
	font-size: 18px;
	cursor: pointer;
}

.nti-subpage-tab.main-tabs.new-tab > .e-n-tabs > .e-n-tabs-heading:after {
	position: sticky;
	content: url('/wp-content/themes/hello-theme-child-master/theme/default/imges/nti-right.svg');
	right: 0;
/* 	top: 50%;
    transform: translateY(-50%); */
    padding: 7px 24px;
}
.nti-subpage-tab.main-tabs.new-tab > .e-n-tabs > .e-n-tabs-heading {
	position: relative;
	border: 1px solid #0F366F;
    border-radius: 100px;
	background: transparent;
	padding: 2px 3px;
	width: auto;
	margin: unset;
}
.nti-subpage-tab.main-tabs > .e-n-tabs > .e-n-tabs-heading {
	position: relative;
	width: fit-content;
	margin: 0 auto;
	border: 1px solid #0F366F;
    background: transparent;	
    border-radius: 100px;
	
	border: 1px solid transparent;
	background: linear-gradient(white, white) padding-box,
				linear-gradient(195deg, #37C0EB, #0F366F) border-box;
	
	padding: 2px 3px;
}
.nti-subpage-tab.main-tabs > .e-n-tabs > .e-n-tabs-heading button .e-n-tab-title-text{
	position: relative;
	justify-content: center;
}
.nti-subpage-tab.main-tabs.tab-2 > .e-n-tabs > .e-n-tabs-heading {
	background: transparent;
	border: 1px solid #ffffff;
}
.nti-global-tab .e-n-tabs .e-n-tabs-heading {
	border-bottom: 1px solid #E3E3E3;
}
.nti-global-tab.elementor-widget-n-tabs [data-touch-mode=false] .e-n-tab-title[aria-selected=false]:hover {
	color: #0F366F;
}


@media screen and (min-width: 1025px) and (max-width: 1299px) {
	.nti-l1 {
		gap: 1.2vw;
	}
	.nti-l1 a {
		font-size: 1.1vw;
	}
	.nti-l1-item a {
		gap: 5px;
	}
}


@media (max-width: 1300px) {
	#nti-nav-contact {
		display: none;
	}
	#nti-nav-contact-1300 {
		display: block;
	}
}


@media (max-width: 1024px) {
	.nti-header.e-con .elementor-hidden-desktop .nti-header-search {
		margin: 0 0 2px 0 !important;
	}
	/* Hide original tab buttons */
	.mobile-dropdown .e-tabs-mobile-dropdown {
		display: block;
	}
	.mobile-dropdown .e-n-tabs-heading {
		display: none !important;
	}
/* 	.nti-subpage-tab.main-tabs.mobile-dropdown .e-tabs-mobile-dropdown */
	.mobile-dropdown .e-tabs-mobile-dropdown {
		padding: 24px 0;
	}
	.neon-color .mobile-dropdown .e-tabs-mobile-dropdown,
	.gold-color .mobile-dropdown .e-tabs-mobile-dropdown,
	.metallic-color .mobile-dropdown .e-tabs-mobile-dropdown,
	.dark .mobile-dropdown .e-tabs-mobile-dropdown {
		padding: 24px;
	}
	.mobile-dropdown .e-tabs-mobile-dropdown::after {
		right: 24px;
	}
	.neon-color .mobile-dropdown .e-tabs-mobile-dropdown::after,
	.gold-color .mobile-dropdown .e-tabs-mobile-dropdown::after,
	.metallic-color .mobile-dropdown .e-tabs-mobile-dropdown::after,
	.dark .mobile-dropdown .e-tabs-mobile-dropdown::after {
		right: 46px;
	}
	.white-dpd .e-tabs-mobile-dropdown select {
		color: #ffffff;
		border: 1px solid #ffffff;
	}
	.white-dpd .e-tabs-mobile-dropdown::after {
		border: solid #ffffff;
		border-width: 0 3px 3px 0;
	}

	
	.nti-table-wrapper .elementor-shortcode {
		overflow-x: scroll;
	}
	.nti-table-wrapper .tablepress {
		table-layout: unset !important;
	}
}


@media (max-width: 830px) {}

@media (max-width: 767px) { /* Elementor default mobile portrait breakpoint */
	.nti-cont.e-con {
		--padding-top: 64px;
		--padding-bottom: 64px;
		--padding-left: 21px;
		--padding-right: 21px;
	}
}

@media (max-width: 480px) {

}

/* --------------------------------------------------------------------------
   NTI v2 homepage - stat counters in the "Commercial Solutions for
   Tomorrow's Engineering Challenges" section (page 8, container 9066554).

   The v2 design fills the whole figure - number AND suffix - with one
   continuous gradient. The existing .nti-counter helper above cannot be
   reused for this, because it forces the suffix to a solid #2FA6D1 with
   !important, which would leave the "+" / "M+" a different colour from
   the number.
   -------------------------------------------------------------------------- */
.nti-stat-v2 .elementor-counter-number,
.nti-stat-v2 .elementor-counter-number-prefix,
.nti-stat-v2 .elementor-counter-number-suffix {
	background: linear-gradient(190deg, #37C0EB 0%, #0F366F 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* ==========================================================================
   NTI Counter Custom Styles
   ========================================================================== */

/* Align counter items to the bottom baseline */
.ntis-stat-counter .elementor-counter-number-wrapper {
  align-items: flex-end !important;
}

/* Suffix base styles */
.ntis-stat-counter .elementor-counter-number-suffix {
  font-size: 26px !important;
  font-weight: 800;
  margin-bottom: 3px;
  margin-left:4px;
}

/* Shift only the subscript (number 2) downward using relative positioning */
.ntis-stat-counter .elementor-counter-number-suffix sub {
  position: relative;
  top: 3px;             /* Adjust pixel value to push number 2 further down */
  font-size: 0.65em;
}

/* Hide number 0 and display only Suffix ZERO for Counter Widget */
.ntis-counter-text-zero .elementor-counter-number {
  display: none !important;
}

/* ---------------------------------------------
   HubSpot form loading indicator in Elementor popups
   (inserted/removed by wpLCommon.hsPopupForms in common.js)
--------------------------------------------- */
.nti-hs-loading {
	width: 42px;
	height: 42px;
	margin: 24px auto;
	border: 6px solid #D8DEE6;
	border-top-color: #0F366F;
	border-radius: 50%;
	animation: nti-hs-spin .8s linear infinite;
}
@keyframes nti-hs-spin {
	to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
	.nti-hs-loading { animation-duration: 2.4s; }
}
