body{
font-family:'Poppins',sans-serif;
background-color: #0b0820!important;
}

/* HEADER */

#header{
position:fixed;
top:0;
width:100%;
z-index:999;
transition:0.4s;
}

#header .navbar{
background:linear-gradient(180deg,rgba(0,0,0,0.8),transparent);
/* padding:10px 0; */
   

}

#header.scrolled .navbar .nav-container{
 border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 5px 15px;
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.7);
    margin-top: 10px;
    transition: all ease 0.3s;
}

#header.scrolled .navbar .navbar-brand img{
    width: 120px!important;
}

/* NAV */

.nav-link{
color:white;
margin:0 10px;
font-weight:400;
font-size: 14px;
}

.nav-link:hover{
color:#ffa100;
}

/* DROPDOWN */

.dropdown-menu{
background:#712ede;
border:none;
margin-top:15px;
}

.dropdown-item{
color:white;
font-size: 14px;
}

.dropdown-item:hover{
    background-color: #fff;
    color: #0f0f0f;
}

.navbar .dropdown-menu{
margin-top:0;
opacity:0;
visibility:hidden;
transform:translateY(10px);
transition:0.3s;
display:block;
}

.navbar .dropdown:hover .dropdown-menu{
opacity:1;
visibility:visible;
transform:translateY(0);
}

.nav-item .dropdown-toggle::after{
    display: none;
}
/* HERO */

.hero{
height:100vh;
position:relative;
overflow:hidden;
}

.hero video{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
}

/* .hero-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
} */

.hero-content{
position:relative;
z-index:2;
height:100%;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
color:white;
text-align:center;
}

.hero-content h1{
font-size: 45px;
    font-weight: 700;
    max-width: 850px;
    margin-bottom: 20px;
}

.hero-content h1 span{
  color: #ffb400;
}

.hero-content p{
font-size:18px;
 max-width: 850px;
}

.hero-btn{

display:inline-flex;
align-items:center;
gap:10px;

margin-top:25px;

padding:14px 32px;

background:#712ede;

color:white;

font-weight:400;

border-radius:40px;

text-decoration:none;

font-size:16px;

transition:0.35s;

box-shadow:0 10px 30px rgba(113, 46, 222, 0.5);

}

.hero-btn:hover{

transform:translateY(-3px);

box-shadow:0 15px 40px rgba(113, 46, 222, 0.5);

color:#712ede;

background-color: #fff;

}

.uix-glow-btn:hover{
  

box-shadow:0 15px 40px rgba(113, 46, 222, 0.5);

color:#712ede!important;

background: #fff!important;
}

.navbar-toggler{
border:none;
color:#fff;
font-size:24px;
}

/* MOBILE MENU */

.mobile-menu{
background:#0f0f0f;
color:#fff;
width:280px;
}

.mobile-nav{
list-style:none;
padding:0;
margin:0;
}

.mobile-nav li{
border-bottom:1px solid #222;
}

.mobile-nav a{
display:block;
padding:14px;
color:#fff;
text-decoration:none;
font-weight:500;
}

/* DROPDOWN */

.mobile-dropdown-toggle{
display:flex;
justify-content:space-between;
align-items:center;
padding:14px;
cursor:pointer;
}

.mobile-dropdown-toggle i{
transition:0.3s;
}

.mobile-dropdown-menu{
display:none;

}

.mobile-dropdown-menu a{
padding:12px;
font-size:14px;
}

/* ACTIVE */

.mobile-dropdown.active .mobile-dropdown-menu{
display:block;
padding-left: 15px;
}

.mobile-dropdown.active i{
transform:rotate(180deg);
}

.about-section{

padding:60px 0;
text-align:center;
}

.about-title{
font-family:'Poppins',sans-serif;
font-size:34px;
font-weight:500;
color:#ffffff;
margin-bottom:20px;
}

.about-title span{
color:#ffb000;
}

.about-text{
font-family:'Poppins',sans-serif;
font-size:14px;
color:#e5e5e5;
line-height:1.9;
max-width:1000px;
margin:auto;
}

.services-section{

padding:90px 0 90px;
background-image: url(../img/line-vector.svg);
background-size: cover;
background-position: center;
background-attachment: fixed;
 position:relative;
    overflow:hidden;
    z-index: 1;
}


/* GRID BACKGROUND */
.services-section::before{
    content:"";
    position:absolute;
    inset:0;

    background-image:
        linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);

    background-size:28px 28px;
    z-index:-3;
}

/* PURPLE GLOW EFFECT */
.services-section::after{
    content:"";
    position:absolute;
    width:1200px;
    height:500px;
    top:-220px;
    left:50%;
    transform:translateX(-50%);

    background:
        radial-gradient(circle at center,
        rgba(174,0,255,0.55) 0%,
        rgba(120,0,255,0.30) 28%,
        rgba(90,0,255,0.15) 45%,
        transparent 70%);

    filter:blur(60px);
    z-index:-2;
    pointer-events:none;
}

/* EXTRA SIDE GLOW */
.services-section .smh-purple-light{
    position:absolute;
    width:300px;
    height:300px;
    border-radius:50%;
    background:#a100ff;
    filter:blur(140px);
    opacity:.22;
    z-index:-1;
}

.services-section .smh-purple-light.left{
    top:-80px;
    left:-100px;
}

.services-section .smh-purple-light.right{
    top:-80px;
    right:-100px;
}

.section-title{
text-align:center;
font-size:40px;
font-weight:500;
color:#fff;
}

.section-title span{
color:#ffb000;
}

.service-card{
border:1px solid #cfcfe2;
border-radius:12px;
padding:30px 20px;
/* background:rgba(11, 8, 32, 0.5); */
transition:0.3s;
height:100%;

}

.service-card:hover{
transform:translateY(-6px);
border-color:#712ede;
box-shadow: rgba(113, 46, 222, 0.5) 0px 7px 29px 0px;
}

.service-card:hover img{
    filter: brightness(0) invert(1);
}

.service-icon{
width:60px;
margin-bottom:15px;
display: block;
margin-left: auto;
margin-right: auto;
}

.service-card h4{
color:#fff;
font-size:15px;
font-weight:500;
margin-bottom:10px;
text-align: center;
}

.service-card p{
color:#cfcfe2;
font-size:14px;
line-height:1.7;
}

.service-card a{
color:#fff;
font-size:14px;
text-decoration:none;
}

.service-card a:hover{
color:#ffb000;
}

.service-btn{
background:#e9e9e9;
padding:12px 30px;
border-radius:10px;
font-weight:600;
cursor:pointer;
display:inline-block;
}


.counter-section{
/* background:#ffffff; */
padding:30px 0 60px;
}

.counter-section .container{

margin:auto;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.counter-box{
text-align:center;
padding:30px 20px;
border-radius:12px;
background:#712ede;
color:white;
border: 1px solid #fff;
box-shadow:0 10px 25px rgba(0,0,0,0.3);
transition:.3s;
}

.counter-box:hover{
transform:translateY(-8px);
}

.counter-box h2{
font-size:50px;
margin-bottom:10px;
font-weight:500;
}

.counter-box p{
font-size:16px;
opacity:.9;
}

.portfolio-section{

padding:80px 0;
text-align:center;
color:white;
}

.portfolio-title{
font-size:40px;
margin-bottom:30px;
}

.portfolio-title span{
color:#ffb400;
}

.portfolio-tabs{
display:flex;
justify-content:center;
gap:15px;
margin-bottom:40px;
flex-wrap: wrap;
}

.tab-btn{
padding:10px 20px;
border-radius:20px;
border:1px solid white;
background:transparent;
color:white;
cursor:pointer;
}

.tab-btn.active{
background:#7c3aed;
border:none;
}

.portfolio-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:40px;
max-width:1000px;
margin:auto;
}

.portfolio-item img{
width:100%;
border-radius:10px;
cursor: pointer;
}

.tab-content{
display:none;
}

.tab-content.active{
display:block;
}

.portfolio-section hr{
    color: #e5e5e5;
}

/* LIGHTBOX BACKGROUND */

.portfolio-lightbox{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;
background:rgba(0,0,0,0.95);
display:none;
align-items:center;
justify-content:center;
z-index:9999;
overflow-y:auto;
padding:40px 0;
}


/* LIGHTBOX IMAGE CONTAINER */

.portfolio-lightbox-content{
width:90%;
margin:auto;
display:flex;
justify-content:center;
}


/* IMAGE STYLE */

.portfolio-lightbox img{
width: 80%;
    height: auto;
    border: 3px solid #ffffff;

}


/* CLOSE BUTTON */

.portfolio-close{
position:fixed;
top:20px;
right:40px;
font-size:40px;
color:#fff;
cursor:pointer;
font-weight:bold;
z-index:10000;
transition:0.3s;
}

.portfolio-close:hover{
color:#ffa100;
transform: rotate(180deg);
}


.client-logo-sec{
   
    padding:40px 0;
    position:relative;
}



.client-logo-sec .container{
    position:relative;
    z-index:2;
}

.client-logo-box{
    text-align:center;
    padding:35px 20px;
    border-right:1px solid rgba(255,255,255,0.15);
    border-bottom:1px solid rgba(255,255,255,0.15);
}

.client-logo-box img{
    width: 100%;
    filter: brightness(0) invert(1);
    opacity:0.9;
    transition:0.3s;
}

.client-logo-box:hover img{
    opacity:1;
    transform:scale(1.1);
}

