*{
      margin:0;
      padding:0;
      box-sizing:border-box;
    }
    :root{
      --dark:#031223;
      --white:#ffffff;
      --text:#6f7b8b;
      --blue:#006dff;
      --cyan:#00d9ff;
      --light:#eef3f7;
      --card:#07192c;
    }

    body{
      font-family:'Inter',sans-serif;
      overflow-x:hidden;
      background:#fff;
      color:#111827;
    }
    .remiveatag {
color: #242830;
    text-decoration: none;
}

    .container{
      max-width:1280px;
    }

    section{
      padding:110px 0;
      position:relative;
    }

    /* =========================
       NAVBAR
    ========================== */

    .custom-navbar {
      /*background: linear-gradient(135deg,#d7d7d7,#bcbcbc);*/
      border-radius: 28px;
      padding: 12px 15px 12px;
      /*border: 1px solid rgba(255,255,255,0.5);*/
      margin-bottom: -150px;
      z-index: 99999;
      position: fixed;
      margin-top: 20px;
      top: 20px;
      width: 100%;
      transition: all .4s ease;
      left: 50%;
      transform: translateX(-50%);
  }

    .top-navbar{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:25px;
      flex-wrap:wrap;
    }

    /* LOGO */
    .brand-area{
      display:flex;
      align-items:center;
      gap:12px;
      min-width:240px;
    }

   

   

    /* SEARCH */
    .search-wrapper{
      flex:1;
      max-width:460px;
      position:relative;
    }

    .search-box{
      width:100%;
      height:40px;
      border-radius:40px;
      border:2px solid rgba(255,255,255,0.7);
      background:#ececec;
      padding:0 70px 0 58px;
      font-size:16px;
      outline:none;
      color:#6b7280;
    }

    .search-icon{
      position:absolute;
      top:50%;
      left:22px;
      transform:translateY(-50%);
      font-size:20px;
      color:#6b7280;
    }

    .shortcut{
      position:absolute;
      top:50%;
      right:18px;
      transform:translateY(-50%);
      background:#f5f5f5;
      border:1px solid #dcdcdc;
      width: 36px;
      height:30px;
      border-radius:10px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:14px;
      color:#6b7280;
      font-weight:600;
    }

    /* RIGHT */
    .right-area{
      display:flex;
      align-items:center;
      gap:22px;
    }

    .social-icons{
      display:flex;
      align-items:center;
      gap:18px;
    }

    .social-icons a{
      color:#000;
      font-size:16px;
      transition:.3s;
    }

    .social-icons a:hover{
      color:#0063ff;
    }

    .custom-navbar.sticky .social-icons a {
    color: #333;
}

