/* test */
@charset "UTF-8";
/* CSS Document */
@media screen and (max-width:1199px) {
    h2 {
        letter-spacing: -1px !important;
    }
    h2.figures {
        font-size: 9.75rem !important;
        margin-top: 35px;
        margin-bottom: 0px;
    }
    p.legend {
        font-size: 40px;
    }
    .navik-header {
        position: fixed; top:0; left: 0; width: 100%
    }
    .glass-container {
        height: 50vh; /*max-height: calc(90vh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); */
    }
    .navik-menu ul li.current-menu > a, .navik-menu ul li:hover > a {
        color: #000;
        background: linear-gradient(315deg, #00c6ff, #0072ff);
        border-radius: 6px;
    }
	
	
	.navik-menu ul li > a {
 
  padding: 8px 16px;

}
	
	.navik-header-container {
  position: relative;
  /*height: 100vh;*/
}
	
	.navik-menu ul ul li > a {

  background-color: transparent;
}
	 .burger-menu {
    position: absolute;
    top: 18px !important;
  }
	
	 .navik-header .logo {
    float: left;
    padding: 15px 40px 15px 0 !important;
    padding-top: 30px;
    padding-right: 40px;
    padding-bottom: 30px;
    padding-left: 0px;
  }
	
	.videobg video {
    display:inherit !important;
  }
	
	.title--subtitle h4 {
  font-weight: 500;
  color: #fff;
		font-size: 6vw;}

	
	
	
    .hero {
        top: 54px !important;
    }
    /*h2{font-size:8vw !important}*/
    .menu-container {
        background-color: #000;
    }
    h2.message {
        margin-left: 15px;
    }
    .navik-header.header-transparent {
        background: #000;
    }
}
@media screen and (min-width:992px) {
    .edge-browser .menu-container {
        border-radius: 250px;
        background: red;
        padding-left: 50px;
        padding-right: 50px;
        margin-top: 10px;
        backdrop-filter: blur(16px) saturate(90%);
        background: rgba(0, 0, 0, 1) !important;
        ms-backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(90%); /* For Safari support */
    }
    .edge-browser .navik-header.sticky .menu-container {
        background: #fff !important;
    }
    img.corporate-logo {
        height: 36px;
    }
    .hero {
        height: 100vh !important;
        height: 100svh !important;
    }
    .title.title-3.light-orange {
        backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(107%);
        background-color: rgba(248, 157, 14, 0.11);
        border-radius: 24px;
        border-top: 0px solid var(--wst-orange);
        padding: 5vh 3vw;
        box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -webkit-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -moz-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
    }
    .title.title-3 {
        backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(107%);
        background-color: rgba(236, 236, 236, 0.32);
        border-radius: 24px;
        border-top: 0px solid var(--wst-orange);
        padding: 5vh 3vw;
        box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -webkit-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -moz-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
    }
    .hero .title.title-4 {
        border-top: 0px solid var(--wst-orange);
        background: black;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(107%);
        padding: 25px;
        bottom: 0px;
    }
    /*  .title.title-4 {
    border-top: 0px solid var(--wst-orange);
    padding: 2vh 2vw;
    background: black;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(16px) saturate(90%);
    -webkit-backdrop-filter: blur(16px) saturate(107%);
    padding-top: 25px;
    padding: 100px;
    bottom: 40px;
    padding-bottom: 50px;
    padding-top: 75px;
  }*/
}
@media screen and (max-width:1024px) {
	div.spacer{ height: 30vh !important}
	.tag-container {

		padding: 25px;}
	.scene-title h2.big-title {
  font-size: 6vw !important;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 0;
  letter-spacing: -1px !important;
}
	.case-box{height: 100% !important}
	
	#video-animation .big-title {
  font-size: 38px !important;
  font-weight: 800;
  color: white;
  margin-bottom: 1rem;
  text-align: center;
  
  letter-spacing: -1px !important;
}
    .glass-container {
        height: 78.5vh; /*max-height: calc(90vh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); */
    }
    .subheader::before {
        /* background: #002968 !important;
    opacity: .5;*/
    }
    /*  .menu-slide .nav-menu-wrapper {
    background-color: #1834cb;
    backdrop-filter: blur(16px) saturate(90%);
    -webkit-backdrop-filter: blur(16px) saturate(107%);
    border-bottom-left-radius: 16px;
    border-top-left-radius: 16px;
  }*/
    .header-dark .nav-menu-wrapper {
        background-color: #fff;
    }
    .hero .background-image-holder {
        /*  background-image: none !important;*/
    }
}
@media screen and (max-width:1199px) {
	
	.navik-menu ul li > a{
	  color: #fff !important;
font-weight: 400 !important; 
}
	
	.border {border:0 !important}
	
	.navik-menu ul ul li:hover > a {
  background-color: transparent;
}
	.dropdown-plus::before, .dropdown-plus::after {

  background-color: #fff;
}
    .custom-card2 {
        position: relative;
        aspect-ratio: 5 / 3;
    }
    .line-menu {
        position: relative;
        background-color: #fff;
    }
    .white-1200 {
        padding: 0 1.87em;
        background: white
    }
    ul.second-line {
        margin-left: 15px;
    }
    .custom-card {
        aspect-ratio: 1 / 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .custom-card .card-center {
        flex-grow: 0;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .custom-card ul.list {
        margin-top: auto;
    }
}
@media screen and (min-width:768px) {
    img.corporate-logo {
        height: 24px !important;
        width: auto;
    }
    navik-header .logo {
        float: left;
        padding: 20px 40px 6px 0;
    }
    /*.navik-header .logo img {
    margin-bottom: 0px;
  }*/
    .burger-menu {
        position: absolute;
        top: 34px;
    }
    .navik-menu ul li > a {
        /* font-family: "PP Neue", sans-serif;*/
        font-size: 15px;
        font-weight: 700;
        text-transform: none;
        font-style: normal !important;
    }
    .menu-slide .nav-menu-wrapper {
        width: 600px;
        background-color: #fff;
        /* backdrop-filter: blur(16px) saturate(60%);
    -webkit-backdrop-filter: blur(16px) saturate(60%);*/
    }
    /*  .menu-overlay-link {
    border-bottom: 1px solid;
    line-height: 3.5em;
  }*/
}
@media screen and (min-width:1200px) {
	
	 .navik-header.sticky .logo {
    padding: 0;
  }
    /*  .navik-header .logo {
float: none !important;
padding: 0 !important;
top: 0;
-webkit-transform: translateY(0%);
transform: translateY(0%);
border-bottom-right-radius: 25px;
box-shadow: 2.8px 2.8px 2.2px rgb(0 0 0 / 2%), 6.7px 6.7px 5.3px rgb(0 0 0 / 3%), 12.5px 12.5px 10px rgb(0 0 0 / 4%), 22.3px 22.3px 17.9px rgb(0 0 0 / 4%), 41.8px 41.8px 33.4px rgb(0 0 0 / 5%), 100px 100px 80px rgb(0 0 0 / 7%);
background: rgb(79, 95, 135);
background: linear-gradient(315deg, rgb(40, 93, 227) 0%, rgb(40, 93, 227) 50%);
z-index: 100;
width: 200px;
height: 150px;
border-radius: 0;
position: fixed;
left: 25px;
border-bottom-right-radius: 12px;
	border-bottom-left-radius: 12px;
	}*/
	
	.menu-container {
  width: 90vw;
  margin-left: 5vw;
	max-width: 90vw;
}
    .cta-3 .switchable__text {
        margin-top: 0;
    }
	
	 .round-bg {
    border-radius: 1em;
    background-color: #202020;
    padding: 40px;
    height: 100%;
  }
	 .navik-menu li > ul ul {
  
    left: -100% !important;
  }
	
	.navik-menu ul ul.second-line li > a {

  color: white;
}
    .navik-header .logo img {
        /* filter: brightness(100) !important;*/
        text-align: center;
        margin: auto;
        max-height: 66px;
        height: 66px;
        width: auto;
    }
    div.logo a {
        display: flex;
        align-items: center;
        width: 180px;
    }
    .hero {
        height: 100vh !important;
        height: 100svh !important;
    }
    .navik-header-container {
        height: 60px !important;
    }
    .navik-menu > ul > li > a {
        position: relative;
        box-sizing: border-box;
        height: 60px;
        padding: 0 20px;
        line-height: 60px;
        white-space: nowrap;
    }
    .navik-menu ul li > a {
        /*  font-family: "PP Neue", sans-serif;*/
        font-size: 15px;
        font-weight: 700;
        text-transform: none;
    }
    .navik-header.sticky .navik-menu > ul > li > a {
        height: 60px;
        line-height: 60px;
        color: #fff;
    }
    .navik-header {
        /* backdrop-filter: blur(16px) saturate(90%);
  background: rgba(0, 0, 0, 0.15) !important;*/
        background: transparent !important;
    }
    .navik-header.sticky {
        /*   backdrop-filter: blur(16px) saturate(90%);
background: rgba(255, 255, 255, 0.35) !important;*/
    }
    .navik-header.sticky {
        /*  backdrop-filter: blur(16px) saturate(90%);
    background: rgba(255, 255, 255, 0.55);*/
        background: transparent !important;
    }
    .navik-header.sticky .menu-container {
        backdrop-filter: blur(16px) saturate(90%);
        background: rgba(0, 0, 0, 0.49) !important;
    }
    .header-opacity-on .navik-menu > ul > li.current-menu > a, .header-opacity-on .navik-menu > ul > li:hover > a, .header-transparent-on .navik-menu > ul > li.current-menu > a, .header-transparent-on .navik-menu > ul > li:hover > a {
        color: #fdfdfd;
    }
    .navik-menu ul ul li > a {
        position: relative;
        padding: 14px 15px 14px 30px !important;
        color: #fff;
        background-color: transparent;
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        transition: all .2s ease-out;
    }
    .navik-menu ul ul li:hover > a {
        padding-left: 30px !important;
        color: #fff;
        background-color: transparent;
        font-weight: 700;
    }
    .navik-menu ul.second-line {
        border-bottom-left-radius: 16px;
        border-bottom-right-radius: 16px;
        backdrop-filter: blur(16px) saturate(90%);
        background: rgb(14, 70, 201);
    }
    .navik-menu ul ul li > a::before {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 0;
        height: 28px;
        content: "";
        background: #fff !important;
        transition: all .2s ease-in-out;
    }
    .navik-menu ul ul li:hover > a::before {
        width: 3px;
    }
    .navik-menu ul li.current-menu > a, .navik-menu ul li:hover > a {
        color: #fff;
        font-weight: 700;
    }
    .navik-header .logo img {
        height: 24px !important;
        margin-bottom: 0px;
        margin-top: 0px;
        margin-left: 0px;
        /* margin-bottom: 0px;*/
    }
    /* Navik sticky transition */
    .sticky .navik-menu ul li.current-menu > a, .navik-menu ul li:hover > a {
        color: #fff !important;
        font-weight: 700;
    }
    .sticky .navik-menu ul ul li > a {
        position: relative;
        padding: 14px 15px 14px 30px !important;
        color: #fff !important;
        background-color: transparent;
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        transition: all .2s ease-out;
    }
    .sticky .navik-menu ul ul li:hover > a {
        padding-left: 30px !important;
        color: #fff;
        background-color: transparent;
        font-weight: 700;
    }
    .sticky .navik-menu ul.second-line {
        border-bottom-left-radius: 16px;
        border-bottom-right-radius: 16px;
        backdrop-filter: blur(16px) saturate(90%);
        background: rgb(14, 70, 201) !important;
    }
    .sticky .navik-menu ul ul li:hover > a::before {
        width: 3px;
    }
    .sticky .navik-menu ul ul li > a::before {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 0;
        height: 28px;
        content: "";
        background: #000 !important;
        transition: all .2s ease-in-out;
    }
    /* end sticky transition*/
    .hww img {
        scale: .6;
    }
    .glass-container {
        height: 50vh;
        max-height: calc(90vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    }
    .menu-overlay-link {
        border-bottom: 1px solid #E5E5E5;
        line-height: 71px;
    }
    .container {
        /* max-width: 1440px;*/
    }
    .mt-75 {
        margin-top: 75px;
    }
    .container-70 {
        max-width: 70%;
    }
    .container-80 {
        max-width: 80%;
    }
    .container-90 {
        max-width: 90%;
    }
    .white-1200 {
        max-width: 80%;
        margin: auto;
    }
}
@media screen and (max-width: 1280px) and (max-height: 720px) {
    .menu-overlay-link {
        border-bottom: 1px solid;
        line-height: 2.7em;
    }
}
@media screen and (max-width:768px) {
	.summary-image img {
  top: 0px;
  position: relative;
}
	.summary-image {height:inherit !important}
	.hero1 {top:125px; position: relative;}
	#observer-slides p {
  font-size: 24px;
		font-weight: 500;}
	.gartner-box{padding:2em !important; margin-bottom: 15px;}
	
    h2.figures {
        font-size: 7.75rem !important;
        margin-top: 0px;
        margin-bottom: 0px;
    }
	.round-bg{padding: 15px !important}
	.circle-container{margin-bottom: 20px; transform:scale(80%)}
	.gray-box{padding: 20px !important}
	.shuffle{display: none;}
	.tag-container ul{display: none;}
    .imageblock .imageblock__content {
        position: relative;
        min-height: 18.57142857em;
        height: 100vh;
        height: 100svh;
    }
    .grid-lines {
        background-image:
            linear-gradient(rgba(255, 255, 255, 0.15) 2px, transparent 2px), linear-gradient(90deg, rgba(255, 255, 255, 0.15) 2px, transparent 2px), linear-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
        background-size: 60px 60px, 60px 60px, 12px 12px, 12px 12px;
        background-position: -1px -1px, -1px -1px, -0.5px -0.5px, -0.5px -0.5px;
    }
    /* svg:not(.buttonc svg) {
        margin-bottom: 20px;
    }*/
    span.page-desc {
        right: 10px;
    }
    .sticker {
        height: 100vh;
        height: 100svh;
    }
    .video-cover .video-play-icon {
        position: absolute;
        top: 85%;
        left: 50%;
        transform: translate3d(-50%, -50%, 0);
        -webkit-transform: translate3d(-50%, -50%, 0);
        width: 40px;
    }
    .bg-man {
        background-position: left bottom !important;
    }
    .xs-white {
        color: white !important;
    }
    .icon-container {
        top: 0px;
        right: 15px;
    }
    .footer-fineprints {
        text-align: center !important
    }
    .social-list {
        display: block;
        margin: auto;
        text-align: center;
    }
    .title.title-6 {
        padding: 15px !important;
        padding-top: 20px !important
    }
    h2.big-title {
        font-size: 32px !important;
        letter-spacing: -1px !important;
    }
    .pillar-text {
        background-size: contain;
        background-position: center;
    }
    .pillar-text p.desc {
        color: #484848 !important;
        font-size: 2.35vmax;
        position: sticky;
        top: 80%;
        letter-spacing: -0.5px;
        font-weight: 600;
        line-height: 1;
    }
    h2.h2 {
        font-size: 3.6vmax;
        letter-spacing: -0.1vw;
        font-weight: 600;
        line-height: .9;
    }
    img.corporate-logo {
        height: 36px;
    }
    .line-menu {
        height: 2px;
        background-color: #fff;
    }
    .dropdown-plus::after, .dropdown-plus::before {
        background-color: #d233ff;
    }
    .navik-menu ul ul li > a {
        border-bottom: 1px solid gray;
    }
}
@media screen and (max-width:768px) {
	.interaction-buttons {
  display: flex;
  gap: 10px;
  margin-top: -25px;}
	
	.process-details p, .process p {max-width: 380px}
	
		
		.case-box.expanded {
  background-color: #1a1a1a;
  max-width: 100cqw;

}
	.interaction-btn{line-height: 1}
	
	#interactionArea{height: 100px;
  top: 400px;
  width: 100%;}
	
	#interactionArea .step-icon{display: none;}
	
	.testimonial{padding:30px;}
	.navik-menu ul li {
  position: relative;
  display: block;
  clear: both;
}
	.fixed-footer h2{ font-size:40px; font-weight: 500; margin-left: 40px}
	
	.subpage h3 {margin-top:50px;}
	
	.i-image .col-md-8 {padding:15px !important}
	.i-image h3{font-size: 36px !important}
	.i-image-resize{width:100vw !important}
	.i-image {background: none !important}
	
	.industriesm img:not(.card-icon), .feature-large img {
  border-radius: 1rem;
}
.br-right-1 {
  border-right: none !important;
}
	
	.card-icon {width:5cqw; height: auto;}
    p.legend {
        font-size: 30px;
        text-align: center;
    }
    .tagline {
        font-size: 15.5cqw;
    }
    .hero-messages h2 {
        font-size: 10vw;
    }
    .slider ul li {
        padding-top: 75px;
    }
    .slider h2 {
        font-size: 30px;
    }
    ul.menu-vertical li:first-child {
        margin-top: .92857143em;
    }
    .title--heading h1 {
        color: #fff;
        letter-spacing: -2px;
        margin-bottom: 5px;
        color: #fff !important;
        font-size: 32px;
    }
    p.lead {
        color: #808080;
        line-height: 1.25;
        font-size: 18px;
    }
    .attributes {
        height: 40vh;
        padding-top: 20%;
    }
    .footer-logo {
        display: none;
    }
    h5.footer-title {
        font-size: 1.3em;
        line-height: 1;
        margin-bottom: .5em;
        letter-spacing: -0.3px;
    }
    .p-1, .p-2, .p-3, .p-4, .p-5, .pl-1, .pl-2, .pl-3, .pl-4, .pl-5, .pr-1, .pr-2, .pr-3, .pr-4, .pr-5, .m-1, .m-2, .m-3, .m-4, .m-5, .ml-1, .ml-2, .ml-3, .ml-4, .ml-5, .mr-1, .mr-2, .mr-3, .mr-4, .mr-5 {
        margin-right: 0px !important;
        margin-left: 0px !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .burger-menu {
        position: absolute;
        top: 18px;
        right: 14px;
    }
    .navik-header .logo {
        padding: 15px 0px;
        text-align: center;
        text-align: left;
    }
    .navik-header .logo img {
        height: 24px;
        width: auto
    }
    #page-title1 {
        height: 100vh !important;
        height: 100svh !important;
    }
    .subpage p:last-child {
        margin-bottom: 1.85714286em;
    }
}
@media (min-width: 600px) { /* Adjust the width as needed */
    .menu-vertical {
        flex-direction: row; /* Aligns items horizontally on larger screens */
        flex-wrap: wrap; /* Allows items to wrap to the next line */
    }
    .menu-vertical .input-checkbox {
        flex: 1; /* Each item takes equal width */
        margin-right: 10px; /* Adds space between items */
    }
}
@media (min-width: 993px) {
    .title-right {
        backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(107%);
        background-color: rgba(255, 255, 255, 0.21);
        border-radius: 24px;
        padding: 50px 50px;
        box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -webkit-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -moz-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
    .title-left {
        backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(107%);
        background-color: rgba(255, 255, 255, 0.21);
        border-radius: 24px;
        padding: 50px 10px;
        box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -webkit-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        -moz-box-shadow: -1px 1px 30px 2px rgba(0, 0, 0, 0.14);
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
}
@media screen and (min-width: 1200px) {
    .tessaract::before {
        content: "";
        background-image: url("../images/tessaract.png");
        background-size: 60px auto;
        background-repeat: no-repeat;
        position: absolute;
        width: 60px;
        height: 70px;
        opacity: 1;
        margin-top: 20px;
        left: 50px;
        z-index: 10;
    }
    /*.container{max-width: 1540px !important;}*/
    .sticky .navik-menu ul ul li, .navik-menu ul ul li {
        display: flex;
        align-items: center; /* Vertically center */
        position: relative; /* Keep relative positioning for pseudo-elements like ::before */
    }
    .sticky .navik-menu ul ul li > a::before {
        position: absolute;
        top: 50%;
        left: 0px;
        transform: translateY(-50%); /* Vertically centers the ::before element */
        width: 0;
        height: 28px;
        content: "";
        background: #000 !important;
        transition: all .2s ease-in-out;
    }
    .navik-menu ul ul li > a::before {
        position: absolute;
        top: 50%;
        left: 0px;
        transform: translateY(-50%); /* Vertically centers the ::before element */
        width: 0;
        height: 28px;
        content: "";
        background: #fff !important;
        transition: all .2s ease-in-out;
    }
    .navik-menu.submenu-top-border li > ul {
        border-top: 3px solid #000;
    }
 .menu-container {
        border-radius: 250px;
    
        padding-left: 50px;
        padding-right: 50px;
        margin-top: 10px;
        backdrop-filter: blur(16px) saturate(90%);
        background: rgba(0, 0, 0, 0.15) !important;
        backdrop-filter: blur(16px) saturate(90%);
        -webkit-backdrop-filter: blur(16px) saturate(90%); 
    }


/* Top-left → bottom-right subtle glow */
.menu-container::before,
.menu-container::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}

/* top-left corner gradient (10% masked) */
.menu-container::before {
  background: linear-gradient(135deg, rgba(255,255,255,0.3) 0%, transparent 100%);
  -webkit-mask-image: linear-gradient(135deg, black 0%, transparent 10%);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: top left;
  -webkit-mask-size: 100% 100%;
  mask-image: linear-gradient(135deg, black 0%, transparent 10%);
  mask-repeat: no-repeat;
  mask-position: top left;
  mask-size: 100% 100%; pointer-events: none;border: 1px solid #ffffff4a;
}

/* bottom-right corner gradient (10% masked) */
.menu-container::after {
  background: linear-gradient(315deg, rgba(255,255,255,0.2) 0%, transparent 100%);
  -webkit-mask-image: linear-gradient(315deg, black 0%, transparent 10%);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: bottom right;
  -webkit-mask-size: 100% 100%;
  mask-image: linear-gradient(315deg, black 0%, transparent 10%);
  mask-repeat: no-repeat;
  mask-position: bottom right;
  mask-size: 100% 100%; pointer-events: none;border: 1px solid #ffffff4a;
}
	
	
	
	
	
/* make sure nav container doesn't draw an opaque background that blocks blur */
.sticky .navik-menu {
  background: transparent !important; /* ensure page is visible behind dropdown */
  position: relative; /* keep stacking context predictable */
}

/* the dropdown itself */
.sticky .navik-menu ul.second-line {
  position: absolute;        /* typical dropdown positioning */
  top: 100%;
  left: 0;
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
  background: transparent;   /* let ::before provide the translucent backdrop */
  overflow: visible;         /* allow content to show */
  z-index: 1000;             /* sit above page content */
}

/* pseudo-element that does the actual blur/tint */
.sticky .navik-menu ul.second-line::before {
  content: "";
  position: absolute;
  inset: 0;                  /* cover the whole dropdown */
  border-radius: inherit;
 
  backdrop-filter: blur(16px) saturate(90%);
  z-index: 0;                /* behind menu items */
  pointer-events: none;      /* won't swallow clicks */
}

/* ensure menu items are above the pseudo-element */
.sticky .navik-menu ul.second-line > li,
.sticky .navik-menu ul.second-line .menu-item {
  position: relative;
  z-index: 1;
}
	
}