.client-logo-box{
    text-align:center;
    padding:35px 20px;
    border-right:1px solid rgba(255,255,255,0.15);
    border-bottom:1px solid rgba(255,255,255,0.15);
}

/* last column border remove */
.client-logo-box:nth-child(6),
.client-logo-box:nth-child(12){
    border-right:0;
}

/* last row border remove */
.client-logo-box:nth-child(n+7){
    border-bottom:0;
}

.webidea-footer{
background:#090918;
color:#fff;
padding:70px 0 0;
font-family:Poppins;
position: relative;
overflow: hidden;

}

.webidea-footer::before{
    content:"";
    position:absolute;
    inset:0;
    background:
      radial-gradient(circle at 20% 30%, #6c23e8 0%, transparent 35%),
      radial-gradient(circle at 80% 70%, #ffa100 0%, transparent 35%);
    filter: blur(80px);
    opacity:.15;
    animation: aurora 12s ease-in-out infinite alternate;
    z-index: 0;
}

@keyframes aurora{
    from{transform:translateX(-50px);}
    to{transform:translateX(50px);}
}

.webidea-footer .container{
  position: relative;
  z-index: 11;
}


.footer-logo{
width:200px;
margin-bottom:20px;
}

.footer-about p{
font-size:15px;
line-height:26px;
margin-bottom:20px;
}

.footer-social a{
color:#ffa100;
margin-right:15px;
font-size:18px;
transition:.3s;
}

.footer-social a:hover{
color:#fff;
}

.footer-title{
font-size:20px;
font-weight:600;
margin-bottom:30px;
position:relative;
padding-bottom:10px;
}

.footer-title:before{
content:"";
position:absolute;
bottom:0;
left:0;
width:60px;
height:3px;
background:#ffb400;
}

.footer-title:after{
content:"";
position:absolute;
bottom:0;
left:60px;
width:120px;
height:1px;
background:#712ede;
}

.footer-links{
list-style:none;
padding:0;
}

.footer-links li{
margin-bottom:14px;
}

.footer-links a{
text-decoration:none;
color:#fff;
font-size:15px;
position:relative;
padding-left:18px;
}

.footer-links a:before{
content:"➜";
position:absolute;
left:0;
color:#712ede;
}

.footer-links a:hover{
color:#ffa100;
}

.footer-contact{
list-style:none;
padding:0;
}

.footer-contact li{
margin-bottom:18px;
font-size:15px;
display:flex;
gap:12px;
line-height:24px;
}

.footer-contact i{
color:#ffa100;
margin-top:4px;
}

.footer-bottom{
background:#0b0820;
text-align:center;
padding:18px;
margin-top:40px;
font-size:15px;
}

.footer-bottom span{
color:#ffa100;
}

#scrollTopBtn{
position:fixed;
bottom:30px;
right:30px;
width:45px;
height:45px;
border:none;
border-radius:50%;
background:linear-gradient(135deg,#7b2ff7,#a34cf3);
color:#fff;
font-size:18px;
display:none;
align-items:center;
justify-content:center;
cursor:pointer;
z-index:999;
box-shadow:0 6px 20px rgba(0,0,0,0.4);
transition:0.3s;
}

#scrollTopBtn:hover{
transform:translateY(-4px);
box-shadow:0 10px 25px rgba(0,0,0,0.5);
}

.domain-search{
display:flex;
justify-content:center;
align-items:center;
margin-top:25px;
width:420px;
margin-left:auto;
margin-right:auto;
background:#fff;
border-radius:40px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,0.3);
}

.domain-search input{
flex:1;
border:none;
padding:14px 20px;
font-size:15px;
outline:none;
}

.domain-search button{
border:none;
background:linear-gradient(135deg,#7b2ff7,#a34cf3);
color:#fff;
padding:14px 25px;
font-size:15px;
cursor:pointer;
display:flex;
align-items:center;
gap:8px;
}

.domain-search button:hover{
background:linear-gradient(135deg,#6c23e8,#8f3af1);
}


/* section */
.faq-clean-dark {
  background: #0b0820;
  padding: 60px 0;
}

/* remove full accordion border */
.faq-clean-dark .accordion {
  border: none;
}

/* item style */
.faq-item-x {
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}

/* button */
.faq-btn-x {
  background: transparent !important;
  color: #fff !important;
  font-size: 16px;
  padding: 20px 0;
  border: none;
  box-shadow: none !important;
  position: relative;
}

/* remove bootstrap arrow completely */
.faq-btn-x::after {
  display: none !important;
}

/* custom icon */
.faq-btn-x::before {
  content: "+";
  position: absolute;
  right: 0;
  font-size: 28px;
  transition: 0.3s;
}

/* change to minus when open */
.faq-btn-x:not(.collapsed)::before {
  content: "−";
}

/* body */
.faq-body-x {
  color: #bcbccf;
  font-size: 12px;
  padding: 0 0 20px 0;
  
}

/* remove focus glow */
.accordion-button:focus {
  box-shadow: none;
}

.it-banner {
  position: relative;
  padding: 150px 0 80px;
  color: #fff;
  overflow: hidden;
}

/* BACKGROUND IMAGE (CLEAR FIX) */
.it-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('https://images.unsplash.com/photo-1555066931-4365d14bab8c') center/cover no-repeat;
  transform: scale(1.05);
  z-index: 0;
}

/* DARK OVERLAY (BALANCED OPACITY) */
.it-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(10, 12, 25, 0.65); /* IMPORTANT FIX */
  z-index: 1;
}

/* PURPLE GLOW */
.framer-1gnnghh {
    filter: blur(85px);
    -webkit-user-select: none;
    user-select: none;
    aspect-ratio: 2.55042;
    background-color: #712ede;
    height: var(--framer-aspect-ratio-supported, 282px);
    pointer-events: none;
    will-change: var(--framer-will-change-effect-override, transform);
    z-index: -1;
    border-radius: 130px;
    flex: none;
    width: 60%;
    position: absolute;
    bottom: -214px;
    left: 50%;
    overflow: hidden;
    transform: translate(-50%);
    z-index: 1;
}

/* CONTENT */
.it-content {
  position: relative;
  z-index: 2;
}

/* TITLE */
.it-title {
  font-size: 45px;
  
}

/* LINE */
.it-line {
  width: 60px;
  height: 3px;
  background: rgba(113, 46, 222, 1);
  margin: 10px 0;
  display: block;
  margin: auto;
  
}

/* BREADCRUMB */
.it-breadcrumb {
  font-size: 16px;
  color: rgba(255,255,255,0.75);
  margin-top: 15px;
}

.it-breadcrumb span {
  color: #ffb000;
  margin: 0 6px;
  font-size: 16px;
}

.it-icon {
  position: absolute;
  font-size: 34px;   /* 🔥 BIGGER ICON */
  color: rgba(255,255,255,0.18);  /* clearer but soft */
  animation: float 6s infinite ease-in-out;
  z-index: 2;
}

/* positions */
.it-icon.one { top: 28%; left: 8%; }
.it-icon.two { bottom: 22%; left: 22%; }
.it-icon.three { top: 28%; right: 10%; }
.it-icon.four { bottom: 18%; right: 8%; }

/* animation */
@keyframes float {
  0% { transform: translateY(0px) scale(1); }
  50% { transform: translateY(-18px) scale(1.05); }
  100% { transform: translateY(0px) scale(1); }
}

.inner-about-text{
    max-width: 100%!important;
    text-align: justify;
}


.sub-heading{
    font-size: 25px;
    margin-top: 30px;
    color: #ffa100;
    text-align: start;
}

.mission-vission{
    padding: 60px 0px;
     /* Gradient background */
 /* base gradient */
  background: linear-gradient(135deg, #6a11cb, #4f46e5, #2563eb);
   position: relative;
  overflow: hidden;
}

.mission-vission::before{
    content: "";
  position: absolute;
  inset: 0;

 
  background: linear-gradient(
    120deg,
    transparent 0%,
    transparent 35%,
    rgba(255,255,255,0.10) 35%,
    rgba(255,255,255,0.10) 55%,
    transparent 55%,
    transparent 100%
  );

  z-index: 1;
}


.vm-title{
    color: #fff;
    font-size: 40px;

}

.vm-text{
    color: #fff;
    font-size: 16px;
}

.vm-img{
    width: 80%;
}

/* SECTION */
.wcu-sec {

  padding: 60px 0;
  color: #fff;
}

/* TITLE CENTER */
.wcu-heading {
  text-align: center;
  margin-bottom: 50px;
}

.wcu-title {
  font-size: 38px;
  
}

.wcu-title span{
    color: #ffa100;
}

/* CARD */
.wcu-card {
  background: #070516;
  border: 1px solid rgba(231, 231, 231, 0.5);
  padding: 25px;
  border-radius: 12px;
  transition: 0.3s;
  height: 100%;
}

.wcu-card:hover {
  transform: translateY(-6px);
  border-color: rgba(113,46,222,0.6);
  box-shadow: 0 10px 30px rgba(113,46,222,0.2);
}

/* ICON */
/* .wcu-icon {
  font-size: 30px;
  color: rgb(255, 255, 255);
  margin-bottom: 15px;
} */

/* .wcu-card:hover  .wcu-icon {

  color: #ffa100;

} */

.wcu-icon {
    position: relative;
    width: 55px;
    height: 55px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #fff;
    margin-bottom: 10px;

    /* GLASS LOOK */
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);

    /* Gradient border trick */
    border: 1px solid transparent;
    background-clip: padding-box;
    
    /* outer glow */
    box-shadow: 0 8px 30px rgba(106,17,203,0.25);

    overflow: hidden;
    transition: all 0.4s ease;
}

