body.dark-mode {
    background-color: black !important; 
    
}

/* Navbar */
body.dark-mode .navbar {
  background: #1f1f1f !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.6);
}
body.dark-mode .navbar .nav-link {
  color: white !important;
}
body.dark-mode .navbar .nav-link.active {
  color: #124b65 !important;
}

body.dark-mode .title-004{
  color: white !important;
}

body.dark-mode #oo123{
  color:  white !important;
}




/* Footer */
body.dark-mode .footer,
body.dark-mode .Copyright {
  background: #1a1a1a !important;
  color: white !important;
}
body.dark-mode .footer a {
  color: white !important;
}
body.dark-mode .footer a:hover {
  color:#124b65 !important;
}

 body.dark-mode .box-14{
  border: 2px solid white !important;
 }

  body.dark-mode .icon-wrapper-13 i{
    color: #124b65 !important;
  }
    body.dark-mode .icon-wrapper-13{
      border: 2px solid white;
    }

     body.dark-mode .footertitle{
      color: #124b65 !important;
     }     
    body.dark-mode .box-14:hover {
      box-shadow: 0 4px 15px #124b65 !important;
     
}



    
/* Back to Top */
body.dark-mode .back-to-top {
  background: #124b65 !important;
  color: #fff;
}

/* Home Section */
body.dark-mode .home-21 {
  background: linear-gradient(145deg, #2a2a2a, #1a1a1a) !important;
}
body.dark-mode .home1 {
  color: white !important;
}

/* Slider Cards */
body.dark-mode .c3 {
  background: #1f1f1f !important;
  color:  white;
  border: 2px solid #124b65;
}

/* Buttons */
body.dark-mode #theme-toggle,
body.dark-mode #lang-toggle,
body.dark-mode .btn-main1,
body.dark-mode .readmore,
body.dark-mode .send,
body.dark-mode .sosmas {
  background: linear-gradient(145deg, #2a2a2a, #1a1a1a);
  color: white !important;
  border: 1px solid #124b65;
}
body.dark-mode .btn-main1:hover,
body.dark-mode .readmore:hover,
body.dark-mode .send:hover,
body.dark-mode .sosmas:hover {
  background: #124b65 !important;
  color: white !important;
}


 body.dark-mode .WhatsApp i { color:#128C7E  !important; }
  body.dark-mode .WhatsApp:hover { background:linear-gradient(180deg, #25D366, #128C7E) !important; }
.body.dark-mode .WhatsApp:hover i { color: white !important; }


 body.dark-mode .Telegram i { color: #2aaae1 !important; }
 body.dark-mode .Telegram:hover { background:linear-gradient(180deg, #37AEE2, #1E96C8) !important; }
 body.dark-mode .Telegram:hover i { color: white !important; }

 body.dark-mode .linkden i { color: #004182 !important; }
 body.dark-mode .linkden:hover { background:linear-gradient(180deg, #0A66C2, #004182) !important }
 body.dark-mode .linkden:hover i { color: white !important; }

  body.dark-mode .instagram i { color: palevioletred !important; }
 body.dark-mode .instagram:hover {
  background:linear-gradient(45deg, 
#884eaf, 
#c5438c, 
#E1306C, 
#fd4b4b, 
#F56040, 
#f4b051) !important ;
}
 body.dark-mode  .instagram:hover i { color: white !important; }

 body.dark-mode .facebook i { color:#0F5AC7 !important; }
 body.dark-mode .facebook:hover { background:linear-gradient(180deg, #1877F2, #0F5AC7) !important}
 body.dark-mode .facebook:hover i { color: white !important; }

 body.dark-mode  .github i { color: black !important; }
body.dark-mode .github:hover { background-color: black !important; }
body.dark-mode .github:hover i { color: white !important; }

body.dark-mode .youtube i { color: rgb(197, 35, 35) !important; }
 body.dark-mode .youtube:hover { background:linear-gradient(180deg, #FF0000, #CC0000) !important; }
 body.dark-mode .youtube:hover i { color: white !important; }

/* Cards & Services */
body.dark-mode .service-card,
body.dark-mode .book2,
body.dark-mode .book8,
body.dark-mode .ts-card {
  background: #1f1f1f !important;
  color: white !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
}
body.dark-mode .service-card:hover,
body.dark-mode .book8:hover,
body.dark-mode .ts-card:hover {
  transform: scale(1.03);
  box-shadow: 0 15px 40px #124b6574 !important;
}
body.dark-mode .sad{
  color: white !important;
}
body.dark-mode .text{
  color: rgba(255, 255, 255, 0.82);
}
body.dark-mode .title-2{
  color: #124b65 !important;
}
/* Chart */
body.dark-mode .Chart1 {
  background: linear-gradient(145deg, #2a2a2a, #1a1a1a);
  color: white;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
body.dark-mode .Chart1 h1 { color: #124b65 !important; }
body.dark-mode .Chart1 p { color: white !important; }
body.dark-mode .Chart1 .Chart1-btn {
  background: #1f1f1f !important;
  color:  white !important;
  border: 1px solid #555;
}
body.dark-mode .Chart1 .Chart1-btn:hover {
  background: #124b65 !important;
  color: white !important;
}

/* FAQ / Accordion */
body.dark-mode .accordion-button {
  background: #1f1f1f !important;
  color: white !important;
}
body.dark-mode .accordion-button::before {
  background: #124b65 !important;
  color: white !important;
}
body.dark-mode .accordion-body {
  background: #2a2a2a !important;
  color: white !important;
}

/* Contact Section */
body.dark-mode .contactus-1 {
  background: linear-gradient(145deg, #2a2a2a, #1a1a1a) !important;
  color: white !important;
}
body.dark-mode .contact a {
  color: #124b65 !important;
}

/* Social Items */
body.dark-mode .social-item {
  background: #1a1a1a !important;
  border: 2px solid #124b65 !important;
}
body.dark-mode .social-item i {
  color: white!important;
}
body.dark-mode .social-item:hover {
  transform: scale(1.1);
}


/* bg-bg-bg */
body.dark-mode .bg-bg-bg {
  background: linear-gradient(145deg, #2a2a2a, #1a1a1a) !important;
  color: white !important;
}

/* Nav داخل بخش Service */
body.dark-mode .service .nav .nav-link {
    transition: .5s;
    background: #1f1f1f; /* پس‌زمینه تیره */
    border-color: #555; /* حاشیه ملایم برای حالت غیرفعال */
}

body.dark-mode .service .nav .nav-link.active {
    border-color:#124b !important; /* حاشیه سبز */
    background: #124b65; /* گرادیانت سبز */
}

body.dark-mode .service .nav .nav-link.active h5 {
    color: white !important; 
    border-bottom: none !important;
}

body.dark-mode .service .nav h5 {
    color: white;
}

body.dark-mode .service .nav i {
    color: white; /* آیکون سبز */
}

body.dark-mode .service .nav .nav-link.active h5 i {
    color:  white !important; 
}

/* دکمه Readmore در Dark Mode */
body.dark-mode .service .readmore {
    background: linear-gradient(145deg, #2a2a2a, #1a1a1a); 
    color: white !important;
    border: 1px solid #124b65; 
    border-radius: 5px;
    padding: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
}

body.dark-mode .service .readmore:hover {
    background: #124b65!important;
    color: #000 !important; 
}

/* آیکون‌ها */
body.dark-mode .service .icon-122 {
    color:  #124b65; /* سبز */
}

 body.dark-mode .social {
  background-color:  #1b46591b;
  border-radius: 10px;
}
 body.dark-mode .card2 img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* تصویر بدون کشیدگی */
  border: 10px solid #124b65; 
  border-radius: 20px; 
  box-sizing: border-box; 
}



/* TOP */
.back-to-top {
    position: fixed;
    right: 25px;
    bottom: 25px;
    width: 50px;
    height: 50px;
    background:  #124b65;
    color: #fff;
    border-radius: 50%;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
    z-index: 9999;
}
.back-to-top:hover{
  background: white !important;
  color:  #124b65 ;
}

.logo-1{
  width: 50pX;
  height: 45PX; 
  
}
/* Top end */
 .bg-bg-bg{
  background:  #124b65;
 }

  body {
            background: #f5f7fa;
            font-family: Arial, sans-serif;
        }


    
/* RESET & FONT */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Inter,sans-serif;
}

.nav-link.active {
  color: #000 !important;
  border-bottom: 0.9px solid #fff;
}

.nav-link.active::after{
  width:100%;
}


/* NAVBAR start */
.navbar{
  background:white;
  transition:.4s;
  
}

.navbar.scrolled{
  background: white;
  box-shadow:0 4px 15px rgba(0,0,0,.3);
}

.navbar-brand img{
  height:50px;
  border-radius:8px;
}

.navbar-nav{
  gap:10px;
}

.nav-link{
  color: black !important;
  font-size:20px;
  position:relative;
  padding-bottom:6px;
  transition:.3s;
}
#oo123{
  color: black;
}
/* default underline hidden */
.nav-link::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:0;
  height:2px;
  background:#124b65;
  transition:.3s;
}

/* hover underline for non-active links */
.nav-link:not(.active):hover::after{
  width:100%;
}

/* ACTIVE LINK */
.nav-link.active{
  color:  #20475a !important;
}

/* underline always visible for active link */
.nav-link.active::after{
  width:100%;
}
/* NAVBAR end */

/* Navbar end */

/* ================== Theme & Language Buttons ================== */
#theme-toggle, #lang-toggle{
  border: none;
  background:  #124b65;
  color: white;
  border-radius: 20px;
  padding: 6px 14px;
  font-weight: 600;
  transition: .3s;
  margin-left: 10px;
}
@media(hover:hover){
  #theme-toggle:hover, #lang-toggle:hover{
    transform: scale(1.05);
  }
}

.buttons1{
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}
.btn-main1{
  padding: 12px 28px;
  border-radius: 14px;
  border: none;
  font-weight: 600;
  cursor: pointer;
  transition: .3s;
}
.btn-primary1{background: #124b65; color:#fff ; border: 2px solid white;}
.btn-outline1{background: transparent; border: 2px solid #fff; color: #fff;}
@media(hover:hover){
  .btn-main1:hover{
    transform: scale(1.05);
    background-color: #fff;
    color: #124b65;
  }
}

/* ================== Home Section ================== */
.home-21 {
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #124b65;
  padding: 80px 20px 20px 20px;
}

.home1{
  width: 90%;
  max-width: 1200px;
  margin: auto;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
.p-p{
  color: white;
}

/* ================== Card ================== */
.card2{
  width: 100%;
  max-width: 600px;
  aspect-ratio: 4/3; 
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 15px 40px #124b6577;
  transition: transform 0.3s ease;
  margin: 0 auto;
}
.card2:hover{
  transform: scale(1.03);
}
.card2 img{
  width: 100%;
  height: 100%;
  object-fit: cover; /* تصویر کامل و بدون کشیدگی */
}

/* ================== Mobile & Tablet Responsive ================== */

/* Tablet 768px–991px */
@media(max-width:991px){
  .home1{
    display:flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .two2, .one1{
    width:100%;
    max-width:600px;
    margin-bottom:20px;
  }
  .buttons1{
    justify-content:center;
  }
  .navbar-nav{
    flex-direction: column;
    text-align:center;
    margin-top: 15px;
  }
  .nav-link{margin:10px 0;}
  #theme-toggle, #lang-toggle{margin-top:10px; align-self:center;}
}

/* Mobile <768px */
@media(max-width:767px){
  .home-21 {
    padding-top: 60px; /* فاصله مناسب متن زیر نوبار */
  }
  .one1 h1{
    font-size: clamp(1.5rem, 6vw, 2.5rem);
  }
  .buttons1{
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    align-items: center;
  }
  .two2, .one1{
    max-width: 100%;
  }
  .card2{
    max-width: 90%;
    aspect-ratio: 4/3;
  }
  .card2 img{
    object-fit: cover; /* همیشه تصویر کامل */
  }
}

/* ================== Text ================== */
.home-h1{
  font-size: 40px;
  color: white;
}

/* ================== Touch Support ================== */
.nav-link.hovered::after {
  width: 100%;
}
.btn-main1.hovered {
  transform: scale(1.05);
}
.card2.hovered {
  transform: scale(1.03);
}


/* ================== White Border Around Image ================== */
.card2 img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* تصویر بدون کشیدگی */
  border: 10px solid rgba(255, 255, 255, 0.965); 
  border-radius: 20px; 
  box-sizing: border-box; 
}

/* ================== White Border Around Image ================== */






/* --- About US --- */
body {
  background: #f0f4fa;
 
}

.book1 {
  padding:20px 0;
}

/* --- Left Card (متن ساده) --- */
.book2 {
  background: #fff;
  border-radius: 20px;
  padding: 50px;
  height: 100%;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

/* --- Section Header --- */
.book3 small {
  color: #124b65;
  font-weight: 600;
  font-size: 15px;
}

.book3 h1 {
  font-weight: 800;
  margin-top: 12px;
  line-height: 1.3;
  font-size: 38px;
}

/* --- Paragraph --- */
.book4 {
  color:black;
  margin-top: 16px;
  font-size: 16px;
}

/* --- List --- */
.book5 li {
  list-style: none;
  margin-bottom: 14px;
  font-weight: 500;
  font-size: 15.5px;
  position: relative;
  padding-left: 25px;
}

.book5 li::before {
  content: "✔";
  color: #124b65;
  position: absolute;
  left: 0;
  top: 0;
  font-weight: bold;
}

/* --- Button --- */
.book6 {
  background: #124b65;
  color: #fff;
  padding: 14px 36px;
  border-radius: 40px;
  text-decoration: none;
  display: inline-block;
  margin-top: 25px;
  font-size: 15px;
}

.book6:hover {
  background:#124b65;
  transform: scale(1.04);
}

/* --- Image Container حرفه‌ای --- */
.book7 {
  width: 100%;
  height: 300px;
  overflow: hidden;
  border-radius: 20px;
  margin-bottom: 35px;
  perspective: 1200px; /* حس سه بعدی */
  position: relative;
  transition: transform 0.5s ease;
}

.book7 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 20px;
  transition: transform 0.6s ease, filter 0.6s ease;
}

/* Overlay حرفه‌ای روی عکس */
.book7::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(30,109,252,0.25), rgba(0,0,0,0.15));
  opacity: 0;
  transition: opacity 0.5s ease;
}

/* Hover حرفه‌ای عکس */
.book7:hover img {
  transform: scale(1.12) rotateX(2deg) rotateY(2deg);
  filter: brightness(1.05);
}

.book7:hover::before {
  opacity: 1;
}

/* --- Number Cards ساده --- */
.book8 {
  background: #fff;
  border-radius: 16px;
  padding: 28px;
  text-align: center;
  height: 100%;
  box-shadow: 0 2px 10px #124b6537 !important;
}

.book8 h2 {
  color:#124b65;
  font-weight: 800;
  font-size: 32px;
  margin: 0;
}

.book9 {
  font-weight: 500;
  font-size: 15px;
  margin-top: 10px;
}

.book8 {
  background: #fff;
  border-radius: 16px;
  padding: 28px;
  text-align: center;
  height: 100%;
  box-shadow: 0 2px 5px 0  #124b652b !important;
  transition: transform 0.4s ease, box-shadow 0.4s ease, background 0.4s ease;
  position: relative;
}

.book8:hover {
  transform: scale(1.05);
  box-shadow: 0px 15px 35px #124b6555 !important;
  background: #124b6523;
}

/* --- Responsive --- */
@media (max-width: 768px) {
  .book2 {
    padding: 30px;
  }

  .book3 h1 {
    font-size: 30px;
  }

  .book7 {
    height: 220px;
  }

  .book8 h2 {
    font-size: 28px;
  }
}
.aboutus{
  color: #124b65;
}  

/* About US END */


/* SERVICESA START */
.service .nav .nav-link {
    transition: .5s;
    background-color: #124b650c;
}

.service .nav .nav-link.active {
    border-color:#124b65 !important;
    background:#124b65 ;
}

.service .nav .nav-link.active h5 {
    color: white !important;
}

.service .nav h5{
  color: black;
}
.service .nav i{
  color: #124b65 ;
}



.service .nav .nav-link.active h5 i {
    color: white !important;
}

.readmore{
  background: #124b65 !important;
  border: none;
  color: white !important;
  text-decoration: none;
  border-radius: 5px;
  padding: 5px;
}
.icon-122{
  color: #124b65 ;
}


/* services end */

/* services start */

/* کارت */
.service-card {
  background: #124b651c;
  padding: 32px;
  border-radius: 22px;
  height: 100%;
  transition: all 0.4s ease;
  cursor: pointer;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

/* هاور کارت */
.service-card:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: 0 12px 35px #124b6584 !important;
}

/* آیکون داخل wrapper مربع */
.icon-wrapper {
  width: 65px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  background: #124b65;
  overflow: hidden;
  transition: transform 0.6s ease;
  border-radius: 10px;
}

/* آیکون واقعی داخل مربع */
.icon-wrapper i {
  font-size: 28px;
  color: #fff;
  transition: transform 0.6s ease;
}

/* هاور آیکون چرخشی */
.service-card:hover .icon-wrapper i {
  transform: rotate(360deg) scale(1.2);
}

/* عنوان */
.service-card h3 {
  transition: all 0.5s ease;
}

.service-card:hover h3 {
  color: #124b65;
}

/* تگ‌ها */
.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 16px;
}

.tag {
  background: #124b65;
  color: white;
  font-size: 12px;
  padding: 6px 14px;
  border-radius: 20px;
  display: inline-block;
  white-space: nowrap;
  transition: transform 0.3s ease, background 0.3s ease;
}

.service-card:hover .tag {
  transform: translateY(-3px);
  background: #124b65;
  color: white !important;
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .service-card {
    padding: 24px;
  }

  .icon-wrapper {
    width: 70px;
    height: 70px;
  }

  .icon-wrapper i {
    font-size: 24px;
  }
}

@media (max-width: 768px) {
  .service-card {
    padding: 20px;
  }

  .icon-wrapper {
    width: 60px;
    height: 60px;
  }

  .icon-wrapper i {
    font-size: 22px;
  }
}

@media (max-width: 480px) {
  .service-card {
    padding: 16px;
  }

  .tag {
    font-size: 11px;
    padding: 5px 12px;
  }

  .dasa {
    min-height: auto;
  }
}

/* محدودکننده عرض (در صورت استفاده) */
.services-66 {
  max-width: 600px;
}

/* ارتفاع کارت‌ها فقط دسکتاپ */
@media (min-width: 769px) {
  .dasa {
    min-height: 350px;
  }
}

/* FIX GLOBAL */
* {
  box-sizing: border-box;
}

/* services end */



/*** OUR TEAM START ***/
.ts-wrapper {
    margin-top: 50px;
}

.ts-card {
    background: #f8f9fa;
    border-radius: 10px;
    overflow: hidden;
    transition: .5s;
    position: relative;
}

.ts-card:hover {
    box-shadow: 0 0 30px #dddddd;
}

.ts-image-box {
    position: relative;
    overflow: hidden;
}

.ts-image-box img {
    width: 100%;
    transition: .5s;
    height: 300px;
}

.ts-card:hover .ts-image-box img {
    transform: scale(1.15);
}

.ts-social-layer {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .5s;
}

.ts-card:hover .ts-social-layer {
    background:#124b6579 ;
}

.ts-social-btn {
    margin: 0 3px;
    margin-top: 100px;
    opacity: 0;
    transition: .3s;
    text-decoration: none;
}

/* نمایش دکمه‌ها روی hover کارت */

.ts-card:hover .ts-social-btn {
    opacity: 1;
    margin-top: 0;
}


.ts-social-btn:active,
.ts-social-btn:focus {
    opacity: 1;
    margin-top: 0;
    outline: none;
}

.ts-info {
    text-align: center;
    padding: 20px 0;
}
.btn-1{
     background-color: #124b65;
     padding: 10px;
     border: none;
     border-radius: 10px;
     color: white;
     font-size: 20px;
    
}
.title-1{
    color: #124b65;
}

.btn-ourteam{
  background-color: white;
  color: #124b65 !important;
}
.btn-ourteam:hover{
  background-color: white !important;
  color: #124b65 !important;
}
.ourteam-title{
  color: #124b65;
}
/* team end */



 /* chart for our team page */
.Chart1 {
  background:  #124b65;
  color: #fff !important;
  text-align: center;
  padding: 4rem 2rem;
  border-radius: 1rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.Chart1:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.Chart1 h1 {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  
}
.text-00{
  color: white !important;
}

.Chart1 p {
  font-size: 1.125rem;
  line-height: 1.6;
  margin-bottom: 2rem;
}

.Chart1 .Chart1-btn {
  background-color: #fff;
  color:  #124b65;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  border: none;
  border-radius: 0.5rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease;
}

.Chart1 .Chart1-btn:hover {
  background-color:  #124b65;
  transform: scale(1.05);
  color: white !important;
}

.Chart1::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.029), transparent 70%);
  animation: float 6s linear infinite;
  pointer-events: none;
}

@keyframes float {
  0% { transform: rotate(0deg) translate(0,0); }
  50% { transform: rotate(180deg) translate(10px,10px); }
  100% { transform: rotate(360deg) translate(0,0); }
}

/* chart end */

/* part of question for our team page */

.faq-section {
    max-width: 1000px;
    margin: 60px auto;
}

.accordion-item {
    border: none;
    margin-bottom: 15px;   /* فاصله بین آیتم‌ها */
    border-radius: 12px;
    overflow: hidden;
}

/* دکمه سوال */
.accordion-button {
    position: relative;
    background: #ffffff;
    font-weight: 600;
    padding: 20px 70px 20px 20px;  
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);  
    outline: none;
}

/* حذف فلش پیشفرض bootstrap */
.accordion-button::after {
    display: none !important;
}

/* وقتی باز است: سایه سبز کم‌رنگ اضافه می‌شود */
.accordion-button:not(.collapsed) {
    box-shadow:
        0 4px 12px rgba(0,0,0,0.08),
        0 0 0 3px #124b6568 !important;
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* فوکوس و اکتیو */
.accordion-button:focus,
.accordion-button:active,
.accordion-button:focus-visible {
    outline: none !important;
    box-shadow:0 0 0 3px  #124b65 !important;
} 

/* دایره + و − با وسط دقیق */
.accordion-button::before {
    content: "+";
    position: absolute;
    top: 50%;
    right: 20px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #124b65;
    color: #ffffff;
    font-size: 22px;
    font-weight: bold;

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

    transform: translateY(-50%);
    transition: 0.3s ease;
}

/* وقتی باز شد − */
.accordion-button:not(.collapsed)::before {
    content: "−";
}

/* بدنه جواب */
.accordion-body {
    background: white;
    line-height: 1.8;
    padding: 20px;
}

/* موبایل */
@media (max-width: 576px) {
    .accordion-button {
        font-size: 14px;
        padding-right: 60px;
    }

    .accordion-button::before {
        width: 32px;
        height: 32px;
        font-size: 18px;
        top: 50%;
        transform: translateY(-50%);
    }
}

/* part of question for our team page end */


/* slider for about page  */

.c0 {
  width:100%;
  min-height:50vh;
  display:flex;
  justify-content:center;
  align-items:center;
}

/* slider */
.c1 {
  position:relative;
  width:90%;
  max-width:1200px;
  height:400px;
  overflow:hidden;
}

/* cards wrapper */
.c2 {
  position:relative;
  width:100%;
  height:100%;
}

/* card */
.c3 {
  position:absolute;
  top:50%;
  left:50%;
  width:520px;
  max-width:90%;
  padding:30px;
  background:#fff;
  border-radius:20px;
 
  transform:translate(-50%, -50%) scale(0.7);
  opacity:0;
  transition: all 0.8s ease;
  text-align:center;
  
}

.c3.c4 {
  transform:translate(-50%, -50%) scale(1);
  opacity:1;
  z-index:3;
}

.c3.c5 {
  transform:translate(-120%, -50%) scale(0.85);
  opacity:0.4;
  z-index:2;
}

.c3.c6 {
  transform:translate(20%, -50%) scale(0.85);
  opacity:0.4;
  z-index:2;
}

.c3:hover {
  box-shadow:0 20px 20px  #124b6570 ;
  border:2px solid  #124b65 ;
}
.title-2{
  color: #124b65 ;
}

/* avatar */
.c7 {
  width:80px;
  height:80px;
  border-radius:50%;
  margin:0 auto 15px;
  overflow:hidden;
  background: #124b65;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  font-weight:bold;
}

.c7 img {
  width:100%;
  height:100%;
  object-fit:cover;
}

h3 { margin:15px 0 5px; color:#222; font-size:22px; }
span { font-size:14px;; }
p { margin-top:15px; color:#444; line-height:1.6; font-size:15px; }

/* buttons */
.c8 {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:50px;
  height:50px;
  border:none;
  border-radius:50%;
    background: #124b65;
  font-size:24px;
  cursor:pointer;
  box-shadow:0 10px 25px rgba(0,0,0,0.2);
  z-index:5;
  transition: all 0.3s ease;
  color: white;
}

.c8:hover {
  border: 2px solid  #124b65;
  background: white;
  color: #124b65;
}

.c9 { left:10px; }
.c10 { right:10px; }

@media (max-width:768px) {
  .c3 { width:300px; padding:20px; }
  .c7 { width:60px; height:60px; font-size:22px; }
}

/* slider for about  page  end */

  


/* contact start */
  .contact i{
    color:   #124b65;
  }
  .contact a{
    text-decoration: none;
    color: black;

  }
  .contactus-1{
    background: #124b65;
  }
  
  .send{
       background:  #124b65 ;
      color: white;
      border: none;
  }
  .send:hover{
    transform: scale(1.02);
     background:  #124b65 ;
      color: white;
      border: none;
 
  }
  .contactus{
    color: #124b65;
  }
  /* contact end */



/*** Footer Start ***/
.footer {
    background: #124b65;
    
}
.footer .footer-item a {
    line-height: 30px;
    color: var(--bs-white);
    transition: 0.5s;
}

.footer .footer-item p {
    line-height: 20px;
}

.footer a{
    text-decoration: none;
}
.footer .footer-item a:hover {
    letter-spacing: 2px;
    color: black;
  
  
}

.icon-wrapper-13 {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  border-radius: 10px;
  overflow: hidden;
  flex-shrink: 0;
  transition: transform 0.3s ease, border 0.3s ease;
  border: 2px solid  #124b65; /* بورد آیکون */
}


.icon-wrapper-13 i {
  font-size: 20px;
  color:  #124b65;
  transition: transform 0.6s ease;
}


.box-14:hover .icon-wrapper-13 i {
  transform: rotate(360deg) scale(1.1);
}

/* border برای کل box-14 */
.box-14 {
  border: 2px solid white;
  border-radius: 8px;
  transition: box-shadow 0.3s ease, border 0.3s ease;
}

/* هاور روی کل box-14 */
.box-14:hover {
  box-shadow: 0 4px 15px white;
  border-color:   #124b65;
}


  .footertitle{
    color: white;
  }

/*** Footer End ***/
.sosmas {
  background: #124b65;
  color: white;
  border: none;
}
.sosmas:hover{
  background: white;
  color:  #124b65;
  border: 2px solid  #124b65;
  transform: scale(1.03);
}
.social-item {
  width: 65px;
  height: 65px;
  background: white;
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  cursor: pointer;
  transition: 0.3s;
}

.WhatsApp i { color:#128C7E ; }
.WhatsApp:hover { background:linear-gradient(180deg, #25D366, #128C7E); }
.WhatsApp:hover i { color: white; }

.Telegram i { color: #2aaae1; }
.Telegram:hover { background:linear-gradient(180deg, #37AEE2, #1E96C8); }
.Telegram:hover i { color: white; }

.linkden i { color: #004182; }
.linkden:hover { background:linear-gradient(180deg, #0A66C2, #004182) }
.linkden:hover i { color: white; }

.instagram i { color: palevioletred; }
.instagram:hover {
  background:linear-gradient(45deg, 
#884eaf, 
#c5438c, 
#E1306C, 
#fd4b4b, 
#F56040, 
#f4b051);
}
.instagram:hover i { color: white; }

.facebook i { color:#0F5AC7; }
.facebook:hover { background:linear-gradient(180deg, #1877F2, #0F5AC7) }
.facebook:hover i { color: white; }

.github i { color: black; }
.github:hover { background-color: black; }
.github:hover i { color: white; }

.youtube i { color: rgb(197, 35, 35); }
.youtube:hover { background:linear-gradient(180deg, #FF0000, #CC0000); }
.youtube:hover i { color: white; }

.social-item i { font-size: 28px; }

.social-item span {
  position: absolute;
  bottom: -35px;
  background: white;
  color: black;
  padding: 5px 12px;
  border-radius: 8px;
  font-size: 13px;
  opacity: 0;
  transform: translateY(5px);
  transition: 0.3s;
  white-space: nowrap;
}


/* نمایش نام فقط روی دسکتاپ */
@media (min-width: 577px) {
  .social-item:hover span {
    opacity: 1;
    transform: translateY(0);
  }
}

.social-item:hover {
  transform: scale(1.1);
}

/* Responsive */
@media (max-width: 576px) {
  .social-item {
    width: 60px;
    height: 60px;
  }

  .social-item i {
    font-size: 24px;
  }

  /* مخفی کردن نام روی موبایل */
  .social-item span {
    display: none;
  }
}

.social {
  background-color:  #1b465968;
  border-radius: 10px;
}

.bob {
  border-bottom: 1px solid white;
}


/*** copyright Start ***/
.Copyright {
    background-color: #f1f1f1;
    color: #333;
    font-size: 0.85rem;
    font-family: Arial, sans-serif;
}

.Copyright i {
    margin-right: 4px;
    color: #555;
}

.Copyright span {
    display: inline-block;
    vertical-align: middle;
}

@media (max-width: 576px) {
    .Copyright {
        font-size: 0.8rem;
        padding: 10px 0;
    }

    .Copyright span {
        display: block;
        margin: 2px 0;
    }
}


/*** copyright end ***/