/**
Theme Name: astra-child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/
/*  */
/* ------------------------- SysBrilliance New Styles ------------------------- */

/* Global Styles */
.mb-0 p {
	margin-bottom: 0;
}
span.highlight.blue {
    color: #01ABFA;
}
.one-spot-gradient-bg {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 38%),
		radial-gradient(circle at 12% 95%, rgba(1, 171, 250, 0.36), transparent 16rem),
		#111111;
}
.one-spot-gradient-bg-2 {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 38%),
		radial-gradient(circle at 88% 6%, rgba(1, 171, 250, 0.3), transparent 12rem),
		#111111;
}
.one-spot-gradient-bg-3 {
    background: radial-gradient(circle at 8% 48%, rgba(1, 171, 250, 0.18), transparent 18rem);;
}
.two-spot-gradient-bg {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 38%),
		radial-gradient(circle at 88% 6%, rgba(1, 171, 250, 0.22), transparent 12rem),
		radial-gradient(circle at 12% 95%, rgba(1, 171, 250, 0.52), transparent 16rem),
		#111111;
}
.two-spot-gradient-bg-2 {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 38%),
		radial-gradient(circle at 88% 6%, rgba(255, 255, 255, 0.25), transparent 12rem),
		radial-gradient(circle at 12% 95%, rgba(15, 19, 31, 0.3), transparent 16rem),
		#111111;
}
.two-spot-gradient-bg-3 {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 38%),
		radial-gradient(circle at 12% 10%, rgba(1, 171, 250, 0.22), transparent 12rem),
		radial-gradient(circle at 88% 95%, rgba(1, 171, 250, 0.52), transparent 16rem),
		#111111;
}
.panel-gradient-bg {
    background: linear-gradient(145deg, #111111 0%, #0F131F 40%, #01ABFA 145%);
}
.csh-fw .elementor-widget-theme-post-featured-image.elementor-widget-image .elementor-widget-container::before {
    background: linear-gradient(rgba(21, 21, 21, 0.18), rgba(21, 21, 21, 0.2) 34%, rgba(21, 21, 21, 0.9) 100%), radial-gradient(circle at 88% 12%, rgba(1, 171, 250, 0.34), transparent 13rem);
}
.scroll-box-1,
.scroll-box-2,
.scroll-box-3 {
    transition: transform 0.6s ease, opacity 0.6s ease;
    transform-origin: center top;
}
.scroll-box-1 {
    transform: scale(1);
    inset-inline-start: unset !important;
}
.scroll-box-2,
.scroll-box-3 {
    transform: scale(0.92);
}
.scroll-box-1:has(~ .scroll-box-2.elementor-sticky--active) {
    transform: scale(0.92);
}
.scroll-box-2.elementor-sticky--active {
    transform: scale(1);
    inset-inline-start: unset !important;
}
.scroll-box-1:has(~ .scroll-box-3.elementor-sticky--active),
.scroll-box-2:has(~ .scroll-box-3.elementor-sticky--active) {
    transform: scale(0.92);
}
.scroll-box-3.elementor-sticky--active {
    transform: scale(1);
    inset-inline-start: unset !important;
}
.img-hover a, .img-hover, .img-hover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover!important;
    transition: transform 700ms;
}
.logos-carousel .swiper-wrapper {
    transition-timing-function: linear !important;
}
.logos-carousel .swiper-slide-inner {
    padding: 15px 20px;
    background: #FFFFFF;
    border-radius: 130px;
}
.logos-carousel .swiper-slide-image {
    filter: grayscale(1);
}
.single-post .elementor-widget-container h3 b, .single-post .elementor-widget-container h3 {
    font-family: "DM Sans", Sans-serif;
    font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 0.98;
    letter-spacing: -0.055em;
}

/* ============= SB Header Megamenu updates ============= */
/* .sb-megamenu {
  --active-bg: #E0EAF9;
} */
/* Hide every content wrapper except the active one */
/* .sb-megamenu [class*="-item-wrapper"]:not(.is-active) {
  display: none !important;
} */
/* Active button background (targets both the widget and the inner button) */
/* .sb-megamenu [class*="-item-button"].is-active,
.sb-megamenu [class*="-item-button"].is-active a.elementor-button  {
  background-color: var(--active-bg) !important;
  border-radius: 12px;
}
.sb-megamenu [class*="-item-button"].is-active a.elementor-button span.elementor-button-icon  {
  transform: rotate(45deg);
}
.sb-megamenu .circled-icon a.elementor-button span.elementor-button-icon {
    padding: 2px;
    border-radius: 99px;
    border: 1px solid #111111;
    transition: rotate 300ms ease;
}
.sb-megamenu .circled-icon .elementor-button-content-wrapper {
    align-items: center;
} */