/* Gradient border layer */
.wcu-icon::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 10px;
    padding: 2px;
    background: linear-gradient(135deg, #6a11cb, #2575fc);
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
}

/* inner soft light */
.wcu-icon::after {
    content: "";
    position: absolute;
    width: 120%;
    height: 120%;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.25), transparent 60%);
    opacity: 0.4;
}

/* hover effect */
.wcu-icon:hover {
    transform: translateY(-8px) scale(1.05);
    box-shadow: 0 15px 40px rgba(106,17,203,0.4);
}

/* icon animation */
.wcu-icon i {
    position: relative;
    z-index: 2;
    transition: 0.3s ease;
}

.wcu-icon:hover i {
    transform: scale(1.2);
}

/* TITLE */
.wcu-card-title {
  font-size: 20px;
  font-weight: 600;
}

/* TEXT */
.wcu-text {
  font-size: 15px;
  color: rgba(255,255,255,0.7);
  line-height: 1.7;
}


.mega-menu {
  background-color: #0b0820;
  border: 1px solid rgba(113, 46, 222, 0.3);
  box-shadow: 0 10px 40px rgba(113, 46, 222, 0.2);
  color: #fff;
  left: 10px;
    width: 98% !important;
}

.mega-menu h6 {
  font-weight: 600;
  margin-bottom: 10px;
  font-size: 14px;
}

.mega-menu .dropdown-item {
  color: #ccc;
  padding: 6px 0;
  transition: 0.3s;
  font-size: 14px;
}

.mega-menu .dropdown-item:hover {
  color: #712ede;
  padding-left: 8px;
}

.navbar .dropdown-menu {
  border-radius: 10px;
}


.mobile-dropdown-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.has-submenu > span {
  display: block;
  padding: 8px 0;
  color: #ddd;
  cursor: pointer;
  border-bottom: 1px solid rgba(113,46,222,0.2);
  font-size: 14px;
}

.submenu {
  list-style: none;
  padding-left: 10px;
  display: none;
}

.submenu li a {
  display: block;
  padding: 5px 0;
  color: #aaa;
  text-decoration: none;
  font-size: 14px;
  padding-left: 0px!important;
}

.submenu li a::before{
  content: "●";
  color: #ffb000;
  margin-right: 5px;
}

.submenu li a:hover {
  color: #712ede;
}

/* active open */


.has-submenu .submenu {
  display: none;

}

.has-submenu.active .submenu {
  display: block;
}

.submenu-title {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  padding: 8px 0;
  color: #ddd;
}

.icon {
  color: #712ede;
  font-weight: bold;
}


.it-hero-section {
    background:
linear-gradient(
rgba(11, 8, 32, 0.92),
rgba(0, 0, 0, 0.74)
),
url('../img/inner-banner.jpg');

background-position: center;
background-size: cover;
background-repeat: no-repeat;
    padding: 150px 0 80px;
    color: #fff;
    position: relative;
    overflow: hidden;
}



/* Content */
.it-hero-content h1 {
    font-size: 42px;
  
    margin: 20px 0;
    line-height: 1.3;
}

.it-hero-content p {
    color: #cfd8e3;
    margin-bottom: 25px;
}

/* Tag */
.it-tag {
    color: #ffb000;
    font-weight: 600;
    letter-spacing: 1px;
}

/* Button */
.it-btn {
    display: inline-block;
    padding: 12px 28px;
    background: #712ede;
      box-shadow: 0 10px 30px rgba(113, 46, 222, 0.5);
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    transition: 0.3s;
}

.it-btn:hover {
    background: linear-gradient(45deg, #ff5e00, #ff8c00);
}

/* Image */
.it-hero-img img {
    max-width: 100%;
    animation: float 4s ease-in-out infinite;
    border-radius: 15px;
    border: 3px solid #fff;
}

/* Floating animation */
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}

/* Responsive */
@media (max-width: 991px) {
    .it-hero-content {
        text-align: center;
        margin-bottom: 40px;
    }

    .it-hero-content h1 {
        font-size: 25px;
    }
    .wcu-title {
    font-size: 25px;
}
.cta-box h2{
  font-size: 1.5rem!important;
  font-weight: 600!important;
}
.cta-box{
  padding: 35px 25px!important;
}
.cta-buttons .btn-outline{
  background-color: #fff;
  border: 1px solid #fff;
}
.best-card{
  padding: 30px 20px;
}
}

    .cta-buttons .btn-outline {
        background-color: #fff;
        border: 1px solid #fff;
    }


/* section title */
.process-section h2 {
  color: #fff;
}

.process-section p {
  color: #b5b5b5;
}

/* roadmap container */
.process-roadmap {
  position: relative;
  margin-top: 40px;
}

/* vertical line */
.process-roadmap::before {
  content: "";
  position: absolute;
  left: 30px;
  top: 0;
  width: 2px;
  height: 100%;
  background: linear-gradient(#712ede, transparent);
}

/* each step */
.process-step {
  display: flex;
  gap: 20px;
  margin-bottom: 40px;
  position: relative;
}

/* step number circle */
.step-number {
  width: 60px;
  height: 60px;
  background: #712ede;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 20px rgba(113,46,222,0.5);
  z-index: 1;
}

/* content box */
.step-content {
  background: linear-gradient(145deg, #11102a, #0b0820);
  padding: 20px;
  border-radius: 12px;
  border: 1px solid rgba(113,46,222,0.2);
  width: 100%;
  transition: 0.3s;
}

/* hover effect */
.step-content:hover {
  transform: translateX(8px);
  border-color: #712ede;
  box-shadow: 0 10px 25px rgba(113,46,222,0.2);
}

.step-content h4 {
  margin-bottom: 8px;
  color: #fff;
}

.step-content p {
  color: #aaa;
  margin: 0;
  line-height: 1.6;
}

.best-for h2 {
  color: #fff;
}

.best-for p {
  color: #b5b5b5;
}

/* CARD */
.best-card {
  background: linear-gradient(145deg, #11102a, #0b0820);
  border: 1px solid rgba(230, 230, 230, 0.2);
  padding: 30px;
  border-radius: 15px;
  height: 100%;
  transition: 0.4s;
  text-align: center;
  position: relative;
}

/* hover */
.best-card:hover {
  transform: translateY(-10px);
  border-color: #712ede;
  box-shadow: 0 10px 30px rgba(113,46,222,0.25);
}

/* ICON */
.icon-box {
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  background: rgba(113,46,222,0.1);
  border: 1px solid rgba(113,46,222,0.4);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffb000;
  font-size: 22px;
  box-shadow: 0 0 15px rgba(113,46,222,0.3);
}

.best-card h5 {
  margin-bottom: 10px;
  color: #fff;
}

.best-card p {
  color: #aaa;
  line-height: 1.6;
}

.cta-section {
  padding: 80px 0;
}

/* MAIN BOX */
.cta-box {
 
  border: 1px solid rgba(113,46,222,0.4);
  padding: 40px 40px;
  border-radius: 20px;
  text-align: center;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 40px rgba(113,46,222,0.2);
}



/* heading */
.cta-box h2 {
  font-size: 2.5rem;
  font-weight: 800;
  position: relative;
  z-index: 1;
}

/* text */
.cta-box p {
  max-width: 650px;
  margin: 20px auto;
  color: #cfcfcf;
  font-size: 16px;
  line-height: 1.7;
  position: relative;
  z-index: 1;
}

/* buttons */
.cta-buttons {
  margin-top: 30px;
  position: relative;
  z-index: 1;
}

.btn-primary {
  background: #712ede;
  color: #fff;
  padding: 14px 30px;
  border-radius: 12px;
  text-decoration: none;
  margin: 10px;
  display: inline-block;
  font-weight: 600;
  box-shadow: 0 0 25px rgba(113,46,222,0.5);
  transition: 0.3s;
}

.btn-primary:hover {
  transform: translateY(-3px) scale(1.05);
}

.btn-outline {
  border: 1px solid #712ede;
  color: #712ede;
  padding: 14px 30px;
  border-radius: 12px;
  text-decoration: none;
  margin: 10px;
  display: inline-block;
  font-weight: 600;
  transition: 0.3s;
}

.btn-outline:hover {
  background: #712ede;
  color: #fff;
  transform: translateY(-3px);
}





/* MAIN CTA BOX */
.cta-box {
  position: relative;
  animation: pulseZoom 6s ease-in-out infinite;
  overflow: hidden;
  color: #fff;
}

/* TOP LEFT PURPLE GLOW */
.cta-box::before {
  content: "";
  position: absolute;
  width: 300px;
  height: 300px;
  background: #712ede;
  filter: blur(40px);
  opacity: 0.25;
  top: -100px;
  left: -20px;
  z-index: 0;
  animation: pulseZoom 8s ease-in-out infinite;
}

/* BOTTOM RIGHT YELLOW GLOW */
.cta-box::after {
  content: "";
  position: absolute;
  width: 300px;
  height: 300px;
  background: #ffcc00;
  filter: blur(50px);
  opacity: 0.2;
  bottom: -120px;
  right: -120px;
  z-index: 0;
  animation: pulseZoom 10s ease-in-out infinite;
}


.zx-tabs-nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px;
  margin-bottom: 40px;
}

.zx-tab {
  background: #11102a;
  border: 1px solid rgba(113,46,222,0.2);
  padding: 12px 18px;
  border-radius: 10px;
  text-align: center;
  cursor: pointer;
  transition: 0.3s;
  color: #ccc;
  min-width: 120px;
}

.zx-tab i {
  display: block;
  font-size: 18px;
  margin-bottom: 5px;
  color: #ffb400;
}

.zx-tab.active,
.zx-tab:hover {
  background: #712ede;
  
  box-shadow: 0 0 20px rgba(113,46,222,0.5);
}

.zx-tab:hover i{
color: #fff!important;
}

.zx-tab.active i {
  color: #fff!important;
}

.zx-tab:hover .zx-tab i {
  color: #fff!important;
}

/* content */
.zx-tabs-content {
  text-align: center;
}

.zx-pane {
  display: none;
}

.zx-pane.active {
  display: block;
}

.zx-pane h3 {
  margin-bottom: 10px;
}

.zx-pane p {
  color: #aaa;
}


/* PACKAGE CARD */
.zx-card {
  background: linear-gradient(145deg, #11102a, #0b0820);
  border: 1px solid rgba(255, 255, 255, 0.6);
  padding: 30px;
  border-radius: 15px;
  text-align: center;
  transition: 0.4s;
  position: relative;
  overflow: hidden;
  height: 100%;
}

/* glow effect */
.zx-card::before {
  content: "";
  position: absolute;
  width: 250px;
  height: 250px;
  background: #712ede;
  filter: blur(120px);
  opacity: 0;
  top: -80px;
  right: -80px;
  transition: 0.4s;
}

.zx-card:hover::before {
  opacity: 0.3;
}

.zx-card:hover {
  transform: translateY(-12px) scale(1.02);
  border-color: #712ede;
  box-shadow: 0 20px 40px rgba(113,46,222,0.3);
}

/* FEATURED CARD */
.zx-featured {
  border: 1px solid #712ede;
  transform: scale(1.05);
  box-shadow: 0 0 40px rgba(113,46,222,0.4);
}

/* BADGE */
.zx-badge {
  position: absolute;
  top: 22px;
    right: -45px;
  background: #712ede;
  color: #fff;
  padding: 5px 40px;
  font-size: 12px;
  transform: rotate(45deg);
}

/* TITLE */
.zx-plan {
  margin-top: 10px;
  font-weight: 600;
  color: #fff;
}

/* PRICE */
.zx-price {
  font-size: 1.8rem;
  font-weight: 700;
  color: #ffb400;
  margin: 10px 0 20px;
}

/* LIST */
.zx-list {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}

.zx-list li {
  padding: 6px 0;
  color: #bbb;
  font-size: 14px;
}

/* BUTTON */
.zx-btn {
  display: inline-block;
  margin-top: 10px;
  padding: 12px 25px;
  background: #712ede;
  color: #fff;
  border-radius: 10px;
  text-decoration: none;
  box-shadow: 0 0 25px rgba(113,46,222,0.5);
  transition: 0.3s;
}

.zx-btn:hover {
  transform: scale(1.05);
}

.gallery-list-name h5{
  color: #ffcc00;
  margin-top: 10px;
}


.icon-box {
    width: 65px;
    height: 65px;
    background: linear-gradient(135deg, #6a11cb, #2575fc);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    color: #fff;
    font-size: 26px;
    box-shadow: 0 8px 25px rgba(106,17,203,0.5);
    transition: all 0.4s ease;
    animation: float 3s ease-in-out infinite;
}

.icon-box i {
    transition: transform 0.4s ease;
}

/* Hover Effect */
.icon-box:hover {
    transform: translateY(-8px) scale(1.05);
    box-shadow: 0 15px 35px rgba(106,17,203,0.8);
}

.icon-box:hover i {
    transform: rotate(15deg) scale(1.2);
}

/* Floating Animation */
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-6px); }
    100% { transform: translateY(0px); }
}

.pro-collage {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    position: relative;
}

/* Card Style */
.collage-item {
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    transition: 0.4s;
}

.collage-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.4s;
}

