/* ---------- Brand palette (from your logo) ---------- */
    #servicesSlider{
      --gold-50:#fdf7ea;
      --gold-100:#fae9c2;
      --gold-200:#f6d895;
      --gold-300:#f0c25a;
      --gold-400:#eab031;
      --gold-500:#d4af37;  /* main */
      --gold-600:#b9932b;
      --gold-700:#957422;
      --gold-800:#6f561a;
      --gold-900:#4a3a12;

      --ink:#e5e7eb;       /* light gray text for subtle UI */
      --bg-deep:#0f0f0f;
      --card:#1b1b1b;
      --card-border:rgba(255,255,255,.08);
    }

    /* heading + underline */
    #servicesSlider .head-underline{
      width:72px;height:3px;margin:.8rem auto 0;border-radius:9999px;
      background: linear-gradient(90deg,var(--gold-600),var(--gold-400),var(--gold-600));
      box-shadow:0 0 18px 0 rgba(212,175,55,.25);
    }
  #hero #slides .slide::after{
    content:""; position:absolute; inset:0;
    background: rgba(0,0,0,.12);
  }
    /* gutters */
    #servicesSlider .slick-list{ margin: 0 -14px; }
    #servicesSlider .slick-slide{ padding: 0 14px; }

    /* card */
    #servicesSlider .card{
      background:var(--card);border:1px solid var(--card-border);border-radius:1rem;overflow:hidden;
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
      position:relative;
    }
    /* thin top gradient bar for brand touch */
    #servicesSlider .card::before{
      content:""; position:absolute; inset:0 0 auto 0; height:3px;
      background:linear-gradient(90deg,var(--gold-700),var(--gold-400),var(--gold-700));
      opacity:.85;
    }
    #servicesSlider .card:hover{
      transform: translateY(-3px);
      border-color: color-mix(in oklab, var(--gold-500) 35%, #ffffff 0%);
      box-shadow:0 22px 50px -22px rgba(0,0,0,.65);
    }

    /* image */
    #servicesSlider .thumb{ position:relative; aspect-ratio: 16/9; }
    #servicesSlider .thumb > img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(12%); }
    #servicesSlider .thumb::after{
      content:""; position:absolute; inset:0;
      background:linear-gradient(to top, rgba(0,0,0,.42), rgba(0,0,0,0));
    }

    /* body */
    #servicesSlider .body{ padding:1.1rem 1.1rem 1.25rem; }
    #servicesSlider .eyebrow{
      letter-spacing:.08em; text-transform:uppercase; font-weight:900; font-size:.9rem;
      background: linear-gradient(90deg,var(--gold-500),var(--gold-300));
      -webkit-background-clip:text; background-clip:text; color:transparent;
    }
    #servicesSlider .sub{ color:#cbd5e1; font-size:.86rem; margin-top:.18rem; }
    #servicesSlider .desc{ color:#d1d5db; font-size:.92rem; margin-top:.75rem; line-height:1.55; }
    #servicesSlider .link{
      display:inline-flex; gap:.45rem; align-items:center; margin-top:1rem; font-weight:800; font-size:.84rem;
      color:var(--gold-300);
    }
    #servicesSlider .link:hover{ color:var(--gold-200); text-decoration:underline; text-underline-offset:3px; }

    /* arrows — dark pill with gold stroke icons */
    #servicesSlider .slick-arrow{
      position:absolute; top:50%; transform:translateY(-50%);
      width:46px;height:46px;border-radius:9999px;
      background:rgba(17,24,39,.9); border:1px solid rgba(212,175,55,.45);
      backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
      box-shadow:0 12px 28px -14px rgba(0,0,0,.55);
      z-index:5; display:grid; place-items:center;
      transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
    }
    #servicesSlider .slick-prev{ left:-6px; } 
    #servicesSlider .slick-next{ right:-6px; }
    #servicesSlider .slick-prev:before, #servicesSlider .slick-next:before{ display:none; }
    #servicesSlider .slick-arrow:hover{
      transform:translateY(-50%) scale(1.06);
      background:rgba(17,24,39,.96); border-color: var(--gold-500);
      box-shadow:0 18px 40px -16px rgba(0,0,0,.6);
    }
    #servicesSlider .slick-arrow svg path{ stroke: var(--gold-400); }
    #servicesSlider .slick-arrow:hover svg path{ stroke: var(--gold-200); }

    /* dots */
    #servicesSlider .slick-dots{ bottom:-36px; }
    #servicesSlider .slick-dots li button:before{ color:#9ca3af; opacity:.55; }
    #servicesSlider .slick-dots li.slick-active button:before{
      color: var(--gold-400); opacity:1; text-shadow:0 0 10px rgba(212,175,55,.45);
    }

    @media (max-width:640px){ #servicesSlider h2{ text-align:center; } }

  
  
  /* hide scrollbar for fleet track */
  .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
  .no-scrollbar::-webkit-scrollbar { display: none; }

  header.fixed.top-0.left-0.right-0.z-40.transition-all.duration-300.bg-white\/90.backdrop-blur.shadow-soft .h-main-content
 {
    max-width:100% !important ;
    background-color: #F5AD3D;
    color: white !important;

}

  header.fixed.top-0.left-0.right-0.z-40.transition-all.duration-300.bg-white\/90.backdrop-blur.shadow-soft .mt0
 {
margin-top: 0px !important ;
border-radius: 0px !important;
}
.mt0{
    margin-top: 28px  ;
}
    /* brand golds */
    #faq{ --gold-400:#eab031; --gold-500:#d4af37; --gold-600:#b9932b; }
    /* smooth open/close cue for details (Safari friendly too) */
    #faq details[open] summary .chev{ transform: rotate(180deg); border-color: var(--gold-500); }
/* Reduce motion: ভিডিও বন্ধ, শুধু পোস্টার দেখাও */
@media (prefers-reduced-motion: reduce){
  #vimeoBg{ display:none !important; }
  #heroPoster{ display:block !important; }
}

        /* ---------- GAP / GUTTERS ---------- */
        /* দৃশ্যমান এলাকার দুই পাশে সমান গ্যাপ */
        #fleet .slick-list {
          margin: 0 -14px;
        }
        /* প্রতিটি স্লাইডে দুই পাশে প্যাডিং => মোট গ্যাপ ~28px */
        #fleet .slick-slide {
          padding: 0 14px;
        }

        /* ---------- ARROWS: clearer & accessible ---------- */
        #fleet .slick-arrow {
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          width: 46px;
          height: 46px;
          border-radius: 9999px;
          background: rgba(255, 255, 255, 0.95);
          border: 1px solid #cbd5e1;
          box-shadow: 0 10px 24px -10px rgba(2, 6, 23, 0.35);
          backdrop-filter: blur(6px);
          -webkit-backdrop-filter: blur(6px);
          z-index: 5;
          display: grid;
          place-items: center;
          transition: transform 0.2s ease, box-shadow 0.2s ease,
            border-color 0.2s ease, background 0.2s ease;
        }
        #fleet .slick-prev:before,
        #fleet .slick-next:before {
          display: none;
        }

        /* পজিশন */
        #fleet .slick-prev {
          left: -4px;
        }
        #fleet .slick-next {
          right: -4px;
        }

        /* hover / focus */
        #fleet .slick-arrow:hover {
          transform: translateY(-50%) scale(1.06);
          border-color: #94a3b8;
          background: #fff;
          box-shadow: 0 16px 36px -12px rgba(2, 6, 23, 0.4);
        }
        #fleet .slick-arrow:focus-visible {
          outline: 3px solid #eab30833; /* subtle ring */
          outline-offset: 2px;
        }

        /* ---------- CARDS ---------- */
        #fleet .card {
          border: 1px solid #e2e8f0;
          border-radius: 1rem;
          background: #fff;
          padding: 1.25rem;
          transition: box-shadow 0.25s ease, transform 0.25s ease;
        }
        #fleet .card:hover {
          box-shadow: 0 18px 40px -18px rgba(2, 6, 23, 0.25);
          transform: translateY(-2px);
        }
        @media (min-width: 768px) {
          #fleet .card {
            padding: 1.5rem;
          }
        }

        /* ---------- IMAGE BOX ---------- */
        #fleet .thumb {
          position: relative;
          overflow: hidden;
          border-radius: 0.75rem;
        }
        #fleet .thumb img {
          width: 100%;
          height: 100%;
          object-fit: contain;
          display: block;
          transition: transform 0.5s ease;
        }
        #fleet .card:hover .thumb img {
          transform: scale(1.02);
        }

        /* ---------- SPEC CHIPS ---------- */
        #fleet .spec {
          background: #f8fafc;
          border: 1px solid #e2e8f0;
          border-radius: 0.75rem;
          padding: 0.5rem 0.6rem;
        }

        /* nicer mobile heading */
        @media (max-width: 639.98px) {
          #fleet .hgroup {
            text-align: center;
          }
        }