/* ============= SB Home Carousel updates ============= */
.nh-carousel-section .nh-carousel-overflow .swiper {
    overflow: visible;
}
.elementor-widget-loop-carousel.non-square-cards .cs-square-card {
    aspect-ratio: unset;
}
.carousel-overflow-right {
  overflow: visible !important;
  clip-path: inset(0 -100vw 0 0);
  position: relative;
  z-index: 1;
}

/* ============= SB Case Studies Home ============= */
.sb-cs-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}
.sb-cs-filters__label {
	font-size: clamp(1.05rem, 1.35vw, 1.35rem);
    font-weight: 500;
    letter-spacing: -0.035em;
	margin-right: 4px;
}
/* Pills: "All" + dropdown toggles */
.sb-cs-pill,
.sb-cs-dd__toggle {
	display: inline-flex;
    min-height: 3rem;
    min-width: 7.5rem;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    gap: 0.75rem;
    padding: 0.75rem 1.35rem;
    border: 1px solid #111;
    border-radius: 999px;
    background: transparent !important;
    color: #111;
    font-size: clamp(1rem, 1.15vw, 1.18rem);
    font-weight: 500;
    letter-spacing: -0.035em;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}
.sb-cs-pill { min-width: 120px; }
/* Dropdown */
.sb-cs-dd { position: relative; }
.sb-cs-dd__toggle {
	justify-content: space-between;
	min-width: clamp(12rem, 20vw, 18rem);
}
.sb-cs-dd__chevron { transition: transform .2s; }
.sb-cs-dd.is-open .sb-cs-dd__chevron { transform: rotate(180deg); }
.sb-cs-filters .sb-cs-dd__menu {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	z-index: 20;
	width: 100%;
	max-height: 60vh;
	overflow-y: auto;
	margin: 0;
	padding: 7px;
	list-style: none;
	background: #fff !important;
	border-radius: 16px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .12);
}
.sb-cs-dd__menu[hidden] { display: none; }
.sb-cs-dd__menu button {
	display: block;
	width: 100%;
	padding: 12px 14px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: #000;
	font: inherit;
	font-size: 15px;
	text-align: left;
	cursor: pointer;
	text-transform: unset;
	font-weight: 500;
	box-shadow: none;
}
.sb-cs-dd__menu button:hover,
.sb-cs-dd__menu button.is-selected {
	background: rgba(1, 171, 250, 0.1); /* swap for the brand tint */
	color: #01ABFA;
}
/* Count, pushed to the right */
.sb-cs-count {
	margin-left: auto;
	font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}
/* Grid loading state */
.sb-cs-grid { transition: opacity .2s; }
.sb-cs-grid.is-loading { opacity: .45; pointer-events: none; }
.sb-cs-filters .sb-cs-pill, .sb-cs-filters .sb-cs-dd__toggle {
    font-size: clamp(1rem, 1.15vw, 1.18rem);
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.055em;
}
.sb-cs-filters .sb-cs-pill:hover, .sb-cs-filters .sb-cs-dd__toggle:hover, .sb-cs-filters a.sb-cs-pill.sb-cs-pill--all.is-active {
    background: #000 !important;
    color: #fff;
    border-color: #000;
}
.feat-work-r-col .nh-carousel-overflow .swiper {
    overflow: visible;
}
/* .feat-work-r-col:has(.nh-carousel-con) {
    overflow: hidden;
} */
 /* Case Studies Home - Featured Work Carousel*/
.cs-feat-work-section {
    overflow: hidden;
}
.feat-work-r-col {
  overflow: visible !important;
  clip-path: inset(0 -100vw 0 0);
  position: relative;
  z-index: 1;
}
.elementor-widget-loop-carousel .cs-square-card {
    aspect-ratio: 1/1;
}
.sb-cs-loop-grid .elementor-pagination .page-numbers {
    width: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 50%;
}
.sb-cs-loop-grid .elementor-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
}
.sb-cs-loop-grid .elementor-pagination .page-numbers.current {
    background: #151515;
    color: #fff;
}
.sb-cs-filters + .sb-cs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.cs-loop-card .elementor-widget-theme-post-featured-image {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.cs-loop-card .elementor-widget-theme-post-featured-image .elementor-widget-container:before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent, rgba(0,0,0,0.75));
}
.cs-loop-card .elementor-widget-theme-post-featured-image .elementor-widget-container {
    position: relative;
}
.sb-cs-pagination {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 40px;
  flex-wrap: wrap;
}
.sb-cs-page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  color: #111;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: background .2s, color .2s;
}
.sb-cs-page:hover,
.sb-cs-page.is-active {
  background: #111111;
  color: #fff;
  cursor: default;
}