/* Different sizes (premium layout) */


.item2 {
    height: 180px;
}

.item3 {
    height: 180px;
}

.item4 {
    grid-column: span 2;
    height: 160px;
}

/* Hover */
.collage-item:hover img {
    transform: scale(1.08);
}

/* Glow effect */
.collage-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.4));
    opacity: 0;
    transition: 0.3s;
}

.collage-item:hover::after {
    opacity: 1;
}

/* Subtle float animation */
.collage-item {
    animation: float 5s ease-in-out infinite;
}

.collage-item:nth-child(2) { animation-delay: 1s; }
.collage-item:nth-child(3) { animation-delay: 2s; }
.collage-item:nth-child(4) { animation-delay: 3s; }

@keyframes float {
    0% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
    100% { transform: translateY(0); }
}

/* Mobile */
@media(max-width:768px){
    .pro-collage {
        grid-template-columns: 1fr;
    }

    .item1, .item4 {
        grid-column: span 1;
        grid-row: span 1;
        height: 200px;
    }
}


.usp-modern {
    padding: 80px 0;
    
    color: #fff;
}

/* LEFT */
.usp-heading {
    font-size: 42px;
    font-weight: 700;
    text-align: center;
}

.usp-desc {
    color: #aaa;
    margin: 20px auto;
    max-width: 1000px;
    text-align: center;
    line-height: 1.6;
}

.usp-btn {
    display: inline-block;
    padding: 12px 28px;
    background: linear-gradient(135deg,#6a11cb,#2575fc);
    border-radius: 30px;
    color: #fff;
    text-decoration: none;
    width: 180px;
    display: block;
    text-align: center;
    margin: auto;
}

/* RIGHT LIST */
.usp-list {
   gap: 15px;
    justify-content: space-between;
    margin-top: 30px;
    flex-wrap: wrap;
}

.usp-row {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
    transition: 0.3s;
}

/* ICON STYLE */
.usp-row i {
    font-size: 20px;
    margin-right: 10px;
    color: #6a11cb;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.8);
}

/* TEXT */
.usp-row h5 {
    margin: 0;
    font-weight: 400;
    font-size: 16px;
}

/* HOVER */
.usp-row:hover {
    transform: translateX(8px);
}

.usp-row:hover i {
    background: linear-gradient(135deg,#6a11cb,#2575fc);
    color: #fff;
}

/* MOBILE */
@media(max-width:768px){
    .usp-heading {
        font-size: 32px;
    }
    .usp-list {
        margin-top: 40px;
    }
}



/* SCROLLBAR WIDTH */
::-webkit-scrollbar {
    width: 10px;
}

/* TRACK (background) */
::-webkit-scrollbar-track {
    background: #0b0b1f;
}

/* THUMB (moving part) */
::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #7b2ff7, #a34cf3);
    border-radius: 10px;
}

/* HOVER EFFECT */
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #6a1fe6, #9333ea);
}

/* HERO BUTTONS */

.hero-buttons{
    display:flex;
    gap:20px;
    margin-top:30px;
    flex-wrap:wrap;
}

.btn{
    padding:16px 34px;
    border-radius:50px;
    font-size:16px;
    font-weight:600;
    text-decoration:none;
    transition:all 0.35s ease;
    /* display:inline-flex; */
    align-items:center;
    justify-content:center;
    letter-spacing:0.3px;
}

/* PRIMARY BUTTON */

.btn-primary{
    background:#712ede;
    color:#fff;
    box-shadow:0 10px 25px rgba(113, 46, 222,0.3);
    border-color: #712ede;
}

.btn-primary:hover{
    transform:translateY(-3px);

     background:#ffffff;
     color: #712ede;
}

/* SECONDARY BUTTON */

.btn-secondary{
     background:rgba(250, 150, 0, 0.05);
    backdrop-filter:blur(10px);
    color: #fff;
    box-shadow: 0 10px 25px rgba(113, 46, 222, 0.3);
    border-color: #ff8c00;
    margin: 10px;
}

.btn-secondary:hover{
    background:#ff8c00;
    color:#ffffff;
    transform:translateY(-3px);
}

/* MOBILE */

@media(max-width:768px){

    .hero-buttons{
        flex-direction:row;
        width:100%;
        gap: 0;
    }

    .hero-buttons .btn{
      padding: 10px 20px;
    border-radius: 50px;
    font-size: 12px;
    }
    .hero-content{
      padding: 0px 10px;
    }

   

}

.hero-heading{
    font-size:30px;
    font-weight:700;
    color:#fff;
}

#typing{
    color:#ffb400;
    border-right:3px solid #ffb400;
    padding-right:5px;
    animation:blink 0.7s infinite;
}

@keyframes blink{
    50%{
        border-color:transparent;
    }
}

@media(max-width:768px){

    .hero-heading{
        font-size:18px;
    }

}



/* ======================================
   WEBIDEA ABOUT SECTION
====================================== */

.wi-about-section{
  position:relative;
  padding:90px 0;
  overflow:hidden;
}

/* ================= CONTENT ================= */

.wi-about-content{
  position:relative;
  z-index:2;
}

/* experience box */

.wi-exp-box{
  display:inline-flex;
  align-items:center;
  gap:18px;
  padding:18px 24px;
  border-radius:24px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  backdrop-filter:blur(12px);
  margin-bottom:30px;
}

.wi-exp-number{
  font-size:3rem;
  line-height:1;
  font-weight:700;
  color:#ffb400;
}

