.elementor-47426 .elementor-element.elementor-element-cc77a10{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-47426 .elementor-element.elementor-element-73b7cca{--display:flex;}.elementor-47426 .elementor-element.elementor-element-6f667a0{--display:flex;--min-height:35vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--padding-top:2vw;--padding-bottom:2vw;--padding-left:0vw;--padding-right:0vw;}.elementor-47426 .elementor-element.elementor-element-6f667a0:not(.elementor-motion-effects-element-type-background), .elementor-47426 .elementor-element.elementor-element-6f667a0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(max-width:767px){.elementor-47426 .elementor-element.elementor-element-6f667a0{--min-height:8vh;}}/* Start custom CSS for container, class: .elementor-element-6f667a0 */.elementor-47426 .elementor-element.elementor-element-6f667a0 video{
    object-fit: contain
}/* End custom CSS */
/* Start custom CSS *//* GLOBAL TYPOGRAPHY AND COLOR VARIABLES (for consistency) */
        :root {
            --font-pippins: 'Pippins', sans-serif;
            --color-primary: #576F14;
            --color-title: #576F14;
            --color-text-dark: #507013; /* A deep almost black for general text */
            --color-text-medium: #495057; /* A slightly lighter dark for secondary text */
            --color-background-light: #F8F9FA;
            --color-background-medium: #F0F2F5;
            --color-background-cta: #E6EAF0;
            --color-border: #E0E0E0; /* For card borders etc. */
            --color-blue-dark: #576F14; /* From your existing custom code */
            --color-blue-medium: #576F14; /* From your existing custom code */
        }

        body {
            font-family: var(--font-pippins);
            background-color: var(--color-background-light);
            color: var(--color-text-dark);
        }

        /* Specific styles for Tranzkart Typography Details */
        /* H1 Title */
        .tranzkart-h1 {
            font-weight: bold; /* Pippins Bold */
            font-size: 48px;
            letter-spacing: 0%; /* 0em */
            color: var(--color-title);
            font-family: var(--font-pippins);
        }
        /* H2 Title */
        .tranzkart-h2 {
            font-weight: bold; /* Pippins Bold */
            font-size: 32px;
            letter-spacing: 0.02em; /* 2% */
            color: var(--color-title); /* Assuming H2 also uses title color */
            font-family: var(--font-pippins);
        }
        /* Bold Body */
        .tranzkart-body-bold {
            font-weight: bold; /* Pippins Bold */
            font-size: 24px;
            letter-spacing: 0%; /* 0em */
            font-family: var(--font-pippins);
        }
        /* Medium Body */
        .tranzkart-body-medium {
            font-weight: 500; /* Pippins Medium */
            font-size: 18px;
            letter-spacing: 0%; /* 0em */
            font-family: var(--font-pippins);
        }
        /* Regular Body */
        .tranzkart-body-regular {
            font-weight: normal; /* Pippins Regular */
            font-size: 16px;
            letter-spacing: 0.02em; /* 2% */
            font-family: var(--font-pippins);
        }
        /* Card Body Text */
        .tranzkart-card-text {
            font-weight: normal; /* Pippins Regular */
            font-size: 12px;
            letter-spacing: 0.02em; /* 2% */
            font-family: var(--font-pippins);
        }

        /* Custom styles for your embedded HTML sections to match Tranzkart theme */
        /* Existing styles from your custom HTML, adjusted for new colors/fonts where applicable */
        .gradient-text {
            background: linear-gradient(45deg, var(--color-blue-dark), var(--color-blue-medium)); /* Using existing blue gradient for headings */
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-family: var(--font-pippins); /* Ensure Pippins is applied */
        }
        .chart-container { position: relative; margin: auto; height: 40vh; width: 100%; max-width: 800px; max-height: 400px; }
        .tab-btn {
            font-family: var(--font-pippins);
            font-weight: 500; /* Medium for tabs */
            color: var(--color-text-dark);
        }
        .tab-btn.active {
            border-color: var(--color-blue-dark);
            background-color: var(--color-blue-dark);
            color: #FFFFFF;
        }
        .timeline-content { max-height: 0; overflow: hidden; transition: max-height 0.7s ease-in-out; }
        .timeline-item.active .timeline-content { max-height: 500px; }
        .timeline-item.active .timeline-icon {
            background-color: var(--color-blue-dark);
            color: #ffffff;
            transform: scale(1.1);
        }
        .timeline-icon { transition: all 0.3s ease; }
        .timeline-item .font-slab { /* Adjust timeline specific font if it's not Pippins or if it needs to be explicitly Pippins */
            font-family: var(--font-pippins);
        }
        .timeline-item .text-blue-900 {
            color: var(--color-blue-dark); /* Using the provided blue-900 equivalent */
        }
        .p-4.bg-gray-50.rounded-lg h4 {
            color: var(--color-blue-dark); /* Match Tranzkart accent for these sub-headings */
        }
        /* Ensure all general text within custom HTML uses Tranzkart body text styles */
        .max-w-3xl.mx-auto.text-lg.md:text-xl.text-gray-600.leading-relaxed.mb-8,
        .max-w-2xl.mx-auto.text-lg.text-gray-600 {
            font-family: var(--font-pippins);
            font-size: 18px; /* Assuming Medium Body for these larger introductory texts */
            letter-spacing: 0%;
            color: var(--color-text-medium);
        }
        /* For chart text, try to align with Tranzkart body fonts */
        #fleetGrowthChart {
            font-family: var(--font-pippins);
            color: var(--color-text-dark); /* Apply chart label color */
        }
        /* Button colors based on your theme, using blue as a primary button color for contrast */
        .elementor-button {
            background-color: var(--color-primary) !important; /* Force primary color for main buttons */
            color: white !important;
            font-family: var(--font-pippins) !important;
            font-weight: Regular !important; /* Bold for CTAs */
            font-size: 15px !important; /* Slightly larger for emphasis */
            letter-spacing: 0% !important; /* As per bold body */
        }
        .elementor-button:hover {
            background-color: #507013 !important; /* A slightly darker shade of primary on hover */
        }
        /* For the secondary button (Explore Investment), use a complementary color */
        .elementor-button.secondary {
             background-color: var(--color-blue-dark) !important;
             color: white !important;
        }
        .elementor-button.secondary:hover {
             background-color: var(--color-blue-medium) !important;
        }/* End custom CSS */