/*hero section txt */
  .hero-text-align{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  margin-top:-430px;
}


.hero-title{
  font-size:45px;
  font-weight:900;
  display:flex;
  align-items:center;
  gap:10px;
}
.word-slider{
  position:relative;
  height:75px;
  overflow:hidden;
  color:#0085fb;
  min-width:120px; 
}

.word-slider span{
  position:absolute;
  top:0;
  right:0;
  white-space:nowrap;
  opacity:0;
  transform:translateY(25px);
  animation:slideFade 9s infinite;
}


.word-slider span:nth-child(1){animation-delay:0s;}
.word-slider span:nth-child(2){animation-delay:3s;}
.word-slider span:nth-child(3){animation-delay:6s;}

@keyframes slideFade{

  0%{opacity:0; transform:translateY(25px);}
  10%{opacity:1; transform:translateY(0);}
  30%{opacity:1; transform:translateY(0);}
  40%{opacity:0; transform:translateY(-25px);}
  100%{opacity:0;}

}

.title-desc{
  font-size: 26px;
  font-weight: 300;
}


 /* txt on mobile */
  @media(max-width: 1000px){
  .hero-text-align{
  margin-top:-376px;
}
.hero-title{
  font-size:37px;
  font-weight:900;
}
.title-desc{
  font-size: 22px;
  font-weight: 300;
  margin-left: 15px;
}
  }


/*********************************************************************************************************************************************/

.header{
margin-top: 20px;
background:#E9F2FF;
}

.header-inner{
display:flex;
align-items:center;
justify-content:space-between;
height:70px;
position:relative;
}

/* logo */

.logo-header{
    width: 150px;
}

/* nav */

.nav ul{
display:flex;
gap:30px;
list-style:none;
padding:0;
margin:0;
}

.nav a{
text-decoration:none;
color:#333;
}

/* buttons */

.btn-icon{
  width: 30px;
}

.header-actions{
display:flex;
gap:10px;
}

.btn{
  display:flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border: 1px solid #0085fb;
  border-radius:50px;
  cursor:pointer;
  -webkit-border-radius:50px;
  -moz-border-radius:50px;
  -ms-border-radius:50px;
  -o-border-radius:50px;
}

.support-btn{
  color: #0085fb;
}

.login-btn{
background:#0085fb;
color:#fff;
}

.support-btn,
.login-btn {
  transition: background-color .25s ease, color .25s ease;
}

.support-btn:hover {
  background: rgba(0,133,251,0.12);
  color: #0085fb;
}

.login-btn:hover {
  background: #0073db;
  color: #fff;
}


/* menu toggle */

.menu-toggle{
display:none;
flex-direction:column;
gap:4px;
background:none;
border:none;
cursor:pointer;
}

.menu-toggle span{
width:22px;
height:2px;
background:#333;
display:block;
}

/* مگامنو */
/*************************************/

.mega-parent{
  position:relative;
  z-index:1 !important;
}

.mega-menu{
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background: rgba(255,255,255,0.7); 
    position:absolute;
    top:160%;
    right: -500%;
    width:680px;
    border-radius:10px;
    padding:25px;
    display:flex;
    gap:40px;
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition: .25s ease;
    z-index:99;
    -webkit-transition: .25s ease;
    -moz-transition: .25s ease;
    -ms-transition: .25s ease;
    -o-transition: .25s ease;
}

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

.mega-col{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:150px;
}

.mega-col h4{
  font-size:16px;
  font-weight:700;
  margin-bottom:8px;
}

.mega-col a{
  font-size:14px;
  color:#333;
  text-decoration:none;
  transition:.2s;
}

.mega-col a:hover{
  color:#007bff;

}


/*** tablet ***/

@media (max-width:1150px){

.btn .text{
display:none;
}

}


 /***  mobile  ****/
@media (max-width:968px){

    /* خود آیکون‌ها */
  .header-actions i,
  .header-actions img,
  .header-actions svg {
    width: 18px;
    height: 18px;
  }

  /* باکس دور آیکون‌ها */
  .header-actions .action-btn,
  .header-actions button,
  .header-actions a {
    width: 34px;
    height: 34px;
    padding: 6px;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
}

  .header-actions {
    gap: 6px;
  }

  /* بخش هدر */
  .header{
    position:relative;
    z-index:9999;
    background:transparent;
  }

  .header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    height:60px;
  }

  /* منوی همبرگری — سمت راست */
  .menu-toggle{
    display:flex;
    flex-direction:column;
    gap:4px;
    background:none;
    border:none;
    cursor:pointer;
    z-index:10000;
    order:1;   
  }

  .logo{
    margin-top: 5px;
    position:absolute;
    left:55%;
    top:45%;
    transform:translate(-50%, -50%);
    z-index:9999;
  }

  .logo-header{
    width:130px;
  }

  /* دکمه‌ها — سمت چپ */
  .header-actions{
    order:2;
    display:flex;
    gap:10px;
    z-index:9999;
  }

  .btn .text{
    display:none;
  }

  /* منوی موبایل */
  .nav{
    position:fixed;
    top:0;
    right:-260px;
    width:260px;
    height:100vh;
    background:#fff;
    padding:80px 20px;
    transition:.3s ease;
    z-index:99999;
    overflow-y:auto;
  }

  .nav.active{
    right:0;
  }

  .nav ul{
    display:flex;
    flex-direction:column;
    gap:20px;
    padding:0;
    margin:0;
  }

  
  .nav a{
    display:flex;
    flex-direction:row-reverse;
    align-items:center;
    gap:10px;
    color:#333;
    flex-direction: row; 
  }

  /* مگامنو در موبایل */
  .mega-menu{
    position:static !important;
    width:100% !important;
    background:#fafafa !important;
    padding:10px !important;
    display:none;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    border-radius:8px;
    margin-top:10px;
  }

  .mega-menu.active{
    display:flex !important;
    flex-direction:column;
    gap:12px;
  }
  
}


/* دکمه بستن */
/* دکمه بستن منوی موبایل */
.nav-close-btn{
  display:none;
}

@media(max-width:968px){
  .nav-close-btn{
    display:block;
    position:absolute;
    top:20px;
    left:20px;
    background:none;
    border:none;
    font-size:28px;
    cursor:pointer;
    z-index:100000;
    color:#333;
  }
}




.header.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #E9F2FF;
  box-shadow: 0 2px 8px rgba(128, 128, 128, 0.1);
  z-index: 10000;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
  margin-top:0;
  padding: 10px 0 5px 0;
}