.wi-exp-text span{
  color:rgba(255,255,255,0.7);
  font-size:.88rem;
}

.wi-exp-text h5{
  color:#fff;
  margin-bottom:0;
  font-size:1.1rem;
  font-weight:500;
}

/* tag */

.wi-about-tag{
  display:inline-block;
  padding:10px 18px;
  border-radius:50px;
  background:rgba(113,46,222,0.16);
  color:#c7a4ff;
  border:1px solid rgba(113,46,222,0.22);
  font-size:.82rem;
  margin-bottom:18px;
}

/* heading */

.wi-about-content h2{
  color:#fff;
  font-size:30px;
  line-height:1.4;
  font-weight:600;
  margin-bottom:22px;
}

/* paragraph */

.wi-about-content p{
  color:rgba(255,255,255,0.72);
  line-height: 1.7;
  font-size:14px;
  margin-bottom:18px;
}

/* features */

.wi-about-features{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  margin-top:35px;
}

.wi-feature-item{
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  padding:16px 18px;
  transition:.35s ease;
}

.wi-feature-item:hover{
  transform:translateY(-4px);
  border-color:rgba(255,180,0,0.25);
}

.wi-feature-item i{
  color:#ffb400;
  font-size:1rem;
}

/* button */

.wi-about-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  background:#712ede;
  color:#fff;
  padding:15px 28px;
  border-radius:60px;
  margin-top:35px;
  transition:.35s ease;
}

.wi-about-btn:hover{
  background:#fff;
  color:#712ede;
  transform:translateY(-4px);
}

/* ================= IMAGE ================= */
/* ABOUT IMAGE */
.wi-about-image{
    position: relative;
    width: fit-content;
    margin: auto;
}

.wi-about-image img{
    position: relative;
    z-index: 2;
    max-width: 70%;
    margin: auto;
    display: block;
}

