    body {
      margin: 0;
      padding: 0;
      font-family: "Poppins", sans-serif;
    }

    #navbar-wrapper {
      position: sticky;
      /* keeps the whole block pinned */
      top: 0;
      z-index: 999;
    }

    body.scrolled #navbar-wrapper {
      box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
    }

    @keyframes fadeSlideUp {
      0% {
        opacity: 0;
        transform: translateY(40px);
      }

      100% {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .animate-fade-slide {
      animation: fadeSlideUp 1s ease-out forwards;
    }

    /* Optional stagger delay utility */
    .delay-100 {
      animation-delay: 0.1s;
    }

    .delay-200 {
      animation-delay: 0.2s;
    }

    .delay-300 {
      animation-delay: 0.3s;
    }

    .delay-400 {
      animation-delay: 0.4s;
    }

    .delay-500 {
      animation-delay: 0.5s;
    }

    /* Add this to your block (keep it once on the page) */
    .quote-track {
      transition: transform 1s ease-in-out;
    }

    .quote-slide {
      flex: 0 0 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* Smooth mobile dropdown animation */
    .dropdown-mobile-container,
    .nested-dropdown,
    ul.dropdown-mobile {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-in-out, padding 0.3s ease-in-out;
    }

    /* When open, add 'open' class */
    .dropdown-mobile-container.open,
    .nested-dropdown.open,
    ul.dropdown-mobile.open {
      max-height: 1000px;
      /* big enough to fit all links */
    }

    /* Animate horizontal scroll infinitely */
    .scroll-container {
      overflow: hidden;
      width: 100%;
    }

    .scroll-content {
      display: flex;
      gap: 1rem;
      flex-wrap: nowrap;
    }

    .scroll-content img {
      flex-shrink: 0;
      height: 12rem;
      /* adjust as needed */
    }

    /* Fix Google icon and dropdown alignment */
    #google_translate_element {
      display: flex;
      justify-content: center;
      margin-top: 20px;
    }

    /* Make Google’s injected wrapper display in a row */
    .goog-te-gadget-simple {
      display: inline-flex !important;
      align-items: center !important;
      gap: 6px !important;
    }

    /* Globe icon style */
    .goog-te-gadget-icon {
      width: 18px !important;
      height: 18px !important;
      margin-right: 6px !important;
      vertical-align: middle !important;
    }

    /* Fix the dropdown anchor styling */
    .goog-te-gadget-simple span,
    .goog-te-gadget-simple a {
      display: inline-flex !important;
      align-items: center !important;
    }

    /* Make the dropdown itself bigger */
    .goog-te-gadget-simple {
      font-size: 16px !important;
      padding: 10px 14px !important;
      border-radius: 6px !important;
    }

    /* Optional: Bigger select dropdown inside */
    .goog-te-combo {
      font-size: 16px !important;
      padding: 8px 12px !important;
    }

    /* Client slider */
    #clients-slider {
      will-change: transform;
      transition: transform 0s linear;
    }