/* ----------------------------------

Template Name: Tranzi - Transportation & Logistics Template
Author: validtheme
Description:
Version: 1.2

Main Font    : Inter
Main Color   : #FF5C01

-------------------------------------

[Typography]

Body copy:    15px 'Inter', sans-serif
Header:     36px 'Inter', sans-serif
Input, textarea:  15px 'Inter', sans-serif
Sidebar heading:  20px 'Inter', sans-serif

>>> TABLE OF CONTENTS:
=======================
        
    01. Template default css
        - Animations
        - General
        - Section Title
        - Video Button
        - Typography
        - Tables
        - Forms
        - Buttons
        - Pagination
        - Colors
        - Accordion
        - Tabs
    02. Preloader
    03. Topbar
    04 Navbar
        - Navbar Default
        - Navbar Transparent
        - Navbar Sticky
        - Navbar Box
    05. Banner
        - Banner Style One
        - Banner Style Two
        - Banner Style Three
        - Banner Style Four
        - Banner Style Five
        - Banner Style Six
    06. Features
    07. About Us
        - Version One
        - Version Two
        - Version Three
    08. Services
        - Version One
        - Version Two
        - Version Three
        - Version Four
        - Version Five
        - Version Six
        - Service Single
    09. Gallery
        - Version One
        - Version Two
        - Version Three
        - Version Foiur
        - Gallery Single
    10. Team
        - Version One
        - Version Two
        - Team Single
    11. Request Quote
    12. Why Choose Us
    13. Our Expertise
    14. Companies/Clients/Partner
    15. Testimonials
    16. Work Process
    17. FAQ
    18. Blog
        - Standard
        - Left Sidebar
        - Right Sidebar
        - Single
    19. Error 404
    20. Footer
    21. PHP Contact Form
    22. Others

*/

/* MOVENTA: preserve the Tranzi structure while presenting the portal preview */
.moventa-platform-preview {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background: #f3f6f9;
  padding: 10px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
}

.moventa-platform-preview img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

.moventa-platform-preview span {
  position: absolute;
  right: 22px;
  bottom: 20px;
  padding: 7px 12px;
  border-radius: 20px;
  background: rgba(8, 18, 32, 0.86);
  color: #fff;
  font-size: 11px;
  letter-spacing: 0.04em;
}

.template-copy-hidden {
    display: none;
}

.banner-style-one .content h2.moventa-hero-title {
    max-width: 760px;
    font-size: 60px !important;
    line-height: 1.02 !important;
}

@media (max-width: 767px) {
    .banner-style-one .content h2.moventa-hero-title {
        max-width: 100%;
        font-size: 42px !important;
        line-height: 1;
    }
}

.services-details-items .thumb img[src*="moventa-dashboard"] {
  width: 100%;
  background: #f3f6f9;
  object-fit: contain;
}

@media (max-width: 991px) {
  .moventa-platform-preview {
    margin: 35px 0;
  }
}

/* MOVENTA: continuously scrolling procurement categories */
.sourcing-categories-area {
  overflow: hidden;
  padding-bottom: 110px;
}

.sourcing-categories-area .site-heading {
  margin-bottom: 45px;
}

.sourcing-marquee {
  width: 100%;
  overflow: hidden;
  padding-bottom: 10px;
}

.sourcing-marquee-track {
  display: flex;
  width: max-content;
  animation: sourcing-marquee-left 42s linear infinite;
  will-change: transform;
}

.sourcing-marquee:hover .sourcing-marquee-track {
  animation-play-state: paused;
}

.sourcing-marquee-set {
  display: flex;
  gap: 28px;
  padding-right: 28px;
}

.sourcing-category-card {
  flex: 0 0 clamp(280px, 22vw, 360px);
  overflow: hidden;
  border-radius: 10px;
  background: #ffffff;
  text-align: left;
  box-shadow: 0 14px 35px rgba(9, 39, 48, 0.08);
}

.sourcing-category-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.45s ease;
}

.sourcing-category-card:hover img {
  transform: scale(1.035);
}

.sourcing-category-card h3 {
  min-height: 78px;
  margin: 0;
  padding: 22px 24px;
  color: #0a3540;
  font-size: 20px;
  line-height: 1.28;
}

@keyframes sourcing-marquee-left {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 767px) {
  .sourcing-categories-area {
    padding-bottom: 80px;
  }

  .sourcing-marquee {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-left: 20px;
  }

  .sourcing-marquee::-webkit-scrollbar {
    display: none;
  }

  .sourcing-marquee-track {
    animation: none;
  }

  .sourcing-marquee-set {
    gap: 18px;
    padding-right: 20px;
  }

  .sourcing-marquee-set[aria-hidden="true"] {
    display: none;
  }

  .sourcing-category-card {
    flex-basis: 78vw;
    scroll-snap-align: start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sourcing-marquee {
    overflow-x: auto;
  }

  .sourcing-marquee-track {
    animation: none;
  }

  .sourcing-marquee-set[aria-hidden="true"] {
    display: none;
  }
}

/* About page: backend platform feature marquee */
.backend-platform-area {
  overflow: hidden;
}

.backend-platform-area .site-heading {
  margin-bottom: 48px;
}

.backend-platform-area .site-heading p {
  max-width: 720px;
  margin: 20px auto 0;
}

.backend-feature-marquee {
  width: 100%;
  overflow: hidden;
}

.backend-feature-track {
  display: flex;
  width: max-content;
  animation: backend-feature-scroll 30s linear infinite;
  will-change: transform;
}

.backend-feature-marquee:hover .backend-feature-track {
  animation-play-state: paused;
}

.backend-feature-set {
  display: flex;
  gap: 28px;
  padding-right: 28px;
}

.backend-feature-card {
  position: relative;
  flex: 0 0 360px;
  min-height: 390px;
  padding: 42px 38px;
  overflow: hidden;
  border: 1px solid #d9e0e2;
  border-radius: 8px;
  background: #fff;
  text-align: left;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.backend-feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 45px rgba(9, 54, 64, 0.12);
}

.backend-feature-icon {
  display: grid;
  width: 104px;
  height: 104px;
  margin-bottom: 42px;
  place-items: center;
  border-radius: 50%;
  background: #e8f6f7;
  color: #ff7442;
  font-size: 42px;
}

.backend-feature-card > span {
  position: absolute;
  top: 38px;
  right: 38px;
  color: #0a4d5a;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.backend-feature-card h3 {
  margin-bottom: 18px;
  color: #0a3540;
  font-size: 25px;
  line-height: 1.24;
}

.backend-feature-card p {
  margin: 0;
  color: #657176;
  font-size: 16px;
  line-height: 1.75;
}

@keyframes backend-feature-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 767px) {
  .backend-feature-marquee {
    overflow-x: auto;
    padding-left: 20px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .backend-feature-marquee::-webkit-scrollbar {
    display: none;
  }

  .backend-feature-track {
    animation: none;
  }

  .backend-feature-set {
    gap: 18px;
    padding-right: 20px;
  }

  .backend-feature-set[aria-hidden="true"] {
    display: none;
  }

  .backend-feature-card {
    flex-basis: 82vw;
    min-height: 370px;
    padding: 34px 30px;
    scroll-snap-align: start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .backend-feature-marquee {
    overflow-x: auto;
  }

  .backend-feature-track {
    animation: none;
  }

  .backend-feature-set[aria-hidden="true"] {
    display: none;
  }
}

/*
** General Styles for HTML tags
*/