/* FLOAT ICON */
.wi-floating-icon{
    position: absolute;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(14px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    z-index: 3;
    box-shadow: 0 10px 40px rgba(113,46,222,.18);
    animation: floatIcon 4s ease-in-out infinite;
}

/* PERFECT EQUAL GAP POSITIONS */

/* TOP */
.wi-icon-1{
    top: -60px;
    left: 50%;
    transform: translateX(-50%);
    color: #ff5722;
}

/* TOP RIGHT */
.wi-icon-2{
    top: 10%;
    right: 0px;
    color: #2196f3;
    animation-delay: 1s;
}

/* BOTTOM RIGHT */
.wi-icon-3{
    bottom: 10%;
    right: 0px;
    color: #ffb400;
    animation-delay: 2s;
}

/* BOTTOM */
.wi-icon-4{
    bottom: -80px;
    left: 50%;
    transform: translateX(-50%);
    color: #61dafb;
    animation-delay: 1.5s;
}

/* BOTTOM LEFT */
.wi-icon-5{
    bottom: 10%;
    left: 0px;
    color: #8bc34a;
    animation-delay: 2.5s;
}

/* TOP LEFT */
.wi-icon-6{
    top: 10%;
    left: 0px;
    color: #712ede;
    animation-delay: .5s;
}

/* FLOAT ANIMATION */
/* @keyframes floatIcon{

    0%{
        transform: translateY(0px);
    }

    50%{
        transform: translateY(-10px);
    }

    100%{
        transform: translateY(0px);
    }

} */

/* KEEP CENTERED ICONS */
.wi-icon-1,
.wi-icon-4{
    animation-name: floatCenter;
}

@keyframes floatCenter{

    0%{
        transform: translateX(-50%) translateY(0px);
    }

    50%{
        transform: translateX(-50%) translateY(-10px);
    }

    100%{
        transform: translateX(-50%) translateY(0px);
    }

}

/* MOBILE */
@media(max-width:767px){

    .wi-floating-icon{
        width: 52px;
        height: 52px;
        font-size: 22px;
    }

    .wi-icon-1{
        top: -40px;
    }

    .wi-icon-4{
        bottom: -60px;
    }

    .wi-icon-2,
    .wi-icon-3{
        right: 0px;
    }

    .wi-icon-5,
    .wi-icon-6{
        left: 0px;
    }

}



/* floating card */

.wi-floating-card{
  position:absolute;
  right: 20px;
    bottom: -80px;
  background:#fff;
  border-radius:22px;
  padding:18px 22px;
  display:flex;
  align-items:center;
  gap:14px;
  box-shadow:0 18px 45px rgba(0,0,0,0.18);
  z-index:3;
  min-width: 60%;
}

.wi-floating-card i{
  width:55px;
  height:55px;
  border-radius:50%;
  background:#ffb400;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#111;
  font-size:1.2rem;
}

.wi-floating-card h4{
  margin-bottom:2px;
  color:#111;
  font-size:1.4rem;
  font-weight:600;
}

.wi-floating-card span{
  color:#666;
  font-size:.88rem;
}

/* ================= MOBILE ================= */

@media(max-width:991px){

  .wi-about-section{
    padding:80px 0;
  }

  .wi-about-features{
    grid-template-columns:1fr;
  }

  .wi-about-image{
    margin-top:20px;
  }

}

@media(max-width:576px){

  .wi-exp-box{
    padding:16px 18px;
    border-radius:18px;
  }

  .wi-exp-number{
    font-size:2.3rem;
  }

  .wi-about-content h2{
    font-size:23px;
  }

  .wi-about-content p{
    font-size: 12px;
    text-align: justify;
  }

  .wi-feature-item{
    padding:14px 16px;
    border-radius:15px;
    font-size:.9rem;
  }

  .wi-floating-card{
    right:10px;
    bottom:-40px;
    padding:14px 16px;
    border-radius:18px;
  }

  .wi-about-btn{
    font-size: 14px;
    margin-top: 25px;
  }

}



@media (min-width: 992px) {
    .container, .container-lg, .container-md, .container-sm {
        max-width: 94%;
    }
}


/* ADD THIS IN .smh-client-section */

.smh-client-section{
    background:#0b0820;
    position:relative;
    overflow:hidden;
    z-index:1;
}

/* DOT WORLD MAP BG */
.smh-client-section::after{
    content:"";
    position:absolute;
    inset:0;
    background:url("../img/dotted-world-map.webp") center center no-repeat;
    filter:brightness(0) invert(1);
    opacity:0.09;
    background-size:75%;
    z-index:-1;
    pointer-events:none;
}

/* OPTIONAL DARK OVERLAY */
/* .smh-client-section::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at top center,
    rgba(236,50,55,0.12),
    transparent 60%);
    z-index:-1;
} */

/* .smh-client-section::before{
    content:"";
    position:absolute;
    width:500px;
    height:500px;
    background:#712ede;
    opacity:.06;
    filter:blur(100px);
    top:-200px;
    left:50%;
    transform:translateX(-50%);
} */

.smh-client-tag{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-size:14px;
    letter-spacing:1px;
    margin-bottom:18px;
}

.smh-client-tag i{
    color:#712ede;
    font-size:10px;
}

.smh-client-title{
    color:#fff;
    font-size:40px;
   
    margin-bottom:0;
}
.smh-client-title span{
  color: #ffb400;
}
.smh-logo-slider{
    overflow:hidden;
    position:relative;
    width:100%;
}

.smh-logo-track{
    display:flex;
    width:max-content;
    gap:28px;
}

.smh-slider-left .smh-logo-track{
    animation:smhLeftMove 35s linear infinite;
}

.smh-slider-right .smh-logo-track{
    animation:smhRightMove 35s linear infinite;
}

.smh-logo-item{
    /* width:170px;
    height:140px; */
    border-radius:24px;
    background:rgba(255, 255, 255, 0.9);
    border:1px solid rgba(255,255,255,0.12);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px 10px;
    backdrop-filter:blur(10px);
    transition:.4s;
    flex-shrink:0;
    
}

.smh-logo-item:hover{
   
    border-color:#712ede;
    /* background:rgba(113, 46, 222, 0.25); */
}

.smh-logo-item img{
    max-width:180px;
    /* max-height:75px; */
    object-fit:contain;
     /* filter: brightness(0) invert(1); */
    /* opacity:.85; */
    transition:.4s;
}

.smh-logo-item:hover img{
    filter:grayscale(0%);
    opacity:1;
    transform:scale(1.05);
}

/* LEFT TO RIGHT */
@keyframes smhLeftMove{
    0%{
        transform:translateX(0);
    }
    100%{
        transform:translateX(-50%);
    }
}

/* RIGHT TO LEFT */
@keyframes smhRightMove{
    0%{
        transform:translateX(-50%);
    }
    100%{
        transform:translateX(0);
    }
}

@media(max-width:991px){

    .smh-client-title{
        font-size:25px;
        line-height: 1.7;

    }

    .smh-logo-item{
       
        padding:20px;
    }

    .footer-about p
    {
      font-size: 13px;
    }

    .footer-about{
      margin-bottom: 25px;
    }

}



/*=========================
INDUSTRIES STICKY
=========================*/

.uix-industries-sticky{
    background:
    linear-gradient(180deg,#090018,#12022b);
    position:relative;
    padding: 90px 0px;
    
}

.service-card{
  position: relative;
}



/* background glow */

.uix-industries-sticky::before{
    content:'';
    position:absolute;
    width:500px;
    height:500px;
    background:
    radial-gradient(circle,
    rgba(123,47,247,.18),
    transparent 70%);
    top:-150px;
    left:-150px;
    filter:blur(60px);
    animation:uixGlowMove 7s infinite alternate ease-in-out;
}

/* .uix-industries-sticky::after{
    content:'';
    position:absolute;
    width:450px;
    height:450px;
    background:
    radial-gradient(circle,
    rgba(243,195,22,.10),
    transparent 70%);
    right:-100px;
    bottom:-100px;
    filter:blur(60px);
} */

@keyframes uixGlowMove{
    from{
        transform:translate(0);
    }
    to{
        transform:translate(80px,50px);
    }
}

/* LEFT */

.uix-sticky-content{
    position:sticky;
    top:120px;
    padding-right:40px;
}

.uix-section-tag{
    background:rgba(243,195,22,.12);
    border:1px solid rgba(243,195,22,.2);
    color:#f3c316;
    padding:10px 20px;
    border-radius:40px;
    display:inline-block;
    margin-bottom:20px;
}

.uix-sticky-content h2{
    color:#fff;
    font-size:50px;
    font-weight:500;
    line-height:1.2;
    margin-bottom:25px;
}

.uix-sticky-content h2 span{
    color:#f3c316;
}

.uix-sticky-content p{
    color:#bdbdbd;
    line-height:1.9;
    font-size:14px;
}

/* button */

.uix-glow-btn{
    display:inline-flex;
    align-items:center;
    margin-top:30px;
    text-decoration:none;
    color:#fff;
    padding:18px 35px;
    border-radius:60px;
    background: linear-gradient(135deg,#7b2ff7,#5d12d2);
    box-shadow: 0 0 40px rgba(123,47,247,.4);
    transition:.4s;
}



/* RIGHT LIST */

.uix-industries-list{
    display:flex;
    flex-direction:column;
    gap:30px;
}

.uix-industry-item{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    background:transparent;
    border:1px solid rgba(255,255,255,.4);
    padding:25px;
    border-radius:30px;
    backdrop-filter:blur(20px);
    transition:.5s ease;
}

.uix-industry-item:hover{
    transform:translateY(-8px);
    border-color:rgba(123,47,247,.4);

    box-shadow:
    0 0 40px rgba(123,47,247,.15);
}

.uix-industry-item span{
    font-size:55px;
    font-weight:700;
    color:rgba(255,255,255,1);
    min-width:90px;
}

.uix-industry-item h4{
    color:#fff;
    font-size:25px;
    margin-bottom:10px;
}

.uix-industry-item p{
    color:#c3c3c3;
    margin:0;
    line-height:1.8;
    font-size: 14px;
}

.uix-industry-item i{
    font-size:40px;
    color:#f3c316;
    min-width:60px;
}

/* Scroll animation */

.uix-industry-item{
    opacity:0;
    transform:translateY(80px);
    animation:uixFadeUp .7s ease forwards;
}

.uix-industry-item:nth-child(1){animation-delay:.1s}
.uix-industry-item:nth-child(2){animation-delay:.2s}
.uix-industry-item:nth-child(3){animation-delay:.3s}
.uix-industry-item:nth-child(4){animation-delay:.4s}
.uix-industry-item:nth-child(5){animation-delay:.5s}
.uix-industry-item:nth-child(6){animation-delay:.6s}

@keyframes uixFadeUp{
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* mobile */

@media(max-width:991px){

    .uix-sticky-content{
        position:relative;
        top:0;
        margin-bottom:50px;
        padding-right: 0px;
    }

    .uix-sticky-content h2{
        font-size:25px;
    }

    .uix-sticky-content p{
      font-size: 12px;
    }

    .uix-glow-btn{
      font-size: 14px;
    }

    .uix-industry-item{
        flex-direction:column;
        text-align:center;
    }

    .uix-industry-item span{
        font-size:45px;
    }

    .uix-industry-item p{
      font-size: 12px;
    }
    .uix-industry-item h4{
      font-size: 20px;
    }
}

/*=========================
TECH SECTION
=========================*/

.wid-tech-section{
    position:relative;
    overflow:hidden;
    background:
    radial-gradient(circle at top left,
    rgba(123,47,247,.14),
    transparent 25%),

    radial-gradient(circle at bottom right,
    rgba(243,195,22,.07),
    transparent 30%),

    linear-gradient(180deg,#08011b,#100225);

    padding:100px 0;
}

/* heading */

.wid-tech-tag{
    display:inline-block;
    padding:10px 20px;
    border-radius:50px;
    background:rgba(243,195,22,.12);
    border:1px solid rgba(243,195,22,.15);
    color:#f3c316;
    margin-bottom:20px;
}

.wid-tech-title{
    color:#fff;
    font-size:40px;
    font-weight:500;
}

.wid-tech-title span{
    color:#f3c316;
}

.wid-tech-desc{
    color:#bdbdbd;
    max-width:760px;
    margin:auto;
    line-height:1.9;
}

/* owl spacing */

.wid-tech-slider .owl-stage{
    display:flex;
    align-items:stretch;
}

.wid-tech-slider .owl-item{
    padding:10px;
}

/* card */

.wid-tech-card{
    height:100%;
    

    
    border:1px solid rgba(255,255,255,.48);
    border-radius:28px;

    padding:25px 25px;

    text-align:center;

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    transition:.4s ease;
}

.wid-tech-card:hover{
    transform:translateY(-8px);

    border-color:rgba(123,47,247,.35);

    box-shadow:
    0 0 35px rgba(123,47,247,.15);
}

/* TECHNOLOGY ICONS */

.wid-tech-card i{
    font-size:58px;
    margin-bottom:22px;
    transition:.4s ease;
}

/* hover animation */
.wid-tech-card:hover i{
    transform:scale(1.08);
}

/* brand original colors */

.fa-php{
    color:#a5abfd;
}

.fa-wordpress{
    color:#34bdfc;
}

.fa-html5{
    color:#fe582a;
}

.fa-js{
    color:#ffe51f;
}

.fa-laravel{
    color:#ff2b20;
}

.fa-node-js{
    color:#9df395;
}

.fa-shopify{
    color:#c6ff5d;
}

.fa-bootstrap{
    color:#aa72ff;
}

.fa-css3-alt{
    color:#1d9df8;
}

/* MySQL */
.fa-database{
    color:#03d0fe;
}

.wid-tech-card h6{
    color:#fff;
    font-size:20px;
    margin:0;
}

/* remove nav dots */

.wid-tech-slider .owl-dots,
.wid-tech-slider .owl-nav{
    display:none;
}

/* responsive */

@media(max-width:991px){

    .wid-tech-title{
        font-size:25px;
    }

    .wid-tech-card{
        padding:30px 20px;
    }

    .wid-tech-card i{
        font-size:46px;
    }
}

.glow-line{
    position:absolute;
    width:300px;
    height:2px;
    background:linear-gradient(90deg,transparent,#ff6b00,transparent);
    animation: moveLine 6s linear infinite;
    opacity:.6;
}

@keyframes moveLine{
    0%{
        left:-300px;
        top:20%;
    }
    100%{
        left:100%;
        top:80%;
    }
}


#particles-js{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    opacity: 0.02;
}

@media screen and (max-width:992px) {
  .hero-content h1{
    font-size: 20px !important;
  }
      .hero-content p {
        font-size: 12px;
    }

    .footer-links a{
      font-size: 14px;
    }
    .footer-contact li{
      font-size: 14px;
    }

    .footer-bottom{
      font-size: 12px;
    }
}

.our-clients{
  padding: 80px 0px;
}

.client-box{
  background-color: #fff;
  border-radius: 10px;
}

/* .our-clients{
  background-color: #f9feff;
} */

.client-box{
  padding: 20px 0px;
  margin-bottom: 15px;
}

.client-box {
    padding: 15px;
    text-align: center;
    border: 1px solid #ddd;
    overflow: hidden;
    position: relative;
    transition: all ease 0.3s;
}

/* First item of every row */
.row > .col-lg-2:nth-child(6n+1) .client-box {
    border-left: none;
}

/* Last item of every row */
.row > .col-lg-2:nth-child(6n) .client-box {
    border-right: none;
}

.client-box:hover img{
  transform: scale(1.1);
}

.client-box img{
  transition: all ease 0.3s;
}


.client-box::before {
    content: "";
    position: absolute;
    inset: 0;
     border-radius: 10px;
    padding: 2px; /* border width */
    background: linear-gradient( 90deg, transparent, #8a2be2, transparent, #8a2be2 );
    background-size: 300% 300%;
    opacity: 0;
    transition: opacity 0.3s ease;

    /* Creates only border area */
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
}

.client-box:hover::before {
    opacity: 1;
    animation: borderRun 2s linear infinite;
}

@keyframes borderRun {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 300% 50%;
    }
}

.client-box:hover {
    transform: translateY(-4px);
}

.it-breadcrumb {
  color: #ffb000;
  text-decoration: none;
}

.it-breadcrumb a{
  color: #f2f2f2;
  text-decoration: none;
}

.footer-contact li a{
  color: #fff;
  text-decoration: none;
}

.footer-contact li a{
    margin-bottom: 18px;
    font-size: 15px;
    display: flex;
    gap: 12px;
    line-height: 24px;
}


.pa-service-section{
    position: relative;
    padding: 110px 0;
    background: #0b0820;
    overflow: hidden;
}

.pa-blur{
    position: absolute;
    border-radius: 50%;
    filter: blur(140px);
    z-index: 0;
}

.pa-blur-1{
    width: 320px;
    height: 320px;
    background: rgba(113,46,222,.18);
    top: -120px;
    left: -80px;
}

.pa-blur-2{
    width: 260px;
    height: 260px;
    background: rgba(255,180,0,.10);
    bottom: -80px;
    right: -50px;
}

.pa-service-section .container{
    position: relative;
    z-index: 2;
}

.pa-heading{
    max-width: 750px;
    margin: auto;
    margin-bottom: 70px;
}

.pa-heading span{
    color: #ffb400;
    font-size: 13px;
    letter-spacing: 4px;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 15px;
}

.pa-heading h2{
    color: #fff;
    font-size: 40px;
    font-weight: 500;
    margin-bottom: 15px;
   
}

.pa-heading p{
    color: rgba(255,255,255,.65);
    font-size: 15px;
    line-height: 1.8;
    font-weight: 300;
}

.pa-card{
    position: relative;
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 30px;
    overflow: hidden;
    transition: .5s ease;
    height: 100%;
    backdrop-filter: blur(10px);
    padding: 25px 15px;
    text-align: center;
}

.pa-card:hover{
    transform: translateY(-8px);
    border-color: rgba(113,46,222,.4);
    box-shadow: 0 20px 60px rgba(113,46,222,.12);
}

.pa-img{
    overflow: hidden;
}

.pa-img img{
    width: 60px;
    margin-bottom: 20px;
    object-fit: cover;
    transition: .6s ease;
}



/* .pa-content{
    
} */

.pa-top{
    display: flex;
    align-items: center;
    justify-content: end;
    margin-bottom: 10px;
}





.pa-content h3{
    color: #fff;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 300;
    margin-bottom: 10px;
}

.pa-content p{
    color: rgba(255,255,255,.68);
    font-size: 14px;
    line-height: 1.8;
    font-weight: 300;
    margin-bottom: 28px;
}

.pa-btn{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    transition: .4s ease;
}

.pa-btn i{
    width: 42px;
    height: 42px;
    background: #712ede;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .4s ease;
}

.pa-btn:hover{
    color: #ffb400;
}

.pa-btn:hover i{
    background: #ffb400;
    color: #0b0820;
    transform: rotate(-45deg);
}

@media(max-width:991px){

    .pa-heading h2{
        font-size: 38px;
    }

    .pa-content h3{
        font-size: 24px;
    }

}

@media(max-width:767px){

    .pa-service-section{
        padding: 80px 0;
    }

    .pa-heading{
        margin-bottom: 50px;
    }

    .pa-heading h2{
        font-size: 30px;
    }

    


}


/* ENQUIRY BOX */
.wi-enquiry-box{
    position: relative;
    padding: 22px;
    border-radius: 28px;
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.78);
    backdrop-filter: blur(14px);
    overflow: hidden;
    /* animation: wiFloat 4s ease-in-out infinite; */
}

.wi-enquiry-box::before{
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    background: rgba(113,46,222,.28);
    border-radius: 50%;
    filter: blur(90px);
    top: -60px;
    right: -40px;
}

.wi-enquiry-box::after{
    content: "";
    position: absolute;
    width: 140px;
    height: 140px;
    background: rgba(255,180,0,.12);
    border-radius: 50%;
    filter: blur(80px);
    bottom: -50px;
    left: -40px;
}

@keyframes wiFloat{
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-8px);
    }
    100%{
        transform: translateY(0px);
    }
}

.wi-form-top{
    position: relative;
    z-index: 2;
    margin-bottom: 30px;
}

.wi-form-top span{
    color: #ffb400;
    font-size: 13px;
    letter-spacing: 3px;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 12px;
}

.wi-form-top h3{
    color: #fff;
    font-size: 25px;
    font-weight: 600;
    margin-bottom: 0;
}

/* INPUT */
.wi-input-group{
    position: relative;
    margin-bottom: 18px;
    z-index: 2;
}

.wi-input-group i{
    position: absolute;
    top: 50%;
    left: 18px;
    transform: translateY(-50%);
    color: #dd9d04;
    font-size: 15px;
}

.wi-input{
    width: 100%;
    height: 38px;
    border-radius: 10px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    color: #fff !important;
    padding-left: 50px;
    font-size: 13px;
    font-weight: 300;
    box-shadow: none !important;
    transition: .4s ease;
}

.wi-input:focus{
    border-color: #712ede;
    background: rgba(255,255,255,.06);
}

.wi-input::placeholder{
    color: rgba(255,255,255,.55);
    font-size: 12px;
}

/* PHONE */
.wi-phone-wrap{
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    z-index: 2;
    position: relative;
}

.wi-country-select{
    position: relative;
    width: 130px;
}

/* PHONE ICON */
.wi-country-select i{
    position: absolute;
    top: 50%;
    left: 14px;
    transform: translateY(-50%);
    color: #dd9d04;
    z-index: 2;
    font-size: 14px;
}

/* FLAG */
.wi-flag-img{
    position: absolute;
    top: 50%;
    left: 35px;
    transform: translateY(-50%);
    width: 22px;
    height: 16px;
    object-fit: cover;
    border-radius: 2px;
    z-index: 2;
}

/* SELECT */
.wi-code-select{
    height: 38px;
    border-radius: 10px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    color: #fff;
    padding-left: 70px;
    font-size: 14px;
    box-shadow: none !important;
    appearance: none;
    padding-right: 0px;
}
.wi-phone-input{
    flex: 1;
}

.wi-phone-input input{
  padding-left: 10px;
}

/* TEXTAREA */
.textarea .wi-input{
    height: auto;
    padding-top: 18px;
    resize: none;
}

.textarea i{
    top: 22px;
    transform: none;
}

/* BUTTON */
.wi-submit-btn{
    position: relative;
    width: 100%;
    height: 40px;
    border: none;
    border-radius: 18px;
    background: linear-gradient(135deg,#712ede,#8d42ff);
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    overflow: hidden;
    transition: .4s ease;
    z-index: 2;
}

.wi-submit-btn i{
    margin-left: 10px;
    transition: .4s ease;
}

.wi-submit-btn:hover{
    transform: translateY(-4px);
    box-shadow: 0 15px 40px rgba(113,46,222,.35);
}

.wi-submit-btn:hover i{
    transform: translateX(5px);
}

/* SELECT */
.wi-input option,
.wi-code-select option{
    background: #0b0820;
    color: #fff;
}

/* MOBILE */
@media(max-width:767px){

    .wi-enquiry-box{
        padding: 20px;
        margin-top: 40px;
    }

    .wi-form-top h3{
        font-size: 26px;
    }

   

}

/* MODAL */
.wi-premium-modal .modal-dialog{
    max-width: 950px;
}

.wi-premium-modal .modal-content{
    background: #0b0820;
    border-radius: 28px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.06);
    position: relative;
}

/* BLUR */
.wi-premium-modal .modal-content::before{
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    background: rgba(113,46,222,.18);
    border-radius: 50%;
    filter: blur(120px);
    top: -120px;
    right: -100px;
}

/* CLOSE */
.wi-close-btn{
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.10);
    color: #fff;
    z-index: 30;
    transition: .4s ease;
}

.wi-close-btn:hover{
    background: #712ede;
    transform: rotate(90deg);
}

/* SLIDER */
/* TOP SLIDER */
.wi-top-slider{
    height: 75px;
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.wi-top-slider .item img{
    width: 100%;
    height: 75px;
    object-fit: cover;
    display: block;
}

/* LEFT */
.wi-left-info{
    height: 100%;
    padding: 35px 28px;
    border-right: 1px solid rgba(255,255,255,.06);
    background: rgba(255,255,255,.02);
}

.wi-mini-title{
    color: #ffb400;
    font-size: 12px;
    letter-spacing: 3px;
}

.wi-left-info h3{
    color: #fff;
    font-size: 28px;
    font-weight: 300;
    margin: 10px 0;
}

.wi-left-info p{
    color: rgba(255,255,255,.62);
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 28px;
}

/* INFO BOX */
.wi-info-box{
    display: flex;
    gap: 14px;
    margin-bottom: 18px;
}

.wi-icon{
    min-width: 46px;
    height: 46px;
    border-radius: 14px;
    background: rgba(255,255,255,.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #712ede;
    font-size: 16px;
}

.wi-info-box small{
    color: rgba(255,255,255,.45);
    font-size: 11px;
    display: block;
    margin-bottom: 2px;
}

.wi-info-box a,
.wi-info-box p{
    color: #fff;
    font-size: 13px;
    margin: 0;
    text-decoration: none;
}



/* BTN */
.wi-submit{
    width: 100%;
    height: 54px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg,#712ede,#8f46ff);
    color: #fff;
    font-size: 14px;
    transition: .4s ease;
}

.wi-submit i{
    margin-left: 8px;
}

.wi-submit:hover{
    transform: translateY(-3px);
    box-shadow: 0 12px 35px rgba(113,46,222,.35);
}

/* OPTIONS */
.wi-code option,
.wi-input option{
    background: #0b0820;
}

/* MOBILE */
@media(max-width:991px){

    .wi-left-info{
        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.06);
    }

}

@media(max-width:767px){

    .wi-right-form,
    .wi-left-info{
        padding: 25px;
    }

    .wi-phone-group{
        flex-direction: column;
    }

    .wi-country{
        width: 100%;
    }

}

.modal-body .wi-enquiry-box{
  border-radius: 0px;
  border: none;
  height: 100%;
}


/* FLOATING */
.wi-side-enquiry{
    position: fixed;
    right: -55px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;
}

/* BUTTON */
.wi-side-btn{
    position: relative;
    width: 150px;
    height: 40px;
    border: 0;
    border-radius: 20px 20px 0 0;
    background: linear-gradient(135deg,#712ede,#4f1cab);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 20px;
    gap: 16px;
    transform: rotate(-90deg);
    overflow: hidden;
    box-shadow: 0 15px 45px rgba(113,46,222,.35);
    transition: .4s ease;
}

/* GLOW */
.wi-side-btn::before{
    content: "";
    position: absolute;
    width: 140px;
    height: 140px;
    background: rgba(255,180,0,.22);
    border-radius: 50%;
    filter: blur(55px);
    right: -60px;
}

/* ICON */
.wi-side-icon{
    position: relative;
    min-width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.12);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.wi-side-icon i{
    color: #fff;
    font-size: 16px;
}

/* TEXT */
.wi-side-text{
    position: relative;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .5px;
    z-index: 2;
}

/* HOVER */
.wi-side-btn:hover{
    right: 0;
    box-shadow: 0 18px 50px rgba(113,46,222,.5);
}

/* MOBILE */
@media(max-width:767px){

    .wi-side-enquiry{
        right: -72px;
    }

    .wi-side-btn{
        width: 200px;
        height: 58px;
        padding-left: 16px;
    }

    .wi-side-text{
        font-size: 13px;
    }

}



.contact-page{
    background:#07071d;
}

.section-heading{
    color:#fff;
    font-size:40px;
    font-weight:500;
}

.section-text{
    color:#bdbdbd;
}

.office-card{
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    padding:35px;
    border-radius:20px;
    backdrop-filter:blur(10px);
    transition:.4s;
    height:100%;
}

.office-card:hover{
    transform:translateY(-8px);
}

.office-badge{
    background:#ffb300;
    color:#000;
    padding:8px 18px;
    border-radius:30px;
    font-size:14px;
    font-weight:600;
}

.office-card h3{
    color:#fff;
    margin:20px 0;
}

.office-card .contact-info p{
    color:#d7d7d7;
    margin-bottom:15px;
    line-height:1.8;
}

.office-card .contact-info i{
    color:#ffb300;
    width:25px;
}

.office-card .social-links{
    display:flex;
    gap:12px;
    margin-top:25px;
}

.office-card .social-links a{
    width:48px;
    height:48px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08);
    transition:.4s;
    text-decoration:none;
}

.office-card .social-links a:hover{
    transform:translateY(-5px);
}

.office-card .fa-facebook-f{
    color:#1877F2;
}

.office-card .fa-instagram{
    color:#E4405F;
}

.office-card .fa-linkedin-in{
    color:#0A66C2;
}

.office-card .fa-x-twitter{
    color:#ffffff;
}

.office-card .fa-youtube{
    color:#FF0000;
}

.map-box{
    overflow:hidden;
    border-radius:20px;
    border:1px solid rgba(255,255,255,.08);
}

.map-box iframe{
    width:100%;
    height:430px;
    border:0;
}



@media(max-width:991px){

.section-heading{
    font-size:32px;
}

.map-box iframe{
    height:320px;
}


.office-card .social-links{
    justify-content:center;
}

}


.mx-800 {
    margin: 20px auto;
    max-width: 800px;
}





/* SEO Portfolio Table */

.seo-portfolio-section{
    position:relative;
}

.seo-client-header{
    margin-bottom:25px;
}

.seo-client-badge{
    display:inline-block;
    padding:6px 14px;
    font-size:11px;
    font-weight:400;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#ffd84d;
    border:1px solid rgba(255,216,77,.3);
    border-radius:50px;
    box-shadow:0 0 15px rgba(255,216,77,.15);
}

.seo-client-header h3{
    color:#fff;
    font-size:24px;
    font-weight:300;
    margin:15px 0 5px;
    letter-spacing:.5px;
}

.seo-client-header p{
    color:rgba(255,255,255,.65);
    font-size:13px;
    font-weight:300;
    margin:0;
}

.seo-ranking-table{
    width:100%;
    border-collapse:collapse;
    background:rgba(255,255,255,.03);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    overflow:hidden;
}

.seo-ranking-table thead tr{
    background:rgba(123,44,255,.12);
}

.seo-ranking-table th{
    color:#fff;
    font-size:13px;
    font-weight:400;
    padding:16px 20px;
    text-align:left;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.seo-ranking-table td{
    color:rgba(255,255,255,.80);
    font-size:13px;
    font-weight:300;
    padding:15px 20px;
    border-bottom:1px solid rgba(255,255,255,.05);
    text-align:left;
}

.seo-ranking-table tbody tr{
    transition:.3s;
}

.seo-ranking-table tbody tr:hover{
    background:rgba(123,44,255,.08);
}

.seo-ranking-table tbody tr:last-child td{
    border-bottom:none;
}

.not-ranked{
    color:#a0a0a0;
    font-size:12px;
    font-weight:300;
}

.rank-pos{
    color:#ffd84d;
    font-weight:500;
    text-shadow:
    0 0 8px rgba(255,216,77,.6),
    0 0 20px rgba(255,216,77,.3);
}

/* Mobile */

@media(max-width:768px){

    .seo-client-header h3{
        font-size:20px;
    }

    .seo-ranking-table th,
    .seo-ranking-table td{
        font-size:12px;
        padding:12px;
    }

}

.inner-tabs{
    display: flex;
    align-items: center;
    gap: 10px;
}


.zx-pane,
.zx-inner-pane{
    display:none;
}

.zx-pane.active,
.zx-inner-pane.active{
    display:block;
}

.zx-inner-tabs-nav{
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-bottom: 40px;
}

.zx-inner-tab span{
    color: #d5d5d5;
    cursor: pointer;
    border: 1px solid #8f3af1;
    padding: 5px 20px;
    border-radius: 20px;
}



.mla-design-card{
    position:relative;
    overflow:hidden;
   
    cursor:pointer;
    box-shadow:0 15px 35px rgba(0,0,0,.08);
}

.mla-design-img{
    width:100%;
  
    object-fit:cover;
    transition:.7s;
    display:block;
}

.mla-design-overlay{
    position:absolute;
    inset:0;
    background:rgba(11,27,43,.85);

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    opacity:0;
    visibility:hidden;

    transition:.5s;
}

.mla-design-overlay i{
    color:#dc3545;
    font-size:45px;
    margin-bottom:15px;
}

.mla-design-overlay h5{
    color:#fff;
    margin:0;
}

.mla-design-card:hover .mla-design-img{
    transform:scale(1.12);
}

.mla-design-card:hover .mla-design-overlay{
    opacity:1;
    visibility:visible;
}

/* LIGHTBOX */

.mla-lightbox-wrap{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.92);

    display:none;
    justify-content:center;
    align-items:center;

    z-index:999999;
    padding:30px;
}

.mla-lightbox-wrap.active{
    display:flex;
}

.mla-lightbox-image{
    max-width:90%;
    max-height:90vh;
    border-radius:15px;
    animation:mlaZoom .3s ease;
}

.mla-lightbox-close{
    position:absolute;
    top:20px;
    right:30px;
    color:#fff;
    font-size:40px;
    cursor:pointer;
}

@keyframes mlaZoom{
    from{
        transform:scale(.8);
        opacity:0;
    }
    to{
        transform:scale(1);
        opacity:1;
    }
}


.hosting-plans-section{
    background:#0b0820;
    position:relative;
    overflow:hidden;
}

.hosting-title{
    color:#fff;
    font-size:40px;
    
}

.hosting-title span{
    color:#ffa100;
}

.hosting-subtitle{
    color:#bdb8d7;
    max-width:700px;
    margin:auto;
}

.hosting-card{
    background:rgba(113,46,222,0.08);
    border:1px solid rgba(113,46,222,0.35);
    border-radius:20px;
    padding:35px 15px;
    height:100%;
    text-align:center;
    transition:.4s ease;
    position:relative;
}

.hosting-card:hover{
    transform:translateY(-10px);
    border-color:#ffa100;
    box-shadow:0 15px 40px rgba(255,161,0,.15);
}

.hosting-icon{
    width:65px;
    height:65px;
    background:#712ede;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 20px;
}

.hosting-icon i{
    font-size:25px;
    color:#fff;
}

.hosting-card h4{
    color:#fff;
    font-weight:500;
    font-size: 20px;
    margin-bottom:15px;
}

.hosting-card p{
    color:#c9c6dc;
    margin-bottom:20px;
    font-size: 14px;
}

.hosting-card ul{
    padding:0;
    margin:0 0 25px;
    list-style:none;
    height: 200px;
    overflow-y: scroll;
}

.hosting-card ul li{
    color:#fff;
    padding:8px 0;
    font-size: 14px;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.hosting-card ul li:last-child{
    border-bottom:none;
}

.hosting-btn{
    display:inline-block;
    background:#712ede;
    color:#fff;
    padding:12px 28px;
    border-radius:50px;
    text-decoration:none;
    font-weight:600;
    transition:.3s;
}

.hosting-btn:hover{
    background:#ffa100;
    color:#0b0820;
}

.active-plan{
    border:2px solid #ffa100;
    transform:translateY(-10px);
}

.plan-badge{
    position:absolute;
    top:-12px;
    left:50%;
    transform:translateX(-50%);
    background:#ffa100;
    color:#0b0820;
    padding:6px 16px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
}