/* About Numbered Grid */
.numbered-grid__item.is-active .numbered-grid__number {
    /* border-color: #00abfa;
    background: #00abfa; */
    color: #fff;
    box-shadow: 0 0.6rem 1.15rem rgba(89, 0, 255, 0.18);
    transform: none;
}
.numbered-grid__number {
    position: relative;
    top: 0;
    left: auto;
    z-index: 2;
    display: inline-grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    margin: 0;
    border: 1px solid rgba(21, 21, 21, 0.14);
    border-radius: 999px;
    background: #fff;
    color: var(--en-ink);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    box-shadow: 0 0.5rem 1rem rgba(21, 21, 21, 0.08);
    opacity: 1;
    transform: none;
    grid-column: 1;
    grid-row: 1;
    justify-self: center;
    transition: border-color 240ms ease, background-color 240ms ease, color 240ms ease, box-shadow 240ms ease, transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}
.numbered-grid__item.is-active .numbered-grid__line::before {
    transform: scaleY(0.5);
}
.numbered-grid__line::before {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    /* background: #00abfa; */
    content: '';
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}
.numbered-grid__item .numbered-grid__line {
    position: absolute;
    top: 1rem;
    bottom: -1rem;
    left: 0.84rem;
    display: block;
    width: 0.32rem;
    height: auto;
    border-radius: 999px;
    background: rgba(21, 21, 21, 0.14);
    transform: none;
    overflow: hidden;
}
.numbered-grid__line {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.22rem;
    background: var(--en-ink);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 450ms cubic-bezier(0.22, 1, 0.36, 1);
}
.elementor-element.numbered-grid__item.numbered-grid__item--content {
    position: relative;
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
    align-items: start;
    min-height: 0;
    padding: 0 0 clamp(3rem, 5vw, 4.75rem);
    border: 0;
    overflow: visible;
}
.e-con-full.timeline-cont {
    grid-column: 2;
    grid-row: 1;
    max-width: 54rem;
    padding: 0;
}
.numbered-grid--timeline .numbered-grid__item.is-passed .numbered-grid__line::before {
    transform: scaleY(1);
}
.numbered-grid--timeline .numbered-grid__line::before {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    /* background: #00abfa; */
    content: '';
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}
.numbered-grid--timeline .numbered-grid__item.is-passed .numbered-grid__number {
    border-color: rgba(89, 0, 255, 0.26);
    /* background: #00abfa; */
    color: #fff;
}

.bottom-progress .swiper-pagination.swiper-pagination-progressbar.swiper-pagination-horizontal {
    bottom: -20px;
    top: inherit;
    display: none;
}
.img-hover a, .img-hover, .img-hover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover!important;
    transition: transform 700ms;
}