.custom-navbar.sticky .social-icons a:hover {
    color: #0d6efd; /* or your brand color */
}


    .custom-btn {
        background: linear-gradient(90deg,#0057b8,#08d4e8);
        color: #fff;
        border: none;
        border-radius: 40px;
        padding: 12px 20px;
        font-weight: 700;
        text-decoration: none;
        transition: .3s;
        font-size: 14px;
        overflow: hidden;
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    a.custom-btn::before {
        position: absolute;
        content: '';
        top: -32px;
        right: -170px;
        width: 110px;
        height: 100px;
        background: linear-gradient(90deg, #ffffff00, #ffffff6b 50%, #ffffff00);
        transform: rotate(21deg);
        opacity: 0;
        pointer-events: none;
    }
    
    .custom-btn:hover{
      color:#fff;
      transform:translateY(-2px);
    }
    .custom-btn:hover::before
    {
      opacity: 1;
      animation: mover 1.5s linear infinite;
    }
    @keyframes mover
    {
      0%
      {
        right: -170px;
      }
      100%
      {
        right:120px;
      }
    }
    /* BOTTOM NAV */
    .menu-area{
      margin-top:18px;
    }

    .menu-list{
      display:flex;
      justify-content:center;
      align-items:center;
      gap:48px;
      list-style:none;
      padding:0;
      margin:0;
      flex-wrap:wrap;
    }

    .menu-list a{
      text-decoration:none;
      color:#000;
      font-size:14px;
      font-weight:600;
      transition:.3s;
    }

    .menu-list a:hover{
      color:#005dff;
    }
   

    /* =========================
       HERO
    ========================== */

    .hero-section{
      background:var(--dark);
      color:#fff;
      min-height:100vh;
      display:flex;
      align-items:center;
      overflow:hidden;
    }

    .hero-section::before{
      content:'';
      position:absolute;
      width:500px;
      height:500px;
      background:rgba(0,223,255,0.08);
      filter:blur(120px);
      right:-150px;
      top:-100px;
      border-radius:50%;
    }

    .hero-badge{
      display:inline-flex;
      align-items:center;
      gap:10px;
      border:1px solid rgba(255,255,255,0.1);
      border-radius:50px;
      padding:8px 16px;
      color:#cfd8e3;
      font-size:12px;
      margin-bottom:30px;
    }

    .hero-badge span{
      width:7px;
      height:7px;
      background:#00dfff;
      border-radius:50%;
    }

    .hero-title{
      font-size:72px;
      line-height:0.95;
      font-weight:800;
      letter-spacing:-3px;
      max-width:700px;
      margin-bottom:28px;
    }

    .gradient-text{
      background:linear-gradient(90deg,#005dff,#00dfff);
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }

    .hero-desc{
      max-width:680px;
      color:#95a2b3;
      font-size:20px;
      line-height:1.8;
      margin-bottom:40px;
    }

    .hero-buttons{
      display:flex;
      gap:18px;
      flex-wrap:wrap;
    }

    .btn-primary-custom{
      background:linear-gradient(90deg,#005dff,#00dfff);
      color:#fff;
      padding:18px 34px;
      border-radius:50px;
      font-weight:700;
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:10px;
    }

    .btn-secondary-custom{
      border:1px solid rgba(255,255,255,0.1);
      color:#fff;
      padding:18px 34px;
      border-radius:50px;
      font-weight:600;
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:10px;
    }

    /* STATS */

    .stats-grid{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:22px;
    }

    .stats-card{
      background:rgba(255,255,255,0.02);
      border:0 18px 40px rgba(17,42,84,.12);
      border-radius:26px;
      padding:34px;
    }

    .stats-icon{
      color:#00dfff;
      font-size:24px;
      margin-bottom:26px;
    }

    .stats-number{
      font-size:52px;
      font-weight:800;
      line-height:1;
      margin-bottom:10px;
    }

    .stats-text{
      color:#9aa6b6;
    }

    /* =========================
       LIGHT SECTION
    ========================== */

    .light-section{
      background:var(--light);
    }

    .section-tag{
      color:#008cff;
      font-weight:700;
      font-size:13px;
      text-transform:uppercase;
      letter-spacing:2px;
      margin-bottom:18px;
    }

    .section-title{
      font-size:48px;
      line-height:1.1;
      font-weight:800;
      margin-bottom:28px;
      color:#111827;
    }

    .section-desc{
      color:#6f7b8b;
      line-height:1.8;
      font-size:18px;
    }

    /* IMAGE CARD */

    .image-wrapper{
      position:relative;
    }

    .image-wrapper img{
      width:100%;
      border-radius:30px;
      object-fit:cover;
    }

  .floating-box {
    position: absolute;
    background: #ffffff5e;
    border-radius: 18px;
    padding: 18px 20px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.08);
    font-weight: 800;
    color: #111827;
    backdrop-filter: blur(6px);
    animation: 7s ease-in-out infinite float;
}
@keyframes float
{
  0%, 100% {
    transform: translateY(0)translate(0);
  }
  50%
  {
    transform: translateY(-22px) translate(8px);
  }
}
.modal-dialog {
    max-width: 90%;
    margin: 1.75rem auto;
}
.modal
{
  z-index: 99999;
}
video
{
  width: 100%;
}
    .box-top{
      top:20px;
      left:-20px;
    }

    .box-bottom{
      bottom:20px;
      right:-20px;
    }

    /* FEATURE CARDS */

    .feature-card {
    background: #fff;
    border-radius: 24px;
    padding: 34px;
    transition: .3s;
    height: 100%;
    box-shadow: 0 10px 20px rgb(0 0 0 / 11%);
}

    .feature-card:hover{
      transform:translateY(-5px);
      border-color:#00dfff;
    }

    .feature-icon {
    width: 58px;
    height: 58px;
    border-radius: 17px;
    background: #eaeff7;
    color: #003f93;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    font-size: 22px;
}

    .feature-card h4{
      font-size:18px;
      font-weight:700;
      margin-bottom:14px;
    }

    .feature-card p{
      color:#6f7b8b;
      margin:0;
      line-height:1.7;
    }

    /* DARK CTA */

    .dark-cta{
      background:var(--dark);
      color:#fff;
      text-align:center;
      overflow:hidden;
    }
    /* FOR HOME EDIT ADMIN */
    .dark-cta1{
      background:var(--dark);
      color:#fff;
      text-align:center;
      overflow:hidden;
    }
     .dark-cta1 .section-title{
      color:#fff;
      max-width:900px;
      margin:auto auto 30px;
    }
    /* FOR HOME EDIT ADMIN */

    .dark-cta::before{
      content:'';
      position:absolute;
      width:500px;
      height:500px;
      background:rgba(0,223,255,0.08);
      filter:blur(140px);
      left:50%;
      top:50%;
      transform:translate(-50%,-50%);
      border-radius:50%;
    }

    .dark-cta .section-title{
      color:#fff;
      max-width:900px;
      margin:auto auto 30px;
    }

    /* TESTIMONIAL */

    .testimonial-box{
      background:#fff;
      padding:50px;
      border-radius:30px;
      max-width:900px;
      margin:auto;
      text-align:center;
      box-shadow:0 20px 50px rgba(0,0,0,0.05);
    }

    .testimonial-box p{
      font-size:22px;
      line-height:1.8;
      color:#282e36;
      margin-bottom:30px;
    }

    /* FORM */

    .form-wrapper{
      background:linear-gradient(135deg, #003e9e 69%, #0889a4);
      border-radius:30px;
      padding:70px;
      color:#fff;
    }

    .custom-input{
      width:100%;
      height:58px;
      border:none;
      border-radius:14px;
      padding:0 18px;
      margin-bottom:18px;
      outline:none;
    }

    textarea.custom-input{
      height:140px;
      padding-top:16px;
      resize:none;
    }

    /* FOOTER */

    footer{
      position:relative;
      overflow:hidden;
      background:
        radial-gradient(circle at 12% 15%, rgba(0, 207, 255, 0.22), transparent 28%),
        radial-gradient(circle at 88% 8%, rgba(0, 93, 255, 0.22), transparent 30%),
        linear-gradient(135deg, #06111f 0%, #08223a 48%, #031223 100%);
      color:#fff;
      padding:90px 0 34px;
    }

    footer::before{
      content:'';
      position:absolute;
      inset:24px;
      border:1px solid rgba(255,255,255,0.08);
      border-radius:34px;
      pointer-events:none;
    }

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

    .brand-logo{
      display:inline-flex;
      align-items:center;
      gap:14px;
      padding:10px 16px 10px 10px;
      border-radius:999px;
      background:rgba(255,255,255,0.08);
      border:1px solid rgba(255,255,255,0.12);
      margin-bottom:24px;
    }

    .brand-icon{
      width:46px;
      height:46px;
      border-radius:50%;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:linear-gradient(135deg,#005dff,#00dfff);
      color:#fff;
      font-size:22px;
      box-shadow:0 14px 28px rgba(0, 207, 255, 0.18);
    }

    .brand-logo h4{
      margin:0;
      font-size:22px;
      font-weight:800;
      color:#fff;
    }

    .brand-logo h4 span{
      color:#00cfff;
    }

    footer p{
      max-width:330px;
      line-height:1.8;
    }

    .footer-title{
      display:inline-flex;
      align-items:center;
      gap:9px;
      font-size:15px;
      font-weight:800;
      letter-spacing:1px;
      text-transform:uppercase;
      margin-bottom:24px;
      color:#ffffff;
    }

    .footer-title::before{
      content:'';
      width:10px;
      height:10px;
      border-radius:50%;
      background:#00cfff;
      box-shadow:0 0 0 6px rgba(0, 207, 255, 0.12);
    }

    .footer-links{
      list-style:none;
      padding:0;
      margin:0;
      display:grid;
      gap:10px;
    }

    .footer-links li{
      margin-bottom:0;
    }

    .footer-links a{
      display:inline-flex;
      align-items:center;
      color:#c8d4e3;
      text-decoration:none;
      padding:6px 0;
      transition:.3s ease;
    }

    .footer-links a:hover{
      color:#fff;
      transform:translateX(6px);
    }

    .copyright{
      border-top:1px solid rgba(255,255,255,0.10);
      margin-top:58px;
      padding-top:26px;
      color:#b6c5d8;
      text-align:center;
      font-size:14px;
    }
    .paddy-100
    {
      padding: 100px 0;
    }
    /* RESPONSIVE */
    .grid-box 
    {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 15px;
    }
.counter-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #eef5f8;
    border: 1px solid #d7dfe5;
    border-radius: 20px;
    padding: 15px;
    text-align: justify;
}

.counter {
    font-size: 30px;
    font-weight: 700;
}
section.why-choose-section {
    background: #fafcfe;
}
.text-sky
{
  color: #00d1db;
}
.form-wrapper ul {
    padding: 0;
    list-style: none;
}
.form-wrapper ul li {
    margin-bottom: 10px;
    display: flex;
    gap: 15px;
}
.form-wrapper ul li span {
    padding: 10px;
    border-radius: 50px;
    width: 38px;
    height: 38px;
    line-height: 16px;
    background: #0412238c;
    border: 1px solid #4d87b3;
    text-align: center;
}
.form-wrapper form {
    background: #ffffffb3;
    padding: 40px;
    border-radius: 40px;
    border: 1px solid #fff;
}
span.quotes .bi {
    font-size: 44px;
    color: #00d6ff;
}
span.rating {
    margin-bottom: 18px;
    display: block;
    color: #00d6ff;
}
#carouselExampleCaptions .carousel-indicators
{
  bottom: -50px;
}
.carousel-indicators button {
    background-color: #bcc2c7 !important;
  }
  .carousel-indicators [data-bs-target]
  {
    border-top: 0px solid transparent;
    border-bottom: 0px solid transparent;
}
.carousel-indicators .active {
    opacity: 1;
    background: linear-gradient(45deg, #005eff, #00d9ff);
}


/* qc section*/
.qa-section{
      padding:90px 0 80px;
      position:relative;
      min-height:100vh;
    }

    .section-kicker{
      font-size:13px;
      font-weight:800;
      letter-spacing:4px;
      color:var(--blue);
      text-transform:uppercase;
      margin-bottom:18px;
    }

   


    .timeline{
      position:relative;
      padding-left:22px;
      margin-top:10px;
    }

    .timeline::before{
      content:'';
      position:absolute;
      left:18px;
      top:8px;
      bottom:8px;
      width:2px;
      border-left:2px dashed var(--line);
    }

    .step{
      position:relative;
      padding-left:50px;
      margin-bottom:28px;
    }

    .step:last-child{
      margin-bottom:0;
    }

    .step-icon{
      position:absolute;
      left:-6px;
      top:0;
      width:40px;
      height:40px;
      border-radius:50%;
      background:linear-gradient(135deg,var(--blue),var(--cyan));
      color:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
      box-shadow:0 8px 20px rgba(10,78,161,.18);
      z-index:2;
      font-size:18px;
    }

    .step-label{
      font-size:11px;
      font-weight:800;
      letter-spacing:3px;
      color:#8a97a8;
      text-transform:uppercase;
      margin-bottom:8px;
    }

  .step-title {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
    margin-bottom: 8px;
    color: #0b1b2f;
}
    .step-text{
      font-size:17px;
      line-height:1.7;
      color:var(--muted);
      max-width:520px;
      margin:0;
    }

    .media-wrap{
      position:relative;
      display:flex;
      justify-content:center;
      align-items:center;
      padding-top:30px;
    }

    .media-box{
      position:relative;
      width:min(100%, 720px);
      border-radius:34px;
      overflow:hidden;
      box-shadow:0 30px 70px rgba(10,40,90,.12);
    }

    .media-box img{
      width:100%;
      height:560px;
      object-fit:cover;
      display:block;
    }

    .stats-card {
      width: 260px;
      border-radius: 22px;
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      box-shadow: 0 18px 40px rgba(17,42,84,.12);
      padding: 18px 20px 16px;
      border: 1px solid rgba(255,255,255,.7);
      background: #020e1c;
  }

    .stats-label{
      font-size:11px;
      font-weight:800;
      letter-spacing:2px;
      color:#9aa6b8;
      text-transform:uppercase;
      margin-bottom:10px;
    }

    .stats-number{
      font-size:34px;
      line-height:1;
      font-weight:900;
      color:#fff;
      margin-bottom:8px;
    }
    .stats-number span {
    background: linear-gradient(90deg, #005dff, #00dfff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
    .stats-growth{
      font-size:14px;
      font-weight:700;
      color:#4a77c6;
    }

    .badge-row{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-top:34px;
      padding-left:6px;
    }

  .quality-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 5px 15px;
    border-radius: 50px;
    background: #fff;
    color: #0b1b2f;
    font-weight: 700;
    font-size: 13px;
    box-shadow: 0 10px 22px rgba(15,30,60,.06);
    border: 1px solid rgba(10,78,161,.06);
}

    .quality-badge i{
      color:#28c0de;
      font-size:18px;
    }

    .whatsapp-float{
      position:fixed;
      right:26px;
      bottom:26px;
      width:58px;
      height:58px;
      border-radius:50%;
      background:#25d366;
      color:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
      box-shadow:0 16px 30px rgba(37,211,102,.32);
      z-index:999;
      text-decoration:none;
      font-size:26px;
    }

    .whatsapp-float:hover{
      color:#fff;
      transform:translateY(-2px);
    }
.portfolio {
    background: linear-gradient(rgb(255 255 255 / 93%), rgb(255 255 255 / 93%)), url(../images/bg.svg);
}

.category-card{
      width:320px;
      height:230px;
      background:#fff;
      border:1.5px solid #00a6e7;
      border-radius:28px;
      padding:28px;
      position:relative;
      overflow:hidden;
      transition:0.4s ease;
    }

    .category-card:hover{
      transform:translateY(-8px);
      box-shadow:0 15px 40px rgba(0,0,0,0.08);
    }

    /* Icon */
    .card-icon{
      width:48px;
      height:48px;
      border-radius:50%;
      background:linear-gradient(135deg,#0057c2,#00c6e8);
      display:flex;
      align-items:center;
      justify-content:center;
      color:#fff;
      font-size:22px;
    }

    /* Title */
    .category-card h3{
      font-size:22px;
      font-weight:700;
      color:#081b33;
      margin-top:28px;
    }

    /* Subtitle */
    .category-card p{
      font-size:16px;
      color:#6e7a89;
      margin-top:10px;
    }

    /* Bottom */
    .card-bottom{
      position:absolute;
      left:28px;
      right:28px;
      bottom:28px;
      display:flex;
      justify-content:space-between;
      align-items:center;
    }

    .card-bottom span{
      font-size:12px;
      letter-spacing:3px;
      color:#7a8695;
      font-weight:600;
    }

    /* Arrow Button */
    .arrow-btn{
      width:40px;
      height:40px;
      border-radius:50%;
      background:#f1f5f7;
      display:flex;
      align-items:center;
      justify-content:center;
      text-decoration:none;
      color:#081b33;
      font-size:20px;
      transition:0.3s;
    }
    .cate
    {
      grid-template-columns: 1fr 1fr;
      align-items: end;
    }
    .cate .section-title
    {
      margin-bottom: 0 !important;
    }
    .category-card:hover .arrow-btn{
      background:linear-gradient(135deg,#0057c2,#00c6e8);
      color:#fff;
      transform:rotate(45deg);
    }
    .rights .nav button {
        background: #fff;
        border-radius: 50px;
        box-shadow: 0 6px 17px rgba(0,0,0,0.1);
        margin: 0 10px;
        color: #000;
        border: none;
    }
    .rights .nav-tabs
    {
      border: none;
      justify-content: end;
    }
    .rights .nav button.active {
        background: linear-gradient(45deg, #0069c8, #00deff);
        color: #fff;
        border: none;
    }
    .category-card::before {
        content: '';
        position: absolute;
        top: -38px;
        background: radial-gradient(circle, oklch(0.78 0.14 200 / 0.45), transparent 70%);
        width: 170px;
        height: 160px;
        border-radius: 50px;
        right: -38px;
        transition: .4s;
        display: none;
    }
    .category-card:hover::before
    {
      display: block;
      transition: .4s;
    }
    .categorygrid-box
    {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      gap: 20px;
    }
    .clientwrap .media-wrap {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        gap: 20px;
    }
    .clientwrap .media-wrap img
    {
      width: 100%;
    }
    .clientwrap .media-wrap .media-box
    {
      padding: 20px;
    }
    .clientwrap .media-wrap img {
      width: 100%;
      height: auto;
    }
    .product-card img
    {
      transition: .6s;
    }
    .product-card:hover img {
      transform: scale(1.1);
    }
    .product-media
    {
      overflow: hidden;
    }
    @media (max-width: 1199px){
      .section-title{
        font-size:52px;
      }

      .media-box img{
        height:500px;
      }
    }

    @media (max-width: 991px){
      .qa-section{
        padding:70px 0 70px;
      }

      .section-title{
        max-width:none;
        font-size:44px;
      }

      .media-wrap{
        margin-top:40px;
      }

      .media-box{
        width:100%;
      }

      .media-box img{
        height:460px;
      }

      .stats-card{
        left:16px;
        bottom:16px;
      }
    }

    @media (max-width: 767px){
      .section-title{
        font-size:36px;
        letter-spacing:-1.5px;
      }

      .step{
        padding-left:34px;
        margin-bottom:22px;
      }

      .step-title{
        font-size:20px;
      }

      .step-text{
        font-size:15px;
        line-height:1.65;
      }

      .media-box img{
        height:340px;
      }

      .stats-card{
        width:220px;
        padding:16px;
      }

      .stats-number{
        font-size:28px;
      }

      .quality-badge{
        font-size:14px;
        padding:11px 15px;
      }
    }

/*/        /*/


.promo-section{
    padding:90px 0 110px;
    background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
    overflow:hidden;
  }
  .slider-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
  }
  .section-kicker{
    font-size:13px;
    font-weight:800;
    letter-spacing:4px;
    text-transform:uppercase;
    color:#0a5aa8;
    margin-bottom:16px;
  }
  .section-title{
    max-width:720px;
    margin-left: auto;
    margin-right: auto;
  }
  .section-title .blue{color:#0a5aa8}
  .section-title .cyan{color:#09c8e8}
  .brochure-btn{
    background:linear-gradient(90deg,#0a5aa8,#09c8e8);
    color:#fff;
    border:none;
    border-radius:999px;
    padding:14px 24px;
    font-weight:700;
    display:inline-flex;
    align-items:center;
    gap:10px;
    box-shadow:0 18px 40px rgba(9,200,232,0.18);
    white-space:nowrap;
    text-decoration:none;
    transition:.25s ease;
  }
  .brochure-btn:hover{transform:translateY(-2px);color:#fff}

  .marquee-wrap{
    margin-top:52px;
    overflow:hidden;
    position:relative;
    padding:6px 0 10px;
    mask-image:linear-gradient(to right, transparent 0, black 7%, black 93%, transparent 100%);
    -webkit-mask-image:linear-gradient(to right, transparent 0, black 7%, black 93%, transparent 100%);
  }
  .marquee-track{
    display:flex;
    gap:18px;
    width:max-content;
    animation:scroll-left 35s linear infinite;
    will-change:transform;
  }
  .marquee-wrap:hover .marquee-track{
    animation-play-state:paused;
  }

  .product-card{
    flex:0 0 320px;
    border:1.5px solid #7dc8f1;
    border-radius:28px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 8px 24px rgba(15,23,42,0.03);
  }
  .product-media{
    height:240px;
    background:#f1f4f8;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .product-media img{
    width:100%;
    height:100%;
    object-fit:cover;
  }
  .product-body{
    padding:18px 18px 16px;
    background:#f6fbff;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    min-height:102px;
  }
  .product-name{
    font-size:18px;
    font-weight:800;
    margin-bottom:6px;
    color:#1f2937;
    line-height:1.2;
  }
  .product-desc{
    font-size:14px;
    color:#7a8699;
    line-height:1.4;
    margin:0;
  }
  .product-arrow{
    color:#1f5fb8;
    font-size:22px;
    line-height:1;
    margin-top:28px;
    flex:0 0 auto;
  }

  @keyframes scroll-left{
    from{transform:translateX(0)}
    to{transform:translateX(calc(-50% - 9px))}
  }

  @media (max-width:991px){
    .section-title{font-size:44px}
    .product-card{flex-basis:300px}
    .product-media{height:220px}
    .marquee-track{animation-duration:28s}
  }
  @media (max-width:767px){
    .promo-section{padding:70px 0 90px}
    .section-title{font-size:34px}
    .product-card{flex-basis:280px}
    .product-media{height:200px}
    .marquee-track{animation-duration:22s}
  }

/* =========================
      MEGA MENU
  ========================== */

 .mega-menu {
    background: #fff;
    border-radius: 32px;
    padding: 35px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.08);
    position: absolute;
    z-index: 999999;
    width: 100%;
    left: 0;
    display: none;
}

  /* LEFT TABS */

  .branch-title{
    font-size: 24px;
    font-weight:700;
    color:#0f172a;
    margin-bottom:24px;
  }

  .branch-line{
    width:70px;
    height:5px;
    background:#0069ff;
    border-radius:20px;
    margin-bottom:40px;
  }

  .vertical-tabs{
    border-right:1px solid #e5e7eb;
    padding-right:35px;
    height: 100%;
  }

  .branch-tab{
    width:100%;
    border:none;
    background:transparent;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:8px 0;
    border-bottom:1px solid #ececec;
    transition:.3s;
    text-align:left;
  }

  .branch-tab.active{
    color:#0069ff;
  }
  .branch-tab1{
    width:100%;
    border:none;
    background:transparent;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:8px 0;
    border-bottom:1px solid #ececec;
    transition:.3s;
    text-align:left;
  }

  .branch-tab1.active{
    color:#0069ff;
  }

  .branch-left{
    display:flex;
    align-items:center;
    gap:15px;
  }

 .branch-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #6c6c6c;
}

  .branch-name{
    font-size: 15px;
    font-weight: 600;
    color:#111827;
  }

  .branch-arrow{
    font-size:14px;
    color:#9ca3af;
  }
.branch-tab.active .branch-icon, .branch-tab.active .branch-name, .branch-tab.active .branch-arrow {
    color: #0069ff;
}
.branch-tab1.active .branch-icon, .branch-tab1.active .branch-name, .branch-tab1.active .branch-arrow {
    color: #0069ff;
}
  /* RIGHT CONTENT */
.tab-pane.active
{
  animation: fadeInUp 0.8s ease forwards;
}
.tab-pane1.active
{
  animation: fadeInUp 0.8s ease forwards;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 40px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
  .content-title{
    font-size: 24px;
    font-weight: 700;
    color:#0f172a;
    margin-bottom:12px;
  }

  .content-subtitle{
    font-size:16px;
    color:#6b7280;
    margin-bottom:45px;
  }

  /* PRODUCT ITEMS */

  .product-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
  }

  .product-item{
    display:flex;
    align-items:center;
    gap: 10px;
  }

.product-icon {
    width: 30px;
    height: 30px;
    border-radius: 5px;
    background: #f4f7f3;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0069ff;
    font-size: 16px;
    flex-shrink: 0;
}

 .product-item h4 {
    font-size: 14px;
    font-weight: 600;
    color: #111827;
}

.product-item p {
    font-size: 14px;
    line-height: 1.3;
    color: #6b7280;
    margin: 0;
}

  /* FEATURE CARD */

  .featured-card{
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    border:1px solid #e5e7eb;
    box-shadow:
      0 10px 30px rgba(0,0,0,0.05);
  }

  .featured-image{
    position:relative;
  }

  .featured-image img{
    width:100%;
    height: 280px;
    object-fit:cover;
  }

 .featured-badge {
    position: absolute;
    top: 22px;
    left: 22px;
    background: #0069ff;
    color: #fff;
    padding: 8px 14px;
    border-radius: 40px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

  .featured-content{
    padding: 20px;
  }

  .featured-content h3{
    font-size: 22px;
    line-height:1.2;
    font-weight: 700;
    margin-bottom: 15px;
    color:#111827;
  }

 .featured-content p {
    font-size: 16px;
    line-height: 1.5;
    color: #6b7280;
    margin-bottom: 20px;
}

  .featured-link{
    display:inline-flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
    font-size:30px;
    font-weight:700;
    color:#0069ff;
  }

  /* TAB CONTENT */

  .tab-pane{
    display:none;
  }

  .tab-pane.active{
    display:block;
  }
    .tab-pane1{
    display:none;
  }

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

  /* RESPONSIVE */
.media-wrap .stats-card {
    width: 260px;
    backdrop-filter: blur(14px);
    box-shadow: rgba(17, 42, 84, 0.12) 0px 18px 40px;
    border-radius: 22px;
    padding: 18px 20px 16px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.7);
    border-image: initial;
    background: #ffffff91;
    position: absolute;
    bottom: 15px;
    right: 15px;
}
.media-wrap .stats-card .stats-number
{
  color: #292929;
}
.media-wrap .stats-card .stats-label {
    color: #40454e;
}

/* =========================
   STICKY NAVBAR
========================= */

.custom-navbar{
  position:fixed;
  top:20px;
  width:100%;
  z-index:9999;
  transition:all .4s ease;
}

/* STICKY ACTIVE */

.custom-navbar.sticky{

  top:0;
  background:#ffffff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
  padding:12px 0;
  border-radius: 28px;
  padding: 12px 15px 12px;
}
.custom-navbar.sticky .menu-list a
{
  color: #273142;
}
.mobile-only {
  display: none;
}
.mobile-only label {
  width: 17px;
  height: 2px;
  background-color: #000;
  position: absolute;
  cursor: pointer;
  right: 32px;

  &::before,
  &::after {
    content: "";
    width: 17px;
    height: 2px;
    background-color: #000;
    position: absolute;
    display: block;
    color: red;
    transition: all 0.6s var(--animation-curve);
  }

  &::before {
    top: -250%;
    left: 0%;
    transform: rotateZ(0deg);
    transform-origin: left top;
  }

  &::after {
    bottom: -250%;
    left: 0%;
    transform: rotateZ(0deg);
    transform-origin: left bottom;
  }
}

#toggle:checked ~ label::before {
  content: "";
  background-color: red;
  transform: rotateZ(41deg);
  left: 10%;
}

#toggle:checked ~ label::after {
  content: "";
  background-color: red;
  transform: rotateZ(-41deg);
  left: 10%;
}

#toggle:checked ~ label {
  background-color: #ffffff;
}

#toggle ~ label {
  transition: all 0.5s var(--animation-curve);
}

.mobile-only input {
  display: none;
}
.mar-right
{
  margin-right: 15px;
}
.mobileacc .accordion-item
{
  border: none;
}
.accordion-button:focus {
    z-index: 3;
    border-color: transparent;
    outline: 0;
    box-shadow: none;
}
.accordion-button:not(.collapsed)
{
  background: transparent;
}
button.accordion-button .bi {
    font-size: 20px;
}
.mobileacc
{
  display: none;
  overflow:auto;
  height: calc(100% - 150px);
  overflow-x:hidden;
}
.image-wrapper .playicon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 40px;
    background: #ffffffb3;
    border-radius: 50px;
    width: 75px;
    height: 75px;
    line-height: 75px;
    text-align: center;
    transition: .4s;
}
.image-wrapper .playicon .bi {
    padding-left: 5px;
    color: #0065ff;
}
.image-wrapper .playicon:hover
{
  transform: scale(1.1) translate(-50%, -50%);
}
.box {
    display: flex;
    background: #fff;
    border-radius: 15px;
    padding: 15px;
    box-shadow: 0 10px 20px rgb(0 0 0 / 11%);
    column-gap: 15px;
    align-items: center;
    position: relative;
    z-index: 0;
    overflow: hidden;
}
.box .icbox {
    background: linear-gradient(45deg, #0060ff, #09deff);
    border-radius: 50px;
    width: 66px;
    height: 50px;
    text-align: center;
    line-height: 50px;
}
.box .icbox i {
    color: #fff;
}
.box h3 {
    font-size: 20px;
    margin-bottom: 0;
}
.box p {
    font-size: 12px;
    margin-bottom: 0;
}
.setcard
{
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 20px;
}
.boxtext {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: anchor-center;
}
.boxtext a{
       align-content: center;
}
.box::before {
    content: '';
    position: absolute;
    top: 34px;
    left: 34px;
    background: linear-gradient(45deg, #005fff, #00ddff);
    width: 10px;
    height: 10px;
    z-index: -1;
    transform: scale(1);
    transition: .6s;
    border-radius: 50px;
}
.box:hover::before
{
  transform: scale(60);
}
.box:hover h3, .box:hover p, .box:hover a 
{
  color: #fff;
}
.bgsvg
{
  background: linear-gradient(rgb(255 255 255 / 95%), rgb(255 255 255 / 90%)), url(../images/bg.svg);
}
@media(max-width:991px){

    .mega-menu{
      padding:30px;
    }

    .vertical-tabs{
      border-right:none;
      padding-right:0;
      margin-bottom:40px;
    }

    .content-wrapper{
      padding-left:0;
    }

    .product-grid{
      grid-template-columns:1fr;
    }

    .featured-card{
      margin-top:40px;
    }
  }

  @media(max-width:767px){

    .branch-title{
      font-size:28px;
    }

    .content-title{
      font-size:18px;
    }

    .content-subtitle{
      font-size:16px;
    }

    .branch-name{
      font-size:22px;
    }

    .product-item h4{
      font-size:16px;
    }

    .product-item p{
      font-size:16px;
    }

    .featured-content h3{
      font-size:30px;
    }

    .featured-content p{
      font-size:17px;
    }

    .featured-link{
      font-size:20px;
    }

    .featured-image img{
      height:300px;
    }
    .vertical-tabs
    {
      display: none;
    }
    .mega-menu {
      padding: 15px;
    }
    .mega-menu .col-lg-9
    {
      margin-top: 0 !important;
    }
  
    .mega-menu {
        overflow-y: scroll;
        height: 100vh;
    }
  }




    @media(max-width:1200px){

      .hero-title{
        font-size:66px;
      }

      .section-title{
        font-size:46px;
      }
    }

    @media(max-width:991px){
        .social-icons {
        display:none;
        }
     

      .hero-title{
        font-size:54px;
      }

      .stats-grid{
        margin-top:60px;
      }

      .section-title{
        font-size:40px;
      }
    
      .menu-list{
        gap:24px;
      }
    }

    @media(max-width:767px){

      section{
        padding:80px 0;
      }

      .hero-title{
        font-size:42px;
        letter-spacing:-2px;
      }

      .hero-desc{
        font-size:17px;
      }

      .stats-grid{
        grid-template-columns:1fr;
      }

      .section-title{
        font-size:34px;
      }

      .form-wrapper{
        padding:40px 24px;
      }
      .search-wrapper {
          display: none;
      }
      .menu-area.active {
        display: block !important;
        position: absolute;
        background: #fff;
        width: 100%;
        left: 0;
        top: 49px;
      }
      .custom-navbar.sticky
      {
        border-radius: 0;
      }
      .hero-content {
        padding: 0 10px;
      }
      .mobileacc
      {
        display: block;
      }
    }

    @media(max-width:576px){

       .mobile-only
        {
            display: block;
        }
      .menu-list a{
      color:#000;
    }
      .custom-navbar{
        padding:20px;
      }

      .menu-list{
        flex-direction:column;
        gap:14px;
      }

      .custom-btn{
        width:100%;
      }

      .right-area{
        flex-direction:column;
        align-items:stretch;
      }
      .custom-navbar
      {
        top: 0;
        margin-top: 0;
        border-radius: 0;
        background: #fff;
      }
      .custom-navbar.sticky
      {
        border-radius: 0;
      }
      .right-area {
        display: none;
      }
      .menu-area
      {
        display: none;
      }
      .custom-navbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px;
      }
      .menu-area.active {
          display: block !important;
      }
    }


.megaproduct:hover .mega-menu
{
  display: block !important;
}