
:root {
  --blue:       #0082f0;
  --black:      #000000;
  --white:      #ffffff;
  --ease:       cubic-bezier(0.4, 0, 0.2, 1);
  --dur:        320ms;
}

/* ── NAVBAR ── */
@media (max-width:1199px) {
	.hamburger.menu {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		width: 30px;
		height: 21px;
		background: transparent;
		border: none;
		cursor: pointer;
		padding: 0;
		z-index: 10;
		margin-left: auto;
		position: absolute;
		right: 15px;
	}
	.hamburger.menu .bar {
		width: 100%;
		height: 3px;
		background-color: #ffffff; 
		border-radius: 10px;
		transition: all 0.3s ease-in-out;
	}
	.hamburger.menu.close-icon .bar:nth-child(2) {
		opacity: 0;
		transform: translateX(5px);
	}
	.hamburger.menu.close-icon .bar:nth-child(1) {
		transform: translateY(9px) rotate(45deg);
	}
	.hamburger.menu.close-icon .bar:nth-child(3) {
		transform: translateY(-9px) rotate(-45deg);
	}
	.navbar {
		position: sticky;
		top: 0;
		z-index: 11;
		background: #000000;
		border-bottom: 0;
		height: 68px;
		display: flex;
		align-items: center;
		transition: box-shadow .3s;
	}
	.navbar.scrolled { 
		box-shadow: 0 4px 28px rgba(0,0,0,.10); 
	}
	.nav-item  {
		position: relative; height: 100%; display: flex; align-items: center; 
	}
	.mega-menu {
	  display: none; position: absolute; top: var(--nav-h); left: 50%;
	  transform: translateX(-50%); background: var(--white);
	  border: 1px solid var(--grey-mid); border-top: 3px solid var(--blue);
	  box-shadow: 0 16px 48px rgba(0,0,0,.13); min-width: 680px;
	  padding: 30px 32px; grid-template-columns: repeat(3,1fr); gap: 28px;
	  z-index: 901; animation: deskDrop .22s var(--ease) both;
	}
	.nav-right { display:flex; align-items:center; gap:8px; margin-left:auto; }
	.mob-overlay {
	  position:fixed; inset:0; background:rgba(0,0,0,.52); z-index:1000;
	  opacity:0; visibility:hidden; transition:opacity .32s,visibility .32s;
	}
	.mob-overlay.is-open { opacity:1; visibility:visible; }

	/* ── MOBILE DRAWER ── */
	.mob-drawer {
		position: fixed;
		top: 68px;
		right: 0;
		width: 100%;
		height: 100%;
		height: 100dvh;
		background: #fff;
		z-index: 1050;
		display: flex;
		flex-direction: column;
		transform: translateX(100%);
		transition: transform .36s var(--ease);
		overflow: hidden;
	}
	.mob-drawer.is-open { transform:translateX(0); }
	
	.mob-head {
		display: none;
	}
	.panel-wrap {
		flex:1; position:relative; overflow:hidden;
	}
	.nav-panel {
		position:absolute; inset:0;
		overflow-y:auto; overflow-x:hidden;
		-webkit-overflow-scrolling:touch;
		padding-bottom:20px;
		background:#fff;
		transform:translateX(100%);
		transition:none;
		will-change:transform;
		z-index:1;
	}
	.nav-panel::-webkit-scrollbar { width:3px; }
	.nav-panel::-webkit-scrollbar-thumb { background:var(--grey-mid); }

	.nav-panel.current {
	  transform:translateX(0);
	  z-index:2;
	  transition:none;
	}
	.nav-panel.enter-right {
	  transform:translateX(100%);
	  z-index:3;         
	  transition:none;  
	}
	.nav-panel.enter-right.run {
	  transform:translateX(0);
	  transition:transform var(--dur) var(--ease);
	}
	.nav-panel.enter-left {
	  transform:translateX(-30%); 
	  z-index:3;
	  transition:none;
	}
	.nav-panel.enter-left.run {
	  transform:translateX(0);
	  transition:transform var(--dur) var(--ease);
	}

	/* ── Nav row ── */
	.nav-row {
		display: flex;
		align-items: center;
		width: 100%;
		border-bottom: 1px solid #a1b1c1;
		position: relative;
		overflow: hidden;
		cursor: pointer;
		
	}
	.nav-row::before {
		content: '';
		position: absolute;
		inset: 0;
		background: var(--blue-light);
		transform: scaleX(0);
		transform-origin: left;
		transition: transform .22s var(--ease);
		z-index: 0;
	}
	.nav-row:hover::before { transform:scaleX(1); }

	.nav-row-btn, .nav-row-link {
		flex: 1;
		display: flex;
		align-items: center;
		padding: 20px;
		gap: 12px;
		font-size: 16px;
		font-weight: 600;
		color: var(--black);
		text-align: left;
		position: relative;
		z-index: 1;
		transition: color .18s;
		background: none;
		border: none;
		font-family: var(--font);
		cursor: pointer;
		text-decoration: none;
	}
	.nav-row .nav-row-link {
        text-decoration: none;
    }
	.row-text  { display:flex; flex-direction:column; gap:2px; }
	.row-title { font-size:16px; font-weight:600; line-height:1.2; }

	.row-title img.aix_logo {
		width: 90px;
		background-color: #1957e0;
        border-radius: 70%;
	}
	.row-title.ripple{
		width: 90px;
		height: 90px;
		position: relative;
	}
	/* ONLY pseudo elements should be absolute */
	.row-title.ripple::before,
	.row-title.ripple::after {
	    content: "";
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    width: 90px;
	    height: 90px;
	    border-radius: 50%;
	    transform: translate(-50%, -50%);
	    box-shadow: 0 0 0 0 rgba(25, 87, 224, 0.6);
	    animation: ripple2 4s infinite;
	}

	/* delays */
	.row-title.ripple::before {
	    animation-delay: 0.1s;
	}

	.row-title.ripple::after {
	    animation-delay: 0.1s;
	}

	/* animation */
	@keyframes ripple2 {
	    0% {
	        box-shadow: 0 0 0 0 rgba(25, 87, 224, 0.6);
	    }
	    70% {
	        box-shadow: 0 0 0 20px rgba(25, 87, 224, 0);
	    }
	    100% {
	        box-shadow: 0 0 0 0 rgba(25, 87, 224, 0);
	    }
	}
	.row-arrow {
		margin-left: auto;
		flex-shrink: 0;
		width: 24px;
		height: 24px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		z-index: 1;
		color: var(--grey-text);
		transition: color .18s, background .18s, transform .22s var(--ease);
		margin-right: 20px;
	}
	.nav-row:hover .row-arrow { color:var(--blue); background:rgba(0,130,240,.1); transform:translateX(3px); }
	.row-arrow svg { width:16px; height:16px; }

	.panel-label {
		font-size: 16px;
		font-weight: 700;
		color: #ffffff;
		padding: 20px;
		background-color: #1957e0;
		display: flex;
		align-items: center;
		justify-content: start;
	}
	.panel-label .row-arrow-back img {
		width: 22px;
		filter: brightness(0) invert(1);
		transform: rotate(180deg);
		margin-right: 20px;
		align-content: center;
		display: block;
	}
	.language_btn .accordion-button {
		background-color: transparent;
		border: 0;
		box-shadow: none;
		font-weight: 600;
		padding: 20px 20px;
		color: #000000;
	}
	.language_btn .accordion-button:after {
		background-image: url(https://vvdndev.vvdncloud.com/images/right_arrow.png);
		width: 10px;
		height: 14px;
		position: absolute;
		content: "";
		right: 30px;
		top: 20px;
		background-size: contain;
		transform: rotate(-90deg);
		transition: all 0.3s;
	}
	.language_btn .accordion-button.collapsed:after {
		position: absolute;
		content: "";
		transform: rotate(90deg);
		transition: all 0.3s;
	}
	.utl_language a.dropdown-item {
		padding: 15px 20px 15px 20px;
		color: #000000;
		font-weight: 600;
		font-size: 15px;
	}
	.utl_language a img.cunt_ficon {
		margin-right: 12px;
		width: 24px;
		height: auto;
	}
	.utl_language a.dropdown-item span {
		color: #262626;
		font-size: 12px;
		display: inline-block;
		font-weight: 400;
		margin-left: 5px;
	}
	.utl_language img.select_arrow {
		float: right;
		width: 12px;
		margin-top: 7px;
	}
	.menu_social {
		padding: 20px 20px;
		background-color: #fff;
		border-top: 1px solid #bbbbbb;
	}
	.menu_social ul {
		margin: 0;
		padding: 0;
	}
	.menu_social ul li {
		display: inline-block;
		margin-right: 25px;
	}
	.menu_social ul li a {
		text-decoration: none;
	}
	.menu_social ul li a .default_icon {
		transition: all .35s;
		filter: brightness(0) invert(0);
	}
	.menu_social ul li a:hover .default_icon {
		filter: none;
		opacity: 1;
	}
	.topbar,.search-btn { display:none; }
	.hamburger { display:flex; }
	.navbar { padding:0 16px; }
	.lang_item_selected {
    display: none;
}
    .claSS_Lang_letstalk {
        margin-left: auto;
        position: absolute;
        right: 80px;
    }
}



@media (max-width:599px) {
	.whiteBg_fill_btn.lets_talk .know_Mbtn {
		padding-right: 42px;
		min-width: 110px;
	}
	.navbar-brand a img {
		width: 120px;
	}
	.claSS_Lang_letstalk {
        right: 62px;
    }
}

@media (max-width:359px) {
	.navbar-brand a img {
		width: 100px;
	}
}

@media (min-width:1200px) {
	.hamburger {
		display: none;
	}
}