/* Homepage */
.logos-carousel.nbl-carousel .swiper-slide-inner {
    padding: 0;
    background: transparent;
    border-radius: 0;
}
.logos-carousel.nbl-carousel img.swiper-slide-image {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: clamp(1.7rem, 3vw, 2.35rem);
    object-fit: contain;
	filter: brightness(0.5) grayscale(1);
  	transition: filter 300ms ease;
}
.logos-carousel.nbl-carousel img.swiper-slide-image:hover {
    filter: unset;
}
.logos-carousel.nbl-carousel .elementor-image-carousel-wrapper.swiper {
    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0%,
        #000 10%,
        #000 90%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to right,
        transparent 0%,
        #000 10%,
        #000 90%,
        transparent 100%
    );
}
.nh-banner-wrap::after {
    content: '';
    position: absolute;
    inset: 0px;
    border-radius: 20px; 
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    pointer-events: none;
    z-index: 1;
}
.nh-banner-wrap > * {
    z-index: 2;
}
.scrolling-footer-marquee {
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
}
.scrolling-footer-marquee__track {
    display: inline-flex;
    will-change: transform;
    -webkit-animation: footer-marquee-sliding 20s linear infinite;
    animation: footer-marquee-sliding 20s linear infinite;
}
.scrolling-footer-marquee__track span {
    display: inline-block;
    padding-right: 4rem;
    color: #01ABFA;
    text-transform: uppercase;
    font-size: 136px;
	line-height: 1.1;
    font-family: "DM Sans", sans-serif;
    font-weight: 700;
}
@-webkit-keyframes footer-marquee-sliding {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}
@keyframes footer-marquee-sliding {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}
.cta-wrap-effect::before {
    position: absolute;
    inset: -45% -28%;
    z-index: 0;
    background: linear-gradient(105deg, transparent 12%, rgba(255, 255, 255, 0.18) 34%, transparent 54%);
    content: '';
    pointer-events: none;
    transform: translateX(-58%) rotate(8deg);
    animation: cta-bars-light-pass 6.5s ease-in-out infinite;
    height: 1000px;
}
@keyframes cta-bars-light-pass {
	0%,
	38% {
		transform: translateX(-58%) rotate(8deg);
	}

	62%,
	100% {
		transform: translateX(120%) rotate(8deg);
	}
}
.nh-carousel-overflow .e-n-carousel {
    overflow: visible;
}
.nh-vertical-spacer {
    height: 100%;
}
.nh-carousel-card .nh-c-inner-hover-card {
    transform: translateY(72px);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0);
}
.nh-carousel-card:hover .nh-c-inner-hover-card {
    transform: translateY(0px);
    background: #00000080;
	backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.16);
}
.nh-carousel-card .nh-carousel-image {
    transition: transform 500ms ease;
}
.nh-carousel-card:hover .nh-carousel-image {
    transform: scale(1.05);
}
.nh-new-carousel-btn-proxy {
	cursor: pointer;
}
.cta-wrap-effect .growing-img img {
    transition: transform 300ms ease;
}
.cta-wrap-effect:hover .growing-img img {
    transform: scale(1.06);
}
.sm-circle-btn-icon .elementor-button-icon {
    padding: 4px;
    border: 1px solid #eee;
    border-radius: 32px;
    height: auto;
}
.sm-circle-btn-icon .elementor-button-content-wrapper {
    align-items: center;
}
.watch-play-btn .elementor-button-content-wrapper {
    align-items: center;
}
.watch-play-btn .elementor-button-icon {
    font-size: 12px;
    padding: 20px;
    background: #039DDB;
    border-radius: 99px;
    transition: all 500ms ease;
}
.nh-svcs-card.blue-bg .elementor-button-icon {
	background: #00234B;
}
.nh-svcs-card:hover .watch-play-btn .elementor-button-icon {
    background: #FFFFFF;
    fill: #000;
    transform: scale(1.05);
}
.logo-pill .elementor-widget-container {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}
.nh-vid-card svg.e-font-icon-svg.e-eicon-play {
    background: #ffffff1A;
    -webkit-backdrop-filter: blur(24px);
    backdrop-filter: blur(24px);
    border-radius: 999px;
}
.nh-vid-card:hover svg.e-font-icon-svg.e-eicon-play {
    background: #01ABFA;
    -webkit-backdrop-filter: unset;
    backdrop-filter: unset;
    opacity: 1;
    border-radius: 999px;
}
.nh-vid-card .elementor-custom-embed-image-overlay {
    transition: all 500ms ease;
    position: relative;
}
.nh-vid-card .elementor-custom-embed-image-overlay::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 80%;
    background: linear-gradient(
        to top,
        #111 0%,
        rgba(17, 17, 17, 0) 100%
    );
    pointer-events: none;
}
.nh-vid-card:hover .elementor-custom-embed-image-overlay {
    transform: scale(1.08)
}
.nh-testimonial-carousel .elementor-swiper-button.elementor-swiper-button-prev,
.nh-testimonial-carousel .elementor-swiper-button.elementor-swiper-button-next,
.nh-image-carousel .elementor-swiper-button.elementor-swiper-button-prev,
.nh-image-carousel .elementor-swiper-button.elementor-swiper-button-next,
.nh-carousel-overflow .elementor-swiper-button.elementor-swiper-button-prev,
.nh-carousel-overflow .elementor-swiper-button.elementor-swiper-button-next {
    display: none;
}
.nh-cws-card .num-span {
	transition: transform 500ms ease;
}
.nh-cws-card .num-span span {
    transition: color 500ms ease;
	line-height: 1;
}
.nh-cws-card:hover .num-span {
	transform: translateY(-6px) !important;
}
.nh-cws-card:hover .num-span span {
    color: #FFDF73 !important;
}
.nh-cws-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 4px;
    background: #111;
    transition: width 400ms ease;
}
.nh-cws-card:hover::after {
    width: 100%;
}
.circled-icon .elementor-button-text {
	text-align: left;
}
.nh-testimonial-carousel-btn-proxy,
.nh-ota-carousel-btn-proxy {
    cursor: pointer;
}
.nh-testimonial-carousel {
    height: 100%;
}
.nh-testimonial-carousel .e-n-carousel.swiper {
    height: 100%
}
.nh-cp {
	--nh-cp-accent: #0052CC;
	--nh-cp-track: #CCCCCC;
	--nh-cp-bg: #EDECEB;
	--nh-cp-text: #111111;
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	box-sizing: border-box;

	font-family: 'DM Sans', sans-serif;
	pointer-events: none;
	user-select: none;
}
.nh-cp *,
.nh-cp *::before,
.nh-cp *::after {
	box-sizing: border-box;
}
.nh-cp__dot {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	color: var(--nh-cp-text);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .5px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
	transition: background .4s ease, color .4s ease, box-shadow .4s ease;
}
.nh-cp__dot.is-active {
	background: var(--nh-cp-accent);
	color: #FFFFFF;
}
.nh-cp__track {
	flex: 1 1 auto;
	height: 6px;
	border-radius: 999px;
	background: var(--nh-cp-track);
	overflow: hidden;
}
.nh-cp__fill {
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: var(--nh-cp-accent);
	transition: width .5s ease;
}
.nh-cp__end {
	display: flex;
	gap: 8px;
	flex: 0 0 auto;
}
@keyframes nh-cp-hop {
	0%   { transform: translateY(0); }
	40%  { transform: translateY(-2px); }
	100% { transform: translateY(0); }
}
.nh-cp__dot.is-jump {
	animation: nh-cp-hop .35s ease;
}
.nh-grid-cards-hover {
    overflow: hidden;
}
.nh-grid-cards-hover:hover {
    box-shadow: 0 1.35rem 3.4rem rgba(21, 21, 21, 0.2);
}
.nh-grid-cards-hover:hover::before {
    opacity: 1;
    transform: translateX(42%) rotate(8deg);
}
.nh-grid-cards-hover::before {
    position: absolute;
    height: 100vh;
    z-index: 0;
    content: "";
    background: linear-gradient(105deg, transparent 12%, rgba(255, 255, 255, 0.05) 34%, transparent 60%);    
    opacity: 0;
    pointer-events: none;
    transform: translateX(-42%) rotate(8deg);
    transition: opacity 220ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Contact form steps */
.step-progress {
  width: 100%;
  padding: 14px 0px 20px;
  box-sizing: border-box;
}
.step-progress__label {
  display: block;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
  color: #222;
}
.step-progress__track {
  width: 100%;
  height: 12px;
  background: #ddd;
  border-radius: 999px;
  overflow: hidden;
}
.step-progress__fill {
  height: 100%;
  background: #0052CC;
  border-radius: 999px;
  transition: width 0.4s ease;
}

/* Careers */
.roles {
  color: #111111;
  font-family: "DM Sans", sans-serif;
}
.roles *, .roles *::before, .roles *::after { 
    box-sizing: border-box; 
}
.roles .sr-only { 
    position: absolute; 
    left: -9999px; 
}
.roles-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.roles .browse { 
    display: flex; 
    align-items: center; 
    gap: 20px; 
    font-size: 20px; 
    font-weight: 500;
}
.roles button.pill {
  background: #0F131F;
  color: #ffffff;
  border: 0;
  border-radius: 999px;
  padding: 10px 48px;
  font-size: 18px;
  text-transform: capitalize;
}
.roles button.pill:hover {
    background: #01ABFA;
}
.roles .count { 
    font-size: 16px;
    font-weight: 500;
}
.roles .roles-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 12px 30px;
  overflow-x: auto;
}
.roles .roles-table { 
    width: 100%; 
    border-collapse: collapse; 
    font-size: 16px; 
    border: 0;
    margin: 0;
}
.roles .roles-table th {
  text-align: left;
  font-weight: 500;
  font-size: 14px;
  color: #5b6275;
  padding: 18px 16px 14px 0;
  border-bottom: 1px solid #e6e9f0;
  border-left: 0;
  border-right: 0;
}
.roles .roles-table td {
  padding: 16px 16px 16px 0;
  border-bottom: 1px solid #e6e9f0;
  vertical-align: middle;
  border-left: 0;
  border-right: 0;
}
.roles .roles-table tr:last-child td { 
    border-bottom: 0; 
}
.roles .roles-table .position { 
    font-weight: 700; 
    font-size: 18px; 
}
.roles .roles-table .action { 
    text-align: right; 
    padding-right: 0; 
    white-space: nowrap; 
}
.roles .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #01ABFA;
  color: #ffffff;
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  padding: 12px 20px;
  border-radius: 999px;
  transition: background .2s;
  border: 1px solid #01ABFA;
  line-height: 18px;
}
.roles .btn:hover { 
    background: transparent;
    color: #01ABFA;
}

