.hero-slider-section{
    position:relative;
    width:100%;
    min-height: 868px;
    overflow:hidden;
    padding: 0;
  }

  .hero-slide{
    position:absolute;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center;
    opacity:0;
    visibility:hidden;
    transition:1s ease;
    display: flex;
    align-items: center;
  }

  .hero-slide.active{
    opacity:1;
    visibility:visible;
  }

  /* DARK OVERLAY */

  .overlay{
    position:absolute;
    width:100%;
    height:100%;
    background:
      linear-gradient(
        90deg,
        rgba(2,17,34,0.95) 20%,
        rgba(2,17,34,0.75) 60%,
        rgba(2,17,34,0.85) 100%
      );
  }

  /* CONTENT */

  .hero-content{
    position:relative;
    z-index:2;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    max-width:760px;
    color:#fff;
  }

  .hero-tag{
    display:inline-block;
    border:1px solid rgba(255,255,255,0.15);
    padding:10px 18px;
    border-radius:40px;
    margin-bottom:30px;
    color:#c7d2de;
    font-size:14px;
    width:max-content;
  }

  .hero-content h1{
    font-size:72px;
    line-height:0.95;
    font-weight:700;
    letter-spacing: 0px;
    margin-bottom:28px;
  }

  .hero-content h1 span{
    background:linear-gradient(90deg,#0066ff,#00dfff);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
  }

  .hero-content p{
    font-size:18px;
    line-height:1.8;
    color:#aab4c0;
    max-width:620px;
    margin-bottom:40px;
  }

  /* BUTTONS */

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

  .primary-btn{
    background:linear-gradient(90deg,#005dff,#00dfff);
    color:#fff;
    padding:12px 20px;
    border-radius:60px;
    text-decoration:none;
    font-weight:700;
    transition:.3s;
    font-size: 14px;
  }

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

  .secondary-btn{
    border:1px solid rgba(255,255,255,0.15);
    color:#fff;
    padding:12px 20px;
    border-radius:60px;
    text-decoration:none;
    font-weight:600;
    transition:.3s;
    font-size: 14px;
  }

  .secondary-btn:hover{
    background:rgba(255,255,255,0.08);
  }

  /* NAVIGATION */

  .slider-navigation{
    position:absolute;
    bottom:70px;
    right:80px;
    z-index:5;
    display:flex;
    gap:16px;
  }

  .slider-btn{
    width:58px;
    height:58px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,0.15);
    background:rgba(255,255,255,0.05);
    color:#fff;
    font-size:22px;
    cursor:pointer;
    transition:.3s;
  }

  .slider-btn:hover{
    background:linear-gradient(90deg,#005dff,#00dfff);
    border-color:transparent;
  }

  /* DOTS */

  .slider-dots{
    position:absolute;
    bottom:90px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    gap:10px;
    z-index:5;
  }

  .dot{
    width:14px;
    height:14px;
    border-radius:50%;
    background:rgba(255,255,255,0.3);
    cursor:pointer;
    transition:.3s;
  }

  .dot.active{
    width:40px;
    border-radius:20px;
    background:#00dfff;
  }
 
  /* RESPONSIVE */

  @media(max-width:1200px){

    .hero-content h1{
      font-size:70px;
    }
  }

  @media(max-width:991px){

    .hero-content h1{
      font-size:56px;
    }

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

  @media(max-width:767px){

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

    .hero-content p{
      font-size:16px;
    }

    .hero-buttons{
      flex-direction:column;
      align-items:flex-start;
    }

    .primary-btn,
    .secondary-btn{
      width:100%;
      text-align:center;
    }

    .slider-navigation{
      right:20px;
      bottom:30px;
    }

    .slider-dots{
      bottom:45px;
    }
    .hero-slider-section
    {
      min-height: 700px;
    }
    .slider-btn
    {
      width: 48px;
      height: 48px;
      font-size: 20px;
    }
   
  }
  .brochure-btn:hover
  {
    animation: shade 1s linear infinite;
  }
  @keyframes shade
  {

  }