/* SB Services home */
.sb-faq-acc .e-n-accordion-item {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1rem 2.5rem rgba(18, 18, 18, 0.06);
}

/* Services Post (PAGE) */
.arrow-up-btn .elementor-button-content-wrapper {
    align-items: center;
    text-align: left;
}
.arrow-up-btn.white .elementor-button-icon {
    background: #FFFFFF;
    color: #039DDB !important;
    fill: #039DDB !important;
}
.arrow-up-btn .elementor-button-icon {
    font-size: 20px;
    padding: 14px;
    background: #039DDB;
    border-radius: 99px;
    transition: all 500ms ease;
}
.nh-svcs-card:hover .arrow-up-btn .elementor-button-icon {
    background: #FFFFFF !important;
    fill: #039DDB;
    color: #039DDB !important;
    transform: scale(1.05);
}
.carousel-no-overflow .e-n-carousel.swiper {
	overflow: hidden !important;
}
.car-w-pbar .e-n-carousel.swiper,
.car-w-bpagi .e-n-carousel .swiper {
    overflow: visible;
}
.car-w-pbar .swiper-pagination {
    position: relative;
    margin-top: 1.4rem;
    height: 5.11px;
    border-radius: 3px;
    overflow: hidden;
}
.car-w-pbar span.swiper-pagination-progressbar-fill {
    background: #01ABFA !important;
}
.car-w-bpagi span.swiper-pagination-bullet {
    transition: width 300ms ease;
}
.car-w-bpagi span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 2.1rem;
    border-radius: 8px;
}

/* case studies image hover effects */
.nh-cws-card-img::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent 18%, rgba(0, 0, 0, 0.1) 48%, rgba(0, 0, 0, 0.76) 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}
.nh-cws-card-img:hover::after {
    opacity: 1;
}
.nh-cws-card-img img {
	aspect-ratio: 4 / 3;
	min-height: 320px;
}
.nh-cws-card-img:hover img {
    transform: scale(1.065)
}
.icon-box-plus {
    opacity: 0;
    transform: translateY(-6px);
    transition: transform 0.3s ease, opacity 0.3s ease;
}
.nh-cws-card-img:hover .icon-box-plus {
    opacity: 1;
    transform: unset;
}
.not-fullwidth {
    width: auto;
}


/* Header and Footer */
.main-header .floating-header-bar {
    backdrop-filter: blur(10px);
}
.main-header .floating-header-bar:has(.hfe-flyout-show) {
    backdrop-filter: none; /* Disable backdrop-filter because it breaks layout of off-canvas menu */
}
.main-footer p {
    margin-bottom: 0;
}
.main-footer a {
    color: #FDFDFB;
}
.main-footer .legal-tnc-section a {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Blog Home */
.asp-ratio-16-9 img {
    aspect-ratio: 16/9;
    object-fit: cover;
}
.blog-post-wrap .elementor-widget-theme-post-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.blog-post-wrap .elementor-widget-post-info .elementor-post-info {
    margin: 0 !important;
}
.blog-post-wrap .elementor-widget-post-info .elementor-post-info .elementor-icon-list-item {
    margin: 0 !important;
    border: 1px solid #dad4da;
    padding: 3px 8px;
    border-radius: 8px;
}
.recent-blog-posts .elementor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto 1fr; /* 3rd row soaks up the extra height */
    align-items: start;
}
.recent-blog-posts .elementor-grid .e-loop-item:first-child {
    grid-column: 1;
    grid-row: 1 / span 3; /* span all three rows */
}
.recent-blog-posts .elementor-grid .e-loop-item:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
}
.recent-blog-posts .elementor-grid .e-loop-item:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
}
.recent-blog-posts .elementor-grid .e-loop-item:nth-child(2) a > .e-con-inner,
.recent-blog-posts .elementor-grid .e-loop-item:nth-child(3) a > .e-con-inner {
    flex-direction: row;
}
.recent-blog-posts .elementor-grid .e-loop-item:nth-child(2) a>.e-con-inner > *, .recent-blog-posts .elementor-grid .e-loop-item:nth-child(3) a>.e-con-inner > * {
    width: 100%;
}

/* ============= Single Blog Post ============= */
/* Horizontal progress bar */
.post-read-progress-tracker-bar {
  position: relative;
  width: 100%;              /* or a fixed width, e.g. 200px */
  height: 2px;
  background: #e5e5e5;
  border-radius: 4px;
  overflow: hidden;
}
.post-read-progress-tracker-bar::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: var(--progress, 0%);
  background: var(--e-global-color-accent);         /* your brand colour */
  transition: width .1s linear;
}
/* TOC */
.table-of-contents-list ul { list-style: none; margin: 0; padding: 0; }
.table-of-contents-list li { opacity: .6; transition: opacity .2s, color .2s; margin-bottom: 6px;}
.table-of-contents-list li a { color: inherit; text-decoration: none; }
.table-of-contents-list li.active { opacity: 1; font-weight: 600; color: #000; }
/* Optional: indent sub-headings */
.table-of-contents-list li.toc-h3 { padding-left: 12px; }
.table-of-contents-list li.toc-h4 { padding-left: 24px; }
/* Smooth jump, with space for any sticky header */
html { scroll-behavior: smooth; }
.blog-post-track-progress .heading-tracker,
.blog-post-track-progress [id] { scroll-margin-top: 120px; }
.blog-post-track-progress .heading-tracker .elementor-heading-title {margin-top: 0px;}
.blog-post-track-progress .elementor-widget-text-editor ul,
.blog-post-track-progress .elementor-widget-text-editor ol {
    margin-left: 20px;
}
.blog-sticky-sidebar .elementor-author-box__bio {
    display: none;
}
.blog-sticky-sidebar .elementor-share-btn {
    border: 1px solid #E9E6E9;
    border-radius: 8px;
    width: 40px;
}
.blog-sticky-sidebar .elementor-author-box__avatar img {
    box-shadow: none;
}
.blog-related-posts .elementor-heading-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.blog-related-posts .elementor-widget-theme-post-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.blog-post-track-progress .elementor-widget-heading .elementor-heading-title {
    margin-top: 16px !important;
    margin-bottom: 16px;
}
.blog-post-track-progress .e-con-inner > .elementor-widget-heading:first-child .elementor-heading-title {
    margin-top: 0px !important;
}
.blog-post-track-progress p {
    margin-bottom: 16px;
}
.table-of-contents-list .toc-item a {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/*  */
.video-card-hover .elementor-custom-embed-image-overlay {
    transition: transform 300ms ease;
}
.video-card-hover .elementor-custom-embed-image-overlay:hover {
    transform: scale(1.06);
}

/* ------------------------- Sysbrillance Responsive ------------------------- */

@media (max-width: 1024px) {
	.scrolling-footer-marquee__track span {
		font-size: 64px;
	}
    .sb-cs-filters + .sb-cs-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .logos-carousel.nbl-carousel .swiper-slide-image {
        height: 48px;
    }
    .bottom-progress .swiper-pagination.swiper-pagination-progressbar.swiper-pagination-horizontal {
        display: block;
    }
    .recent-blog-posts .elementor-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
        grid-auto-rows: auto;
        align-items: stretch; /* equal-height cards per row */
    }

    .recent-blog-posts .elementor-grid .e-loop-item:first-child,
    .recent-blog-posts .elementor-grid .e-loop-item:nth-child(2),
    .recent-blog-posts .elementor-grid .e-loop-item:nth-child(3) {
        grid-column: auto;
        grid-row: auto;
    }

    /* Put the cards back to stacked layout inside narrower columns */
    .recent-blog-posts .elementor-grid .e-loop-item:nth-child(2) a > .e-con-inner,
    .recent-blog-posts .elementor-grid .e-loop-item:nth-child(3) a > .e-con-inner {
        flex-direction: column;
    }
}
@media screen and (max-width: 767px) {
    .sb-cs-filters .sb-cs-pill, .sb-cs-filters .sb-cs-dd__toggle {
        font-size: 16px;
        padding: 10px 18px;
        text-transform: none;
    }
    .sb-cs-filters .sb-cs-pill.sb-cs-pill--all {
        width: 100%;
    }
    .roles .roles-bar { 
        flex-direction: column; 
        align-items: flex-start; 
        gap: 12px; 
    }
    .roles .roles-table thead { 
        position: absolute; 
        left: -9999px; 
    }
    .roles .roles-table, 
    .roles .roles-table tbody, 
    .roles .roles-table tr, 
    .roles .roles-table td { 
        display: block; 
        width: 100%; 
    }
    .roles .roles-table tr { 
        padding: 20px 0; 
        border-bottom: 1px solid #e6e9f0; 
    }
    .roles .roles-table tr:last-child { 
        border-bottom: 0; 
    }
    .roles .roles-table td { 
        border: 0; 
        padding: 4px 0; 
    }
    .roles .roles-table td[data-label]::before {
        content: attr(data-label) ": ";
        color: #5b6275;
        font-size: 14px;
    }
    .roles .roles-table .action { 
        text-align: left; 
        padding-top: 14px; 
    }
    .nh-carousel-card .nh-c-inner-hover-card {
        transform: translateY(62px);
    }
    .sb-cs-filters__label {
	    font-size: 1.05rem;
    }
    .sb-cs-dd,
	.sb-cs-dd__toggle { width: 100%; min-width: 0; }
	.sb-cs-count { margin-left: 0; width: 100%; }
    
    .recent-blog-posts .elementor-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}
@media (max-width: 640px) {
    .sb-cs-filters + .sb-cs-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .logos-carousel.nbl-carousel .swiper-slide-image {
        height: 28px;
    }
    .nh-cws-card .num-span span {
        color: #FFDF73 !important;
    }
}
@media (max-width: 639px) {
	.numbered-grid__item {
		min-height: 0;
	}
	.numbered-grid__item--image {
		min-height: min(16rem, 75vw);
	}
	.numbered-grid__image--none {
		object-fit: scale-down;
		padding: clamp(0.75rem, 2.4vw, 2.35rem);
	}
	.numbered-grid__item > div {
		padding-top: 0.75rem;
	}
	.numbered-grid__text {
		font-size: 1.15rem;
	}
	.numbered-grid--vertical-steps .numbered-grid__progress {
		padding: 1rem 0 1.25rem;
	}
	.numbered-grid--vertical-steps .numbered-grid__item {
		position: sticky;
		top: clamp(4.5rem, 12vh, 6rem);
		width: 100%;
		min-height: 18rem;
		margin-bottom: 1rem;
		padding: 1.4rem var(--en-page-gutter);
		box-sizing: border-box;
	}
	.numbered-grid--vertical-steps .numbered-grid__item h2 {
		font-size: clamp(1.9rem, 9vw, 3rem);
	}
	.numbered-grid--vertical-steps .numbered-grid__cta {
		box-sizing: border-box;
	}
	.numbered-grid--timeline .numbered-grid__header {
		position: relative;
		top: auto;
		padding: 0;
		background: transparent;
	}
	.numbered-grid--timeline .numbered-grid__items {
		display: flex;
		gap: 0;
		margin: 0;
		padding: 0.25rem 0 1.25rem;
		overflow-x: auto;
		overflow-y: visible;
		overscroll-behavior-inline: contain;
		scroll-padding-inline: 0;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		flex-wrap: nowrap!important;
		flex-direction: row;
	}
	.numbered-grid--timeline .numbered-grid__items::-webkit-scrollbar {
		display: none;
	}
	.numbered-grid--timeline .numbered-grid__item {
		display: grid!important;
		grid-template-columns: minmax(0, 1fr)!important;
		grid-template-rows: 2rem auto;
		gap: 1rem!important;
		width: auto;
		min-width: 0;
		min-height: 18rem!important;
		flex: 0 0 min(84vw, 26rem);
		padding: 0 1.5rem 0 0!important;
		overflow: visible!important;
		scroll-snap-align: start;
		scroll-snap-stop: always;
	}
	.numbered-grid--timeline .numbered-grid__item .numbered-grid__line {
		top: 0.84rem;
		right: 0;
		bottom: auto;
		left: 1rem;
		width: auto;
		height: 0.32rem;
	}
	.numbered-grid--timeline .numbered-grid__line::before {
		transform: scaleX(0);
		transform-origin: left;
	}
	.numbered-grid--timeline .numbered-grid__item.is-passed .numbered-grid__line::before {
		transform: scaleX(1);
	}
	.numbered-grid--timeline .numbered-grid__item.is-active .numbered-grid__line::before {
		transform: scaleX(0.5);
	}
	.numbered-grid--timeline .numbered-grid__item > div:nth-child(2) {
		grid-column: 1;
		grid-row: 2;
		padding: 0 0.75rem 0 0;
		/* padding-top: 10px!important; */
	}
	.numbered-grid--timeline .numbered-grid__item h2 {
		font-size: 1.55rem;
	}
	.numbered-grid--timeline .numbered-grid__text {
		font-size: 1.05rem;
	}
	.numbered-grid__cta {
		width: 100%;
		justify-content: center;
	}
	.numbered-grid--grid .numbered-grid__header .numbered-grid__cta,
	.numbered-grid--vertical-steps .numbered-grid__header .numbered-grid__cta {
		display: none;
	}
	.numbered-grid--grid .numbered-grid__cta--mobile-after,
	.numbered-grid--vertical-steps .numbered-grid__cta--mobile-after {
		display: inline-flex;
		margin-top: 1.5rem;
	}
	.numbered-grid--timeline .numbered-grid__item > div:nth-child(1), 
	.numbered-grid--timeline .numbered-grid__item > div:nth-child(3) {
	    padding: 0;
	}
}
/* Min-Width */
@media (min-width: 768px) {
    .csh-fw.car-w-pbar .swiper-pagination.swiper-pagination-progressbar.swiper-pagination-horizontal {
        display: none;
    }
}