/* * A professional and modern CSS style for a product portfolio page.
 * This stylesheet refines an existing design by simplifying shadows,
 * enhancing gradients, and improving overall spacing and visual coherence.
 */

/* ================== General Styles ================== */


.product_section_page-background::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #e0f2fe 0%, #d1f1ff 100%) !important;
     
    opacity: 0.6;
    z-index: -1;
    animation: product_section_page-backgroundFloat 20s ease-in-out infinite;
}

@keyframes product_section_page-backgroundFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-10px) rotate(0.2deg); }
}

.product_section_page-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
    position: relative;
}

/* ================== Header Section ================== */
.product_section_page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2.5rem;
    padding: 1rem 2.5rem;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border-radius: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.5);
    animation: product_section_page-slideInDown 0.8s ease-out;
}

@keyframes product_section_page-slideInDown {
    from { opacity: 0; transform: translateY(-30px); }
    to { opacity: 1; transform: translateY(0); }
}

.product_section_page-header-logo-container,
.product_section_page-make-in-india-logo-container {
    display: flex;
    align-items: center;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
}

.product_section_page-header-logo-container:hover,
.product_section_page-make-in-india-logo-container:hover {
    transform: scale(1.05);
}

.product_section_page-xtragen-full-logo {
    height: 3.5rem;
    width: auto;
    border-radius: 8px;
}

.product_section_page-make-in-india-icon {
    height: 4rem;
    width: auto;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

/* ================== Main Solutions Section ================== */
.product_section_page-main-solutions-section {
    text-align: center;
    margin: 0 auto 2rem auto;
    padding: 1rem 2.5rem;
    border-radius: 50px;
    background: #1651e2;
    color: white;
    max-width: 570px;
    position: relative;
    overflow: hidden;
   
    animation: product_section_page-fadeInUp 0.8s ease-out 0.2s both;
}

.product_section_page-main-solutions-section::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    animation: product_section_page-shimmer 3s infinite;
}

@keyframes product_section_page-shimmer {
    0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
    100% { transform: translateX(100%) translateY(100%) rotate(45deg); }
}

@keyframes product_section_page-fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

.product_section_page-section-heading {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.5px;
    position: relative;
    z-index: 1;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin: 0;
    color : white;
}

.product_section_page-gnss-heading {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 3rem 0 1.5rem;
    color: #1a202c;
    text-align: left;
    position: relative;
    animation: product_section_page-fadeInUp 0.8s ease-out;
}

.product_section_page-gnss-heading::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 60px;
    height: 4px;
    background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
    border-radius: 2px;
}

/* ================== Card Grid and Cards ================== */
.product_section_page-card-grid {
    /* FIX 1: Ensure Grid items (cards) are aligned */
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem; /* Reduced gap */
    margin-bottom: 4rem;
    /* Adding align-items: stretch to fix card height when content varies */
    align-items: stretch; 
}

@media (min-width: 768px) {
    .product_section_page-card-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) { /* New breakpoint for 3 cards */
    .product_section_page-card-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1400px) { /* New breakpoint for 4 cards */
    .product_section_page-card-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}




/*this is only for tablet section */
/* ================== Card Grid and Cards ================== */
.product_section_page-card-grid_tablets {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem; /* Reduced gap */
    margin-bottom: 4rem;
}

@media (min-width: 768px) {
    .product_section_page-card-grid_tablets {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) { /* New breakpoint for 3 cards */
    .product_section_page-card-grid_tablets {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1400px) { /* New breakpoint for 4 cards */
    .product_section_page-card-grid_tablets {
        grid-template-columns: repeat(3, 1fr);
    }
}





.product_section_page-card {
    border-radius: 15px; /* Slightly reduced border-radius */
    overflow: hidden;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05); /* Slightly reduced shadow */
    border: 1px solid rgba(255, 255, 255, 0.8);
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    animation: product_section_page-fadeInUp 0.6s ease-out both;
}

.product_section_page-card:nth-child(1) { animation-delay: 0.1s; }
.product_section_page-card:nth-child(2) { animation-delay: 0.2s; }
.product_section_page-card:nth-child(3) { animation-delay: 0.3s; }
.product_section_page-card:nth-child(4) { animation-delay: 0.4s; }
.product_section_page-card:nth-child(5) { animation-delay: 0.5s; }
.product_section_page-card:nth-child(6) { animation-delay: 0.6s; }
.product_section_page-card:nth-child(7) { animation-delay: 0.7s; }
.product_section_page-card:nth-child(8) { animation-delay: 0.8s; }
.product_section_page-card:nth-child(9) { animation-delay: 0.9s; }
.product_section_page-card:nth-child(10) { animation-delay: 1.0s; }
.product_section_page-card:nth-child(11) { animation-delay: 1.1s; }

.product_section_page-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(23, 31, 44, 0.05) 0%, rgba(200, 210, 220, 0.05) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
}

.product_section_page-card:hover {
    transform: translateY(-5px) scale(1.01); /* Slightly reduced hover effect */
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08); /* Slightly reduced hover shadow */
}

.product_section_page-card:hover::before {
    opacity: 0;
}

.product_section_page-card-header {
    background: #051f66;
    color: white;
    padding: 1rem; /* Reduced padding */
    text-align: center;
    position: relative;
    overflow: hidden;
}

.product_section_page-card-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s ease;
}

.product_section_page-card:hover .product_section_page-card-header::before {
    left: 100%;
}

.product_section_page-card-title {
    font-size: 0.9rem; /* Reduced font size */
    font-weight: 600;
    position: relative;
    z-index: 2;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    color : white;
    margin : 0;
}

.product_section_page-card-body {
    display: flex;
    flex-direction: column;
    padding: 1.5rem; /* Reduced padding */
    flex-grow: 1;
    position: relative;
    z-index: 2;
}

.product_section_page-card-content {
    /* FIX 2: Ensure content takes up all available space to push button to the bottom */
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem; /* Reduced gap */
    align-items: center;
    margin-bottom: 1.5rem;
    flex-grow: 1; /* New: Allows content area to grow */
}

@media (min-width: 768px) {
    .product_section_page-card-content {
        grid-template-columns: 1fr 1fr;
    }
}

.product_section_page-text-container {
    text-align: left;
}

.product_section_page-product-description {
    color: #4a5568;
    font-size: 0.95rem; /* Reduced font size */
    margin-bottom: 0.6rem; /* Reduced margin */
    font-weight: 500;
    line-height: 1.5;
}

.product_section_page-model-number {
    color: #6b7280;
    font-weight: 600;
    font-size: 0.75rem; /* Reduced font size */
    padding: 0.4rem 0.8rem; /* Reduced padding */
    background: rgba(200, 210, 220, 0.2);
    border-radius: 15px; /* Slightly reduced border-radius */
    display: inline-block;
    border: 1px solid rgba(200, 210, 220, 0.5);
    transition: all 0.3s ease;
}

.product_section_page-card:hover .product_section_page-model-number {
    background: rgba(200, 210, 220, 0.2);
    border-color: rgba(200, 210, 220, 0.5);
}

.product_section_page-image-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.5rem; /* Reduced gap */
    position: relative;
}

.product_section_page-product-image {
    max-width: 100%;
    height: 140px; /* Reduced image height */
    object-fit: contain; /* Changed to contain for better aspect ratio */
    border-radius: 10px; /* Slightly reduced border-radius */
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.07); /* Slightly reduced shadow */
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    border: 1px solid #e2e8f0;
}

.product_section_page-card:hover .product_section_page-product-image {
    transform: scale(1.03) rotate(-1deg); /* Slightly reduced hover effect */
}

.product_section_page-xtragen-logo-small {
    height: 1.2rem; /* Reduced logo size */
    width: auto;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.product_section_page-card:hover .product_section_page-xtragen-logo-small {
    opacity: 1;
}

/* ================== New Download Button Styling (White Background) ================== */

.product_section_page-card-actions {
    /* This ensures the button is correctly placed and visible at the bottom of the card */
    margin-top: auto; 
    padding-top: 1rem;
    border-top: 1px solid #e2e8f0; 
    text-align: center;
    padding-bottom: 0; /* Removing excess padding here */
}

.product_section_page-download-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 250px !important; 
    padding: 0.75rem 1.5rem;
    
    /* UI FIXES */
    background: #fdfdfd; /* Off-white for better contrast */
    color: #0d2859; 
    border: 1px solid #c1c7d0; /* Darker border for better visibility */
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08); /* Slightly improved shadow for 'lift' */

    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    border-radius: 10px; 
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
    
    max-width: 95%; /* Increased max-width for better use of space */
    margin: 0 auto 0.5rem auto; /* Center the button and add spacing below it */
}

.product_section_page-download-button i {
    margin-right: 0.5rem;
    font-size: 1rem;
    color: #1651e2; /* Icon color matching header blue */
}

.product_section_page-download-button:hover {
    background: #eef1f4; /* Light background for hover feedback */
    transform: translateY(-2px); /* Increased lift on hover */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.12); /* Enhanced shadow on hover */
    border-color: #1e40af; /* Blue border on hover */
}

.product_section_page-download-button:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}


/* ================== Custom Text Section ================== */
.product_section_page-custom-text-section {
    background: linear-gradient(135deg, #1e3a8a 0%, #1d4ed8 100%);
    padding: 2rem; /* Reduced padding */
    border-radius: 15px; /* Slightly reduced border-radius */
    margin: 2rem 0;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.3);
    animation: product_section_page-fadeInUp 0.8s ease-out;
    color: white;
}

.product_section_page-custom-text-paragraph {
    text-align: center;
    font-weight: 500;
    color: white;
    font-size: 1.1rem; /* Reduced font size */
    line-height: 1.6;
    margin : 0;
}

/* ================== Poster Section ================== */
.product_section_page-poster-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 3rem 0; /* Reduced margin */
    animation: product_section_page-fadeInUp 0.8s ease-out;
}

.product_section_page-poster-image {
    width: 100%;
    height: auto;
    border-radius: 15px; /* Slightly reduced border-radius */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.07);
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    border: 2px solid #e2e8f0;
}

.product_section_page-poster-image:hover {
    transform: scale(1.005); /* Slightly reduced hover effect */
}

/* ================== Responsive Design ================== */
@media (max-width: 768px) {
    .product_section_page-container {
        padding: 1.5rem 1rem;
    }
    .product_section_page-header {
        flex-direction: column;
        gap: 1.5rem;
        padding: 1rem;
    }
    .product_section_page-xtragen-full-logo {
        height: 3rem;
    }
    .product_section_page-make-in-india-icon {
        height: 3.5rem;
    }
    .product_section_page-section-heading {
        font-size: 1.25rem;
    }
    .product_section_page-gnss-heading {
        font-size: 1.1rem;
        text-align: left;
    }
    .product_section_page-card-content {
        grid-template-columns: 1fr;
        text-align: center;
        /* Re-adding margin-bottom here to match previous spacing when stackes */
        margin-bottom: 1.5rem;
    }
    .product_section_page-text-container {
        text-align: center;
    }
    .product_section_page-main-solutions-section {
        padding: 1rem 1.5rem;
    }
    .product_section_page-custom-text-paragraph {
        font-size: 1.1rem;
    }
    .product_section_page-card-body {
        padding: 1.5rem;
    }
    .product_section_page-product-image {
        height: 140px;
    }
    .product_section_page-download-button {
        padding: 0.65rem 1.25rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .product_section_page-card-body {
        padding: 1.25rem;
    }
    .product_section_page-product-image {
        height: 120px;
    }
    .product_section_page-section-heading {
        font-size: 1.1rem;
    }
    .product_section_page-gnss-heading {
        font-size: 1rem;
    }
    .product_section_page-card-title {
        font-size: 1rem;
    }
    .product_section_page-product-description {
        font-size: 0.9rem;
    }
    .product_section_page-model-number {
        font-size: 0.75rem;
    }
}

/* ================== Animations and Interactivity ================== */
.product_section_page-loading {
    opacity: 0;
    animation: product_section_page-fadeIn 0.6s ease-out forwards;
}

@keyframes product_section_page-fadeIn {
    to {
        opacity: 1;
    }
}

.product_section_page-scroll-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease-out;
}

.product_section_page-scroll-reveal.revealed {
    opacity: 1;
    transform: translateY(0);
}

.product_section_page-interactive-element {
    cursor: pointer;
    transition: all 0.3s ease;
}

.product_section_page-interactive-element:hover {
    transform: translateY(-2px);
}

@keyframes product_section_page-float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
}

.product_section_page-floating {
    animation: product_section_page-float 3s ease-in-out infinite;
}
    
   








































 
    
    
    
    
    
    
    
    
 /* galaxy tab singal product page */
.product_galaxytab_product-container {
    background: #fff;
    border-radius: 16px;
    margin: auto;
    max-width: 1300px;
    width: 100%;
    display: flex;
    gap: 30px;
    overflow: hidden;
    background: #eeeeee;
    padding: 40px;
    align-items: center;
    margin-top: 34px;
}

    @media(max-width: 900px) {
      .product_galaxytab_product-container {
        flex-direction: column;
        text-align: center;
      }
      .product_galaxytab_product-image {
        margin-bottom: 20px;
      }
    }

    .product_galaxytab_product-image img {
      max-width: 320px;
      border-radius: 12px;
    
    }

    .product_galaxytab_product-details {
      flex: 1;
    }

    .product_galaxytab_product-details h1 {
      font-size: 2rem;
      font-weight: 700;
      margin-bottom: 20px;
      color: #0d2859;
    }

    .product_galaxytab_product-details p {
      font-size: 1rem;
      line-height: 1.6;
      color: #444;
      margin-bottom: 25px;
    }

  .product_galaxytab_card-header {
    background: black;
    color: #fff;
    padding: 12px 20px;
    border-radius: 6px;
    font-weight: 700;
    margin-bottom: 20px;
    font-size: 1.2rem;
    display: inline-block;
    /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); */
}

    .product_galaxytab_specs {
      list-style: none;
      padding: 0;
      margin: 0 0 20px 0;
    }

    .product_galaxytab_specs li {
      font-size: 1rem;
      color: #333;
      padding: 8px 0;
      border-bottom: 1px solid #eee;
    }

    .product_galaxytab_specs li:last-child {
      border-bottom: none;
    }

    .product_galaxytab_logos {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 20px;
    }

    .product_galaxytab_logos img {
      height: 40px;
    }

    .product_galaxytab_dealer {
      text-align: right;
    }

    .product_galaxytab_dealer p:first-child {
      font-weight: 600;
      margin: 0;
      color: #222;
    }

    .product_galaxytab_dealer p:last-child {
      margin: 0;
      font-size: 0.9rem;
      color: #666;
    }
    
    







    
    
    /* product page Next page BTn */
    
       .product_next_btn_container {
    /* padding: 2rem; */
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;    margin-bottom: 48px;
}

    .product_next_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 2rem;
    border: none;
    border-radius: 9999px;
    background-color: #1651e2;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

        .product_next_btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 15px 20px -5px rgba(0, 0, 0, 0.2), 0 6px 10px -3px rgba(0, 0, 0, 0.1);
            color : white;
            
        }

        .product_next_btn_icon {
            margin-left: 0.75rem;
            font-size: 1.5rem;
            color : white;
        }
        .product_next_btn_containerlink{
            text-decoration: none;
        }
    
    

    
    
    
     /*-********* Fonts Import Start ***********/
      
        /********* Fonts Face CSS End **********/

        /******* Common Element CSS Start ******/
        .Home_Market_Segments_PageBody {
            font-family: "Roboto", sans-serif !important;
            font-size: 16px !important;
            background-color: #f0f2f5 !important;
            margin: 0;
            padding: 0;
        }

        .Home_Market_Segments_SectionTitle {
            margin-bottom: 48px;
            padding-bottom: 16px;
            font-size: 36px !important;
            line-height: 1.2;
            font-weight: 700 !important;
            text-transform: capitalize;
            text-align: center;
            color: black !important;
        }

        .Home_Market_Segments_CardTitle {
            margin: 0 0 10px;
            font-size: 28px !important;
            line-height: 36px;
            color : white !important;
        }
        
        .Home_Market_Segments_CardDescription {
             opacity: 0;
            transform: translateY(32px);
            transition: all 0.4s ease-in-out 0.2s;
             color : white !important;
        }

        .Home_Market_Segments_CardImage {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.4s ease-in-out;
        }
        /******* Common Element CSS End *********/

        /******* Slider Section CSS Start ******/
        .Home_Market_Segments_Section {
            padding: 23px 50px;
            overflow: hidden;
            position: relative;
        }

        .Home_Market_Segments_Carousel {
            display: flex;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            /* scroll-behavior is removed to allow JS to control the animation */
            padding-bottom: 20px;
            cursor: grab;
            margin-top: 10px; /* Card ko upar se cutne se bachane ke liye margin add kiya gaya hai */
        }
        
        .Home_Market_Segments_Carousel.active-drag {
            cursor: grabbing;
            cursor: -webkit-grabbing;
        }
        
        .Home_Market_Segments_Carousel::-webkit-scrollbar {
            display: none;
        }
        .Home_Market_Segments_Carousel {
            -ms-overflow-style: none;
            scrollbar-width: none;
        }

        .Home_Market_Segments_Item {
            margin: 0 15px 60px;
            width: 320px;
            height: 400px;
            flex-shrink: 0;
            display: flex;
            align-items: flex-end;
            background-color: #343434 !important;
            border-radius: 16px;
            overflow: hidden;
            position: relative;
            transition: all 0.4s ease-in-out, transform 0.3s ease;
            cursor: pointer;
        }
        
        .Home_Market_Segments_ItemImageContainer {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 0;
            border-radius: 16px;
            overflow: hidden;
        }

        .Home_Market_Segments_Item:hover .Home_Market_Segments_CardImage {
            transform: scale(1.05);
        }

        .Home_Market_Segments_Item:hover {
           
            box-shadow: 12px 40px 40px rgba(0, 0, 0, 0.25);
        }

        .Home_Market_Segments_Item:after {
            content: "";
            display: block;
            position: absolute;
            height: 100%;
            width: 100%;
            left: 0;
            top: 0;
            background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
        }

        .Home_Market_Segments_ItemDesc {
            padding: 0 24px 12px;
            color: #fff !important;
            position: relative;
            z-index: 1;
            overflow: hidden;
            transform: translateY(calc(100% - 80px)); /* Title ko upar karne ke liye value badhayi gayi hai */
            transition: all 0.4s ease-in-out;
        }

        .Home_Market_Segments_Item:hover .Home_Market_Segments_ItemDesc {
            transform: none;
        }

        .Home_Market_Segments_Item:hover .Home_Market_Segments_CardDescription {
            opacity: 1;
            transform: translateY(0);
        }

        /*-- Navigation Arrows --*/
        .Home_Market_Segments_NavArrow {
            position: absolute;
            top: 55%; /* Adjusted for new margin */
            transform: translateY(-50%);
            background-color: rgba(255, 255, 255, 0.7) !important;
            border: none;
            border-radius: 50%;
            width: 40px;
            height: 40px;
            cursor: pointer;
            z-index: 10;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 5px rgba(0,0,0,0.2);
            transition: background-color 0.3s;
            font-size: 24px !important;
            font-weight: bold !important;
            color: #333 !important;
            line-height: 1;
        }
        .Home_Market_Segments_NavArrow:hover {
            background-color: white !important;
        }
        .Home_Market_Segments_NavArrow.prev {
            left: 15px;
        }
        .Home_Market_Segments_NavArrow.next {
            right: 15px;
        }
        /******** Slider Section CSS End ********/

        /***** Responsive CSS Start ******/
        @media (min-width: 992px) and (max-width: 1199px) {
            .Home_Market_Segments_CardTitle {
                font-size: 24px !important;
                line-height: 32px;
            }
            .Home_Market_Segments_Section {
                padding: 50px 30px;
            }
            .Home_Market_Segments_Item {
                width: 260px;
                height: 360px;
            }
            .Home_Market_Segments_ItemDesc {
                transform: translateY(calc(100% - 80px)); /* Title ko upar karne ke liye value badhayi gayi hai */
            }
        }

        @media (min-width: 768px) and (max-width: 991px) {
            .Home_Market_Segments_CardTitle {
                font-size: 24px !important;
                line-height: 32px;
            }
            .Home_Market_Segments_Section {
                padding: 50px 30px 40px;
            }
            .Home_Market_Segments_Item {
                width: 240px;
                height: 330px;
            }
            .Home_Market_Segments_ItemDesc {
                transform: translateY(calc(100% - 80px)); /* Title ko upar karne ke liye value badhayi gayi hai */
            }
        }

        @media (max-width: 767px) {
            .Home_Market_Segments_PageBody {
                font-size: 14px !important;
            }
            .Home_Market_Segments_SectionTitle {
                margin-bottom: 20px;
                font-size: 28px !important;
            }
            .Home_Market_Segments_CardTitle {
                font-size: 19px !important;
                line-height: 24px;
            }
            .Home_Market_Segments_Section {
                padding: 30px 0;
            }
            .Home_Market_Segments_Carousel{
                padding-left: 15px;
                padding-right: 15px;
            }
            .Home_Market_Segments_Item {
                width: 200px;
                height: 280px;
            }
            .Home_Market_Segments_ItemDesc {
                padding: 0 14px 5px;
                transform: translateY(calc(100% - 80px)); /* Title ko upar karne ke liye value badhayi gayi hai */
            }
        }
        
        
        
        
        
        
        /*Customer logo slider */
        
          
          
          
        @keyframes Home_brand_slider_scroll {
            0% {
                transform: translateX(0);
            }
            100% {
                /* Move the slider to the left by the width of the original set of logos */
                transform: translateX(calc(-150px * 16)); /* 150px is the slide width, 16 is the number of logos */
            }
        }

        /* Main container for the slider */
        .Home_brand_slider__container {
            overflow: hidden; /* Hide the logos that are outside the container */
            padding: 40px 0;
            background-color: white;
            position: relative;
            width: 100%;
            mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
            -webkit-mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
        }
        
        /* The track that holds and animates the logos */
        .Home_brand_slider__track {
            display: flex; /* Arrange logos in a row */
            width: calc(150px * 32); /* Total width = (slide width * number of logos) * 2 for seamless loop */
            animation: Home_brand_slider_scroll 40s linear infinite; /* Apply the animation */
        }
        
        /* Styling for each individual logo slide */
        .Home_brand_slider__slide {
            height: 80px; /* Set a fixed height */
            width: 150px; /* Set a fixed width */
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0 20px;
            flex-shrink: 0; /* Prevent slides from shrinking */
        }
        
        /* Styling for the logo images */
        .Home_brand_slider__slide img {
            max-height: 100%;
            max-width: 100%;
            object-fit: contain;
            filter: grayscale(100%); /* Make logos black and white initially */
            opacity: 0.7;
            transition: all 0.3s ease-in-out;
        }

        /* Hover effect to add color and increase opacity */
        .Home_brand_slider__slide:hover img {
            filter: grayscale(0%);
            opacity: 1;
            transform: scale(1.1);
        }

        /* Pause animation when hovering over the container */
        .Home_brand_slider__container:hover .Home_brand_slider__track {
            animation-play-state: paused;
        }
  
        
        /* Brand Review Section */
        
        
         .brand_review_slider_container {
            position: relative;
            max-width: 1200px;
            width: 100%;
            overflow: hidden;
        }

        .brand_review_slider_wrapper {
            display: flex;
            transition: transform 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55);
        }

        .brand_review_slider_card {
            min-width: 100%;
            box-sizing: border-box;
            background-color: var(--card-bg);
            padding: 1.5rem 2.5rem; /* Decreased vertical padding for less height */
            margin: 0 1rem;
            border-radius: 1.5rem;
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            transform: scale(0.9);
            opacity: 0.5;
            transition: all 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55);
        }

        .brand_review_slider_card.active {
            transform: scale(1);
            opacity: 1;
        }

        .brand_review_slider_nav-btn {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background-color: rgba(255, 255, 255, 0.9);
            border: none;
            cursor: pointer;
            width: 3.5rem;
            height: 3.5rem;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
            z-index: 10;
            transition: background-color 0.3s, transform 0.3s;
        }
        
        .brand_review_slider_nav-btn:hover {
            background-color: var(--card-bg);
            transform: translateY(-50%) scale(1.1);
        }

        .brand_review_slider_prev-btn {
            left: 1rem;
        }

        .brand_review_slider_next-btn {
            right: 1rem;
        }

        .brand_review_slider_nav-btn i {
            font-size: 1.5rem;
            color: var(--text-color);
        }

        @media (min-width: 768px) {
            .brand_review_slider_card {
                min-width: calc(33.3333% - 2rem);
            }
            .brand_review_slider_wrapper {
                justify-content: flex-start;
            }
        }
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
   .breadcrumb__bg {
    background-position: 50%;
    background-size: cover;
    padding:25px 0 29px !important;
    position: relative;
    z-index: 1;
}     
        
  .breadcrumb__content{
      
      margin-left : 32px !important;
      
      
  }      
        
        
        
        
    /* contact form diffrecnt css */



























        
 .scroll__top{
          display :  none !important;
      } 
        
        
        
.tg-header__area-four .tgmenu__navbar-wrap ul {
    margin: 0 auto;
    top: auto;
    margin-top: 4px !important;
}



.tgmenu__navbar-wrap>ul>li a {
  font-size : 15px !important;

}
  


.btn{
  border-radius : 100px !important;
  
}



.slider__bg{
  background-position : ;
  
}

.slider__single:after{
  background : none !important;
  filter : none !important;
}

.slider_baner_home6 .banner__content-three{
  display : none !important;
}
  











/* ------------------------------------------- */
/* NEW HOME PAGE SLIDER - UNIQUE MODERN DESIGN */
/* ------------------------------------------- */

/* Global settings for the section */
.Home_first_card_section {
    /* Increased vertical padding and slightly more relaxed max-width for better desktop fit */
    padding: 80px 30px;
    max-width: 1300px;
    margin: 0 auto;
    font-family: 'Inter', sans-serif; /* Recommended modern font */
}

/* Grid layout (Kept simple and effective) */
.Home_first_card_grid {
    display: grid;
    /* Maintain existing responsive grid structure */
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 35px; /* Increased gap for more breathing room */
}

/* Individual Card Item */
.Home_first_card_item {
    background: #f7f9fc; /* Very light subtle background */
    border-radius: 20px; /* Large, soft rounded corners for uniqueness */
    padding: 35px;
    border: none; /* Removing the hard border */
    /* Soft shadow for depth, giving a floating look */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.03);
    /* Consolidated and slightly faster transition */
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden; /* Important for clean internal elements */
    cursor: pointer;
}

/* Unique Hover Effect: Lift, subtle shadow, and a glow that matches the icon color */
.Home_first_card_item:hover {
    transform: translateY(-8px); /* More pronounced lift */
    /* Enhanced box-shadow for a soft glow and better depth */
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1), 0 0 0 4px rgba(0, 0, 0, 0.02);
}

/* Icon Container */
.Home_first_card_icon {
    width: 60px; /* Slightly larger icon */
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px; /* Larger icon size */
    margin-bottom: 20px;
    /* Inner white shadow for a slight "pop" effect */
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
    position: relative;
    z-index: 10;
}

/* Card 1 Color Scheme (Blue Focus) */
.Home_first_card_item:nth-child(1) .Home_first_card_icon {
    background: #d4e3ff;
    color: #0056d2;
}
.Home_first_card_item:nth-child(1):hover {
    box-shadow: 0 12px 30px rgba(0, 86, 210, 0.2), 0 0 0 4px rgba(0, 86, 210, 0.05); /* Blue glow */
}

/* Card 2 Color Scheme (Green Focus) */
.Home_first_card_item:nth-child(2) .Home_first_card_icon {
    background: #d9f3e4;
    color: #00a86b;
}
.Home_first_card_item:nth-child(2):hover {
    box-shadow: 0 12px 30px rgba(0, 168, 107, 0.2), 0 0 0 4px rgba(0, 168, 107, 0.05); /* Green glow */
}

/* Card 3 Color Scheme (Purple Focus) */
.Home_first_card_item:nth-child(3) .Home_first_card_icon {
    background: #e6e0f7;
    color: #7a3dc1;
}
.Home_first_card_item:nth-child(3):hover {
    box-shadow: 0 12px 30px rgba(122, 61, 193, 0.2), 0 0 0 4px rgba(122, 61, 193, 0.05); /* Purple glow */
}

/* Typography */
.Home_first_card_title {
    font-size: 1.5rem; /* Slightly larger title */
    font-weight: 700; /* Bolder title */
    margin-bottom: 8px;
    color: #1a202c; /* Darker, more prominent text */
}

.Home_first_card_text {
    font-size: 1rem; /* Slightly larger body text for readability */
    color: #5f6b7c;
    line-height: 1.7;
}

/* Responsive full width for smaller screens */
@media (max-width: 768px) {
    .Home_first_card_section {
        padding: 50px 20px;
    }
    .Home_first_card_grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    /* Keeping this specific rule from your original code if needed for specific layouts */
    .Home_first_card_item:last-child {
        grid-column: 1 / -1;
    }
}








/* Home about small section */

 /* The main section container with a clean white background */
        .Home_about_section {
            width: 100%;
            background-color: #ffffff;
            color: #111;
            padding: 4rem 1rem;
            display: flex;
            justify-content: center;
        }

        /* Main container for the content, with a centered, responsive layout */
        .Home_about_main_container {
            max-width: 1200px;
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 2rem;
            align-items: center;
        }

        /* Container for the image, with added spacing and responsiveness */
        .Home_about_image_container {
            width: 100%;
            padding: 1rem;
            display: flex;
            justify-content: center;
        }

        .Home_about_image {
            width: 100%;
            max-width: 500px;
            height: auto;
            
           
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        }

        .Home_about_image:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2);
        }

        /* Container for the text content */
        .Home_about_content {
            padding: 2rem 1rem;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        /* Styles for the "About Us" subtitle */
        .Home_about_subtitle {
            font-size: 0.875rem;
            font-weight: 600;
            text-transform: uppercase;
            color: #002147;
            letter-spacing: 1px;
            margin-bottom: 0.5rem;
        }

        /* Styles for the main title */
        .Home_about_title {
            font-size: 2.25rem;
            font-weight: 800;
            line-height: 1.2;
            color: #111;
            margin-bottom: 1rem;
        }

        /* Styles for the paragraphs */
        .Home_about_text {
            font-size: 1rem;
            line-height: 1.7;
            color: #555;
            margin-bottom: 1rem;
            text-align:justify !important;
        }

        /* Styles for the experience badge */
      .Home_about_badge {
    display : inline-block;
    /* background: #002147; */
    border: 1px solid #ffffff;
    color: #000000;
    padding: 0.75rem 1.5rem;
    border-radius: 0;
    font-size: 1rem;
    box-shadow: 0 4px 12px rgb(149 149 149 / 20%);
    font-weight: 600;
}
        /* Styles for the button */
        .Home_about_button {
            display: inline-block;
            padding: 0.75rem 1.5rem;
            background:#1651e2;
            color: white;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            transition: background 0.3s ease-in-out, transform 0.3s ease-in-out;
            max-width: fit-content;
        }

        .Home_about_button:hover {
            background: #0d46b0;
            transform: translateY(-2px);
               color: white !important;
        }

        /* Responsive adjustments for larger screens */
        @media (min-width: 992px) {
            .Home_about_main_container {
                flex-direction: row;
                gap: 4rem;
                align-items: center;
            }

            .Home_about_image_container {
                width: 50%;
                order: 1; /* Puts the image on the left */
            }

            .Home_about_content {
                width: 50%;
                order: 2; /* Puts the text on the right */
            }
            
            .Home_about_title, .Home_about_text, .Home_about_badge, .Home_about_button {
                align-self: flex-start;
                text-align: left;
            }
        }

        @media (max-width: 991px) {
            .Home_about_section {
                text-align: center;
            }
            .Home_about_content {
                 align-items: center;
            }
        }

/* Home offer */
   /* The main section with a premium dark gradient background */
        .Home_offer_section {
            width: 100%;
            display: flex; /* Use flexbox for a two-column layout */
            flex-direction: column; /* Stacks columns on smaller screens */
            background-image: linear-gradient(135deg, #10161f, #1b242e);
            color: #ffffff;
            overflow: hidden; /* Prevents content from spilling out */
        }

        /* Animation for a smooth fade-in effect on load */
        .Home_offer_fadeInUp {
            animation: Home_offer_fadeInUp 1.2s ease-in-out;
        }

        @keyframes Home_offer_fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Container for the text content */
        .Home_offer_text_container {
            padding: 4rem 1rem;
            max-width: 64rem;
            margin: auto;
        }

        /* Styles for the main title */
        .Home_offer_title {
            font-size: 2.25rem;
            font-weight: 800;
            margin-bottom: 1rem;
            line-height: 1.25;
            color: #ffffff;
            text-align: center;
        }
        
        /* Styles for the text paragraphs */
        .Home_offer_text {
            font-size: 1.125rem;
            font-weight: 300;
            line-height: 1.625;
            color: #d1d5db;
            margin-bottom: 2rem;
            text-align: center;
        }

        /* Container for the image, making it responsive */
        .Home_offer_image_container {
            width: 100%;
            height: 300px; /* Fixed height to control its size */
            overflow: hidden;
        }

        .Home_offer_image {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures the image covers the container without distortion */
            object-position: center; /* Centers the image within the container */
        }

        /* Responsive adjustments for larger screens */
        @media (min-width: 768px) {
            .Home_offer_section {
                flex-direction: row; /* Changes to a row layout on desktop */
                min-height: 500px; /* Adjust min-height for better visual balance on desktop */
            }
            .Home_offer_text_container {
                padding: 4rem;
                text-align: left;
                width: 50%; /* Takes up half the width on desktop */
                margin: auto;
            }
            .Home_offer_title {
                font-size: 3rem;
                text-align: left;
            }
            .Home_offer_text {
                font-size: 1.125rem;
                text-align: left;
            }
            .Home_offer_image_container {
                width: 50%; /* Takes up half the width on desktop */
                height: auto; /* Height is determined by the content */
            }
        }



/* Home_offer_section */

 /* The main section with a premium dark gradient background */
        .Home_offer_section {
            width: 100%;
            display: flex; /* Use flexbox for a two-column layout */
            flex-direction: column; /* Stacks columns on smaller screens */
            background-image: linear-gradient(135deg, #10161f, #1b242e);
            color: #ffffff;
            overflow: hidden; /* Prevents content from spilling out */
                    margin-bottom: 29px;
        }

        /* Animation for a smooth fade-in effect on load */
        .Home_offer_fadeInUp {
            animation: Home_offer_fadeInUp 1.2s ease-in-out;
        }

        @keyframes Home_offer_fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Container for the text content */
        .Home_offer_text_container {
            padding: 4rem 1rem;
            max-width: 64rem;
            margin: auto;
        }

        /* Styles for the main title */
        .Home_offer_title {
            font-size: 2.25rem;
            font-weight: 800;
            margin-bottom: 1rem;
            line-height: 1.25;
            color: #ffffff;
            text-align: center;
           font-family: 'Poppins';
        }
        
        /* Styles for the text paragraphs */
        .Home_offer_text {
            font-size: 1.125rem;
            font-weight: 300;
            line-height: 1.625;
            color: #d1d5db;
            margin-bottom: 2rem;
            text-align: center;
          font-family: 'Poppins';
        }

        /* Container for the image, making it responsive */
        .Home_offer_image_container {
            width: 100%;
            height: 300px; /* Fixed height to control its size */
            overflow: hidden;
        }

        .Home_offer_image {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures the image covers the container without distortion */
            object-position: center; /* Centers the image within the container */
        }

        /* Responsive adjustments for larger screens */
        @media (min-width: 768px) {
            .Home_offer_section {
                flex-direction: row; /* Changes to a row layout on desktop */
                min-height: 500px; /* Adjust min-height for better visual balance on desktop */
            }
            .Home_offer_text_container {
                padding: 4rem;
                text-align: left;
                width: 50%; /* Takes up half the width on desktop */
                margin: auto;
            }
            .Home_offer_title {
              
                text-align: left;
            }
            .Home_offer_text {
                font-size: 1.125rem;
                text-align: left;
                text-align : justify;
            }
            .Home_offer_image_container {
                width: 50%; /* Takes up half the width on desktop */
                height: auto; /* Height is determined by the content */
            }
        }


/* why choise US home */

 .why-choose-section {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      padding: 60px 20px;
      max-width: 1200px;
      margin: 0 auto;
      gap: 40px;
    }

    .why-choose-section img {
      width: 100%;
      max-width: 500px;
      height: auto;
      object-fit: cover;
    }

    .why-choose-content {
      flex: 1;
      min-width: 300px;
    }

    .why-choose-content h5 {
      color: black;
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 1px;
      margin-bottom: 10px;
      font-family: "Poppins";
      
    }

    .why-choose-content h2 {
      font-size: 32px;
      font-weight: bold;
      margin-bottom: 20px;
      color: #111;
          font-family: "Poppins";
    }

    .why-choose-content p {
      font-size: 16px;
      margin-bottom: 20px;
      color: #444;
    }

    .why-choose-list {
      list-style: none;
    }

    .why-choose-list li {
      display: flex;
      align-items: flex-start;
      margin-bottom: 15px;
      font-size: 15px;
      color: #333;
      text-align: justify;
    }

    .why-choose-list li span {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 22px;
      height: 22px;
      background: #ffcc00;
      color: #000;
      font-weight: bold;
      margin-right: 10px;
      flex-shrink: 0;
    }

    @media (max-width: 768px) {
      .why-choose-section {
        flex-direction: column;
        text-align: left;
      }

      .why-choose-content h2 {
        font-size: 26px;
      }
    }
    
    
    
    
    






/* about page Xtragen fully complies with Government Regulations and Qualification Criteria
*/

     /* --- Heading banner container --- */
        /* This container places the heading at the top, separate from the slider. */
        .about_page_heading_banner {
            width: 100%;
  
      
            color: #fff;
            text-align: center;
            padding: 1.5rem 1rem;
           
        }

        /* --- Heading styling --- */
       .about_page_heading
 {
    font-size: 2.25rem;
    font-weight: 800;
    line-height: 1.2;
    color: black;
    margin: 0;

    max-width: 1200px;
    align-items: center;
    justify-content: center;
    margin-inline: auto;
}

        /* --- Main slider container --- */
        /* This padding-bottom trick makes the container responsive and maintains a 16:9 aspect ratio. */
     .about_page_slider_wrapper {
    position: relative;
    /* width: 90%; */
    /* max-width: 1200px; */
    margin: 0 auto;
    border-radius: 12px;
    /* overflow: hidden; */
    height: 0;
    padding-bottom: 43.25%;
    wiidth: auto;
}
        
        /* Inner container with relative positioning for slides */
        .about_page_slider {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        /* --- Individual slider slides --- */
        .about_page_slider_slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 0.6s ease-in-out;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .about_page_slider_slide.active {
            opacity: 1;
        }

        .about_page_slider_slide img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            border-radius: 12px;
        }

        /* --- Navigation arrows --- */
        .about_page_slider_arrow {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            z-index: 10;
            width: 45px;
            height: 45px;
            background-color: rgba(255, 255, 255, 0.5);
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: background-color 0.3s, transform 0.3s;
            font-size: 24px;
            color: #333;
            border: none;
            outline: none;
        }

        .about_page_slider_arrow:hover {
            background-color: rgba(255, 255, 255, 0.8);
            transform: translateY(-50%) scale(1.1);
        }

        .about_page_slider_arrow_left {
            left: 20px;
        }

        .about_page_slider_arrow_right {
            right: 20px;
        }

        /* --- Dots container --- */
        .about_page_slider_dots_container {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 12px;
        }

        .about_page_slider_dot {
            width: 14px;
            height: 14px;
            background-color: rgba(255, 255, 255, 0.6);
            border-radius: 50%;
            cursor: pointer;
            transition: background-color 0.3s, transform 0.3s;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        }

        .about_page_slider_dot:hover {
            transform: scale(1.2);
        }

        .about_page_slider_dot.active {
            background-color: #fff;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        /* --- Media queries for responsiveness --- */
        /* These media queries adjust sizes for different screen widths. */
        @media (max-width: 768px) {
            .about_page_slider_wrapper {
                width: 95vw;
                height: auto;
            }
            .about_page_slider_arrow {
                width: 40px;
                height: 40px;
                font-size: 20px;
            }
            .about_page_slider_arrow_left { left: 10px; }
            .about_page_slider_arrow_right { right: 10px; }
            .about_page_slider_dot {
                width: 12px;
                height: 12px;
            }
        }
        
        @media (max-width: 480px) {
            .about_page_slider_wrapper {
                width: 100vw;
                height: auto;
                margin: 0;
                border-radius: 0;
            }
            .about_page_slider_slide img {
                height: 100%;
                max-height: 80vh; 
            }
            .about_page_slider_arrow {
                width: 35px;
                height: 35px;
                font-size: 18px;
            }
               .about_page_heading {
            font-size: 1.25rem;
            font-weight: 800;
            line-height: 1.2;
            color: black;
            margin: 0;
            align-items: center;
            justify-content: center;
        }

        }



/* Looking for Distribution / Reselling Operations in India?
*/

 

        .about_page_code-main-container {
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            background-image: linear-gradient(135deg, #10161f, #1b242e);
            align-items: center;
            box-sizing: border-box;
            margin: auto;
        }

        .about_page_code-text-container,
        .about_page_code-image-container {
            width: 100%;
        }

        .about_page_code-text-container {
           background-image: linear-gradient(135deg, #10161f, #1b242e);
            color: white;
            padding: 2rem;
            box-sizing: border-box;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .about_page_code-text-container h1 {
            font-size: 2.5rem;
            font-weight: 700;
            line-height: 1.2;
            margin-bottom: 1rem;
            color: white;
            text-align: center;
        }
        
        .about_page_code-text-container p {
            font-size: 1.5rem;
            font-weight: 600;
            line-height: 1.6;
            color: white;
        }

        .about_page_code-image-container {
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .about_page_code-image-container img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        @media (min-width: 768px) {
            .about_page_code-main-container {
                flex-direction: row;
                min-height: 400px;
                height: 100%;
                align-items: stretch;
            }

            .about_page_code-text-container,
            .about_page_code-image-container {
                width: 50%;
            }

            .about_page_code-text-container h1 {
                font-size: 2rem;
            }
            
            .about_page_code-text-container p {
                font-size: 3rem;
            }
        }


/* about_page_product_stafe_something*/


  .about_product_service_container {
      max-width: 1200px;
      margin: 0 auto;
      padding: 2rem 1rem;
    }
    .about_product_service_header_h1 ,    .about_product_service_header_p{
        text-align: center;
            color: black;

    }
    .about_product_service_header_p{
     margin-bottom :73px;   
    }

    /* Header Section */
    .about_product_service_header {
      text-align: center;
      margin-bottom: 3rem;
    }

    .about_product_service_header h1 {
      font-size: 2.5rem;
      font-weight: 800;
      color: #1c2a42;
    }

    .about_product_service_header p {
      font-size: 1.125rem;
      color: #6c757d;
      max-width: 42rem;
      margin: 1rem auto 0;
    }

    /* Grid Layouts */
    .about_product_service_grid {
      display: grid;
      gap: 2rem;
      margin-bottom: 4rem;
    }

    /* Two-column grid for product/services */
    .products-grid {
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    /* Single-line grid for About Us */
    .single-line-grid {
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 1.5rem;
    }

    /* Card Styling */
    .about_product_service_card {
      background-color: #fff;
      border-radius: 1rem;
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
      padding: 2rem;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
    }

    .about_product_service_card:hover {
      transform: translateY(-8px);
      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
    }

    .about_product_service_card h2 {
      font-size: 1.5rem;
      font-weight: 700;
      margin-bottom: 1rem;
      color: #1a202c;
    }

    .about_product_service_card p {
      color: #4a5568;
      font-size: 0.95rem;
      line-height: 1.5;
    }

    /* List Styling */
    .about_product_service_list {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .about_product_service_list li {
      position: relative;
      padding-left: 1.5rem;
      margin-bottom: 0.5rem;
      color: #5c6c80;
      font-size: 0.95rem;
      line-height: 1.5;
      list-style : none;
    }

    .about_product_service_list li::before {
      content: '\2713'; /* Checkmark */
      position: absolute;
      left: 0;
      top: 0;
      color: #4CAF50;
      font-weight: bold;
    }

    /* Icon Styling */
    .about_product_service_icon {
      font-size: 2.5rem;
      margin-bottom: 0.75rem;
      display: inline-block;
      background: -webkit-linear-gradient(45deg, #4CAF50, #2196F3);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    /* Gradient Variations */
    .staff-icon { background: -webkit-linear-gradient(45deg, #FF6347, #FF4500); }
    .activities-icon { background: -webkit-linear-gradient(45deg, #3cb371, #2e8b57); }
    .safety-icon { background: -webkit-linear-gradient(45deg, #4169e1, #1e90ff); }
    .experience-icon { background: -webkit-linear-gradient(45deg, #ffa500, #ff8c00); }

    .staff-icon, .activities-icon, .safety-icon, .experience-icon {
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    /* Responsive Typography */
    @media (max-width: 768px) {
      .about_product_service_header h1 {
        font-size: 2rem;
      }

      .about_product_service_header p {
        font-size: 1rem;
      }

      .about_product_service_card h2 {
        font-size: 1.25rem;
      }
    }

    @media (max-width: 480px) {
      .about_product_service_header h1 {
        font-size: 1.75rem;
      }

      .about_product_service_header p {
        font-size: 0.9rem;
      }

      .about_product_service_card {
        padding: 1.5rem;
      }
    }


/* Consulting_Services_Infographic_body */

  
        .Consulting_Services_Infographic_body {
            font-family: 'Inter', sans-serif;
            background-color: #ffffff;
            color: #4b5563; /* Equivalent to text-gray-800 */
            line-height: 1.6;
        }

        .Consulting_Services_Infographic_container {
            max-width: 1280px;
            margin: auto;
            padding: 1rem;
        }

        @media (min-width: 768px) {
            .Consulting_Services_Infographic_container {
                padding: 2rem;
            }
        }

        @media (min-width: 1024px) {
            .Consulting_Services_Infographic_container {
                padding: 3rem;
            }
        }

        .Consulting_Services_Infographic_main-content {
            display: flex;
            flex-direction: column;
            align-items: center; /* Align items to the center for mobile view */
        }

        @media (min-width: 1024px) {
            .Consulting_Services_Infographic_main-content {
                flex-direction: row;
                gap: 3rem; /* Equivalent to space-x-12 */
                align-items: flex-start; /* Reset alignment for desktop view */
            }
        }

        .Consulting_Services_Infographic_image-container, .Consulting_Services_Infographic_text-container {
            width: 100%;
            margin-bottom: 2rem;
        }

        @media (min-width: 1024px) {
            .Consulting_Services_Infographic_image-container, .Consulting_Services_Infographic_text-container {
                width: 50%;
                margin-bottom: 0;
            }
        }

        .Consulting_Services_Infographic_diagram-img {
            width: 100%;
            max-width: 600px;
            border-radius: 0.5rem; /* Equivalent to rounded-lg */
        }
        
        /* Remove shadows */
        .Consulting_Services_Infographic_diagram-img {
            box-shadow: none; 
        }

        .Consulting_Services_Infographic_heading {
            font-size:2rem; /* Equivalent to text-3xl */
            font-weight: 700;
            color: #1f2937; /* Equivalent to text-gray-900 */
            margin-bottom: 1rem;
            text-align: center; /* Center heading on mobile */
            margin-top: 38px !important;
        }

        @media (min-width: 1024px) {
            .Consulting_Services_Infographic_heading {
                text-align: left; /* Reset alignment for desktop */
            }
        }

        .Consulting_Services_Infographic_sub-heading {
            font-size: 1.5rem; /* Equivalent to text-2xl */
            font-weight: 600;
            color: #1f2937;
            margin-bottom: 1rem;
            text-align: center; /* Center subheading on mobile */
        }
        
        @media (min-width: 1024px) {
            .Consulting_Services_Infographic_sub-heading {
                font-size: 2rem; /* Equivalent to text-3xl */
                text-align: left; /* Reset alignment for desktop */
            }
        }

        .Consulting_Services_Infographic_p {
            font-size: 0.875rem; /* Equivalent to text-sm */
            color: #4b5563; /* Equivalent to text-gray-600 */
            margin-bottom: 1rem;
            text-align: justify; /* Justify text for better alignment */
        }
        
        /* Specific mobile adjustments for the text container */
        @media (max-width: 1023px) {
            .Consulting_Services_Infographic_image-container + .Consulting_Services_Infographic_text-container {
                margin-top: -2rem; /* Reduce space between image and text on smaller screens */
            }
        }

        @media (min-width: 768px) {
            .Consulting_Services_Infographic_p {
                font-size: 1rem; /* Equivalent to text-base */
            }
        }
        
        .Consulting_Services_Infographic_last-para {
            margin-bottom: 2rem;
        }

        .Consulting_Services_Infographic_contact-link {
            color: #2563eb; /* Equivalent to text-blue-600 */
            transition: color 200ms ease-in-out;
        }

        .Consulting_Services_Infographic_contact-link:hover {
            color: #1d4ed8; /* Equivalent to hover:text-blue-800 */
        }
        
        @media (min-width: 768px) {
            .Consulting_Services_Infographic_diagram-img {
                width: 100%;
                max-width: 600px;
                border-radius: 0.5rem; /* Equivalent to rounded-lg */
                margin-inline: auto;
                display: block;
            }
        }



/* Maintenance searvce */

        .Maintenance_Services_container {
            max-width: 1200px;
            margin: auto;
            padding: 3rem 1rem;
        }

        @media (min-width: 640px) {
            .Maintenance_Services_container {
                padding-left: 1.5rem;
                padding-right: 1.5rem;
            }
        }

        @media (min-width: 1024px) {
            .Maintenance_Services_container {
                padding-left: 2rem;
                padding-right: 2rem;
            }
        }

        .Maintenance_Services_header {
            text-align: center;
            margin-bottom: 3rem;
        }

        .Maintenance_Services_title {
            font-size: 1.875rem;
            font-weight: 700;
            margin-bottom: 0.5rem;
            text-align: center;
        }

        .Maintenance_Services_subtitle {
            font-size: 1.5rem;
            font-weight: 600;
            margin-bottom: 3rem;
            color: #374151;
            text-align: center;
        }

        .Maintenance_Services_text {
    font-size: 1rem;
    line-height: 1.625;
    color: #374151;
    margin-bottom: 1.5rem;
    text-align: justify;
}

        .Maintenance_Services_text.mb-12 {
            margin-bottom: 3rem;
        }

        .Maintenance_Services_image_wrapper {
            display: flex;
            justify-content: center;
            margin-top: 3rem;
        }

        .Maintenance_Services_image {
            width: 100%;
            max-width: 56rem;
            border-radius: 0.5rem;
        }

        .Maintenance_Services_contact_info {
            font-size: 1.125rem;
            line-height: 1.625;
            font-weight: 600;
            color: #1f2937;
        }

        .Maintenance_Services_link {
            color: #2563eb;
            text-decoration: none;
        }

        .Maintenance_Services_link:hover {
            text-decoration: underline;
        }


/* Manpower searvice */

     .Manpower_Services_container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 40px 20px;
        }
        
        /* Typography */
        .Manpower_Services_h1 {
            font-size: 2rem;
            font-weight: 700;
            color: #000000; /* Heading color changed to black */
            margin-bottom: 20px;
            line-height: 1.2;
        }

        .Manpower_Services_h2 {
            font-size: 2rem;
            font-weight: 700;
            color: #000000; /* Heading color changed to black */
            margin-bottom: 20px;
            line-height: 1.2;
            text-align: center;
        }

        .Manpower_Services_p {
            font-size: 1rem;
            margin-bottom: 15px;
            color: #555555;
            text-align: justify;
        }

        /* Hero Section - Flexbox for responsive layout */
        .Manpower_Services_hero_section {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 40px; /* Space between content and image */
            margin-bottom: 60px;
        }
        
        .Manpower_Services_hero_content {
            flex: 1;
            max-width: 600px;
            order: 2; /* Default order for mobile */
        }

        .Manpower_Services_image_container {
            flex: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            order: 1; /* Default order for mobile */
        }

        /* Infographic Image */
        .Manpower_Services_infographic_img {
            max-width: 100%;
            height: auto;
            display: block;
            border-radius: 10px; /* Keep a subtle rounded corner for a modern look */
        }
        
        /* Contact Section */
        .Manpower_Services_contact_section {
            padding-top: 40px;
            border-top: 1px solid #e0e0e0;
            text-align: center;
        }

        .Manpower_Services_contact_info {
            font-size: 1rem;
            color: #666;
            margin-top: 20px;
        }

        .Manpower_Services_contact_info a {
            color: #1A237E;
            text-decoration: none;
            font-weight: bold;
        }

        .Manpower_Services_contact_info a:hover {
            text-decoration: underline;
        }

        /* Responsive Design */
        @media (min-width: 768px) {
            .Manpower_Services_hero_section {
                flex-direction: row;
                justify-content: center;
                align-items: center;
            }

            .Manpower_Services_hero_content {
                padding-left: 40px;
                order: 2;
            }

            .Manpower_Services_image_container {
                order: 1;
            }

            .Manpower_Services_h1 {
                font-size: 2rem;
            }

            .Manpower_Services_h2 {
                text-align: left;
                font-size: 2rem;
            }

               .Manpower_Services_contact_section {
  
    
        margin-inline: auto;
        DISPLAY: FLEX;
        ALIGN-ITEMS: CENTER;
        JUSTIFY-CONTENT: CENTER;
        FLEX-WRAP: WRAP;
    }
        }






























































/* -- A more refined and modern style for the product cards -- */

.card {
  background: #ffffff !important;
  border-radius: 16px !important; /* Slightly smaller radius for a sharper look */
  overflow: hidden !important;
  /* Multi-layered shadow for a softer, more realistic depth */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.04), 0 10px 20px rgba(0, 0, 0, 0.08) !important;
  /* Smoother, custom transition curve */
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  padding: 24px !important; /* Uniform padding */
  text-align: center !important;
  border: 1px solid #f0f0f0 !important;
  position: relative !important;
}

.card:hover {
  transform: translateY(-8px) scale(1.02) !important; /* A more pronounced but smooth lift */
  /* Enhanced shadow on hover for a clear "active" state */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.06), 0 20px 40px rgba(0, 0, 0, 0.12) !important;
  border-color: #e0e0e0 !important; /* Subtle border highlight on hover */
  z-index: 2 !important;
}

.card img {
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  margin-bottom: 24px !important; /* Increased space between image and title */
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  /* A more subtle drop-shadow just for the image */
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.1)) !important;
}

.card:hover img {
  transform: scale(1.05) !important; /* A slightly more subtle image zoom */
}

.card-title {
  font-size: 1.15rem !important; /* Slightly smaller for a cleaner look */
  font-weight: 600 !important;
  color: #222222 !important; /* Softer black for easier reading */
  margin-bottom: 8px !important; /* Tighter spacing with the text below */
  line-height: 1.4 !important;
  /* Modern system font stack for better rendering */
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif !important;
}

.card-text {
  font-size: 0.9rem !important;
  color: #666666 !important; /* Lighter grey for clear hierarchy */
  line-height: 1.6 !important;
  font-weight: 400 !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif !important;
}





















html, body {
  height: 100%;
  margin: 0;
}


.single-variation-wrap{
  display : none ;
}
.nav{
  display : none ;
}

.bb-product-meta{
 display : none ;

}
.bb-product-price{
  display : none !important;
}
.bb-product-rating , .product-rating-icon , .product-rating-text , .product-add-cart-btn-large-wrapper{
  display : none !important;
}

















.sumo-heading {
    font-size: 30px !important;
    font-weight: 700;
    color: #03023d !important;
    text-align: center;
    margin-bottom: 8px;
}
.split-line {
   
    text-align: center;
    position: relative;
    display: none !important;
}
  
.tg-header__area-four .tgmenu__wrap {
    background: none !important;
 border: none !important ;
    border-radius:none !important ; 
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
   box-shadow: none !important;
}
.show-admin-bar .offCanvas__info, .show-admin-bar .sticky-menu, .show-admin-bar .tgmobile__menu {
    top: 40px;
    border-bottom: 1px solid #d6c7c7 !important;
}

.breadcrumb__area .breadcrumb-item+.breadcrumb-item:before
{
  display : none;
}
.tgmenu__main-menu li.menu-item-has-children>a:after {
    color: var(--tg-color-dark-blue);
    content: "ï„‡";
    font-family: var(--tg-icon-font-family);
    font-weight: 700;
    margin-inline-start: 8px;
    transition: all .3s ease-out 0s;
}


 
.slider__bg  {
  
 mix-blend-mode: normal !important;
  
}
/* product page whatsapp number */
     .xtra-contact-section {
    display: flex;
    justify-content: center;
    padding: 30px 15px;
  }

  .xtra-contact-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
  }

  .xtra-contact-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
    padding: 16px 14px;
    max-width: 220px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-left: 4px solid transparent;
    font-family: 'Inter', sans-serif;
  }

  .xtra-contact-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  }

  .xtra-contact-card.whatsapp {
    border-left-color: #25D366;
  }

  .xtra-contact-card.email {
    border-left-color: #007bff;
  }

  .xtra-icon img {
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
  }

  .xtra-contact-title {
    font-size: 1rem;
    color: #002f5b;
    margin-bottom: 5px;
    font-weight: 600;
  }

  .xtra-contact-text {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 12px;
  }

  .xtra-button {
    display: inline-block;
    padding: 7px 18px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #fff;
    text-decoration: none;
    transition: background-color 0.3s ease;
  }

  .xtra-button.green {
    background-color: #25D366;
  }

  .xtra-button.green:hover {
    background-color: #1eb858;
    color : white;
    
  }

  .xtra-button.blue {
    background-color: #007bff;
        color : white;
  }

  .xtra-button.blue:hover {
    background-color: #006ae6;
        color : white;
  }

@media (max-width: 600px) {
    .xtra-contact-wrapper {
        flex-direction: row;
        align-items: center;
        display: flex;
        flex-wrap: nowrap;
    }
}








.slick-slide img {
  display: block !important;
  width: 100% !important;
  object-fit: cover !important;
  border-radius: 18px !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  margin: 0 auto !important;
}

.slick-slide img:hover {
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.15) !important;
}











  /* Certification section styling */
  .xtragen-certification {
  
    padding: 20px 20px;
    text-align: center;
  }

  .xtragen-certification-header h2 {
    background-color: #002b5b;
    color: #fff;
    display: inline-block;
    padding: 12px 24px;
    font-size: 22px;
    border-radius: 6px;
   
  }



  @media screen and (max-width: 600px) {
    .xtragen-about-card {
      padding: 20px;
    }

    .xtragen-certification-header h2 {
      font-size: 18px;
      padding: 10px 16px;
    }
  }




.ck-content img.image_resized , .ck-content .image img {

 max-hight:500px;
  border-radius: 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}


/* Who we are */ 
/* WHO ARE WE SECTION */
/* General reset for the body */
 .about-section {
 
  max-width: 1300px;
  margin: 40px auto;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  border-radius: 16px;
}

about-section {
    /* padding: 30px; */
    max-width: 1300px;
    margin: 40px auto;
    /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); */
    border-radius: 16px;
    /* background: linear-gradient(139deg, #ffffff 30%, #e6f0ff 100%) !important; */
    /* color: #e2e2e2; */
    background: red !important;
}




.about-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.about-text {
  width: 100%;
}

.about-text h2 {
  font-size: 2.5rem;
  color: #003366;
  margin-bottom: 20px;
  margin:10px;
}

.about-text p {
  line-height: 1.7;
  font-size: 1rem;
  margin-bottom: 20px;
}

.about-highlights {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}

.about-highlights li {
  font-size: 1rem;
  font-weight: 600;
  background: #f0f7ff;
  padding: 10px 16px;
  border-radius: 10px;
  color: #003366;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.about-highlights li::before {
  content: '\2714';
  color: green;
  font-weight: bold;
  margin-right: 8px;
}

.about-logos {
  width: 100%;
  text-align: center; /* ðŸ‘ˆ Center the image */
}

.about-logos img {
    width: 100%;
    max-width: 620px;
    border-radius: 12px;
    /* box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15); */
    margin-top: 30px;
    border: 1px solid #aeaaaa;
}

@media (max-width: 768px) {
  .about-text h2 {
    font-size: 2rem;
  }

  .about-highlights {
    flex-direction: column;
    align-items: flex-start;
  }
}














/*man power css code */


/* General reset for the body */


/* Manpower & Support Section Styling */
.support-section {
  background: #ffffff;  /* White background for the section */
  padding: 60px 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);  /* Add subtle shadow */
  border-radius : 18px;
  margin-bottom : 20px;
  margin-top : 20px;
}

/* Container for both text and image */
.support-container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 40px;
}

/* Text styling */
.support-text {
  flex: 1 1 500px;
  padding: 40px;
}

.support-text h1 {
  font-size: 2.5rem;
  color: #003366;
  margin-bottom: 20px;
}

.support-text p {
  line-height: 1.7;
  font-size: 1rem;
  margin-bottom: 20px;
}

.support-text ul {
  list-style-type: disc;
  margin-left: 20px;
}

.contact-info {
  background: #e1f1fc;
  padding: 20px;
  border-radius: 10px;
  margin-top: 25px;
  font-weight: bold;
  color: #005baa;
  font-size: 1rem;
}

.support-image {
  flex: 1 1 500px;
  text-align: center;
}

.support-image img {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

@media (max-width: 768px) {
  .support-container {
    flex-direction: column;
    padding: 40px 15px;
  }
  .support-text h1 {
    font-size: 2rem;
  }
  .support-text {
  padding : 5px;
    
  }
  
}

















/* about section page */




/* About Section Container */
.about-sections {
    width: 100%;
    max-width: 1105px;
  margin:auto;
  
}

.about-container {
    background: linear-gradient(135deg, #ffffff 0%, #f7f9fc 100%);
    border-radius: 16px;
    /* box-shadow: 0 10px 30px rgba(0, 51, 102, 0.1); */
    padding: 40px 50px;
    text-align: center;
    border: 1px solid #e6e9ee;
    background: linear-gradient(135deg, #ffffff 30%, #e6f0ff 100%);
}

/* Header & Logo Styling */
.about-header {
    margin-bottom: 30px;
}

.company-logo {
    max-width: 150px;
    height: auto;
    margin-bottom: 20px;
    transition: transform 0.3s ease;
}

.company-logo:hover {
    transform: scale(1.1);
}

.about-container h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: #003366; /* A deep, professional blue */
    margin: 0;
}

.tagline {
    font-size: 1.1rem;
    font-weight: 400;
    color: #5c7a99;
    margin-top: 8px;
}

/* Main Content Layout */
.about-content {
    display: flex;
    justify-content: space-between;
    text-align: left;
    gap: 40px;
}

.content-column {
    flex: 1;
    min-width: 300px;
}

.about-content p {
    font-size: 1rem;
    line-height: 1.8;
    color: #444;
    margin-bottom: 20px;
}

.about-content p strong {
    color: #003366;
    font-weight: 600;
}

/* Core Values List Styling */
.content-column h3 {
    font-size: 1.4rem;
    font-weight: 600;
    color: #003366;
    margin-bottom: 15px;
    border-left: 4px solid #0055a4;
    padding-left: 10px;
}

.content-column ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.content-column ul li {
    font-size: 1rem;
    line-height: 1.7;
    color: #444;
    margin-bottom: 12px;
    padding-left: 25px;
    position: relative;
}

/* Custom bullet points for the list */
.content-column ul li::before {
    content: 'âœ”'; /* You can use other symbols like âœ“, â€¢, âž¤ */
    position: absolute;
    left: 0;
    top: 0;
    color: #0055a4; /* A vibrant blue */
    font-weight: bold;
}

/* Responsive Design for smaller screens */
@media (max-width: 992px) {
    .about-content {
        flex-direction: column;
        gap: 20px;
    }
    
    .about-container {
        padding: 30px 35px;
    }

    .about-container h2 {
        font-size: 2rem;
    }
}

@media (max-width: 576px) {
    .about-container {
        padding: 25px 20px;
    }

    .about-container h2 {
        font-size: 1.8rem;
    }

    .tagline {
        font-size: 1rem;
    }
    
    .content-column {
        min-width: 100%;
    }
}









/* whats we offer */


    .sumo_section {
      width: 100%;
    }

  .sumo_banner {
    /* background: linear-gradient(rgba(3, 2, 61, 0.8), rgba(3, 2, 61, 0.9)), url(...); */
    background-size: cover;
    background-position: center;
    color: white;
    text-align: center;
    padding: 60px 20px 40px;
    background: linear-gradient(rgb(4 3 59 / 80%), rgb(2 1 55 / 90%)), url(https://source.unsplash.com/1600x500/?technology,defense);
}

  .sumo_banner h2 {
    font-size: 2.5rem;
    margin-bottom: 12px;
    color: white;
}



    .sumo_banner .underline {
      width: 60px;
      height: 4px;
      background-color: #ffc107;
      margin: 0 auto 16px;
      border-radius: 2px;
    }

    .sumo_banner p {
    max-width: 900px;
    margin: 10px auto;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #ffffff;
}

    .sumo_titlebar {
      text-align: center;
      padding: 40px 20px 10px;
    }

    .sumo_titlebar h3 {
      font-size: 1.6rem;
      font-weight: 600;
      color: #03023d;
    }

    .sumo_poster {
      display: flex;
      justify-content: center;
      padding: 30px 15px 60px;
    }

    .sumo_poster img {
      max-width: 90%;
      width: 1200px;
      height: auto;
      border-radius: 12px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
    }

    @media (max-width: 768px) {
      .sumo_banner h2 {
        font-size: 2rem;
      }
      .sumo_titlebar h3 {
        font-size: 1.3rem;
      }
    }































/* home slide images */
/* Reset and base styles */
 



/* Container and layout */
.xtech-container {
    max-width: 1440px; /* Wider container for more items in view */
    margin: 0 auto;
    padding: 0 40px; /* Increased padding for more breathing room */
    width: 100%;
}

.xtech-offerings-section {
    min-height: 100vh;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start; 
    padding: 80px 0; 
    position: relative;
    overflow: hidden;
    background: #f5f5f7; 
}

/* Section header */
.xtech-section-header {
    text-align: left; 
    margin-bottom: 60px; /* Increased margin for better separation */
    position: relative;
    z-index: 1;
    padding-left: 0; /* Remove padding here, handled by container */
}

.xtech-section-title {
    font-size: clamp(2.8rem, 5vw, 3.8rem); 
    font-weight: 700; 
    margin-bottom: 15px; 
    color: #1d1d1f; /* Dark text for title */
    text-align: left; 
    position: relative;
    letter-spacing: -0.03em; 
}

.xtech-section-title::after {
    content: none; /* No underline for a cleaner look */
}

.xtech-section-subtitle {
    font-size: 1.2rem; 
    color: #6e6e73; /* Medium grey for subtitle */
    max-width: 700px; 
    margin: 0; 
    font-weight: 400;
    line-height: 1.5; 
}

/* Slider wrapper */
.xtech-slider-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

/* Slider navigation buttons */
.xtech-slider-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    z-index: 10;
    transition: all 0.2s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

.xtech-slider-button:hover {
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    transform: translateY(-50%) scale(1.05);
}

.xtech-slider-button:active {
    transform: translateY(-50%) scale(0.95);
}

.xtech-slider-button-left {
    left: 10px;
}

.xtech-slider-button-right {
    right: 10px;
}

.xtech-slider-button::before {
    content: '';
    width: 12px;
    height: 12px;
    border: 2px solid #1d1d1f;
    border-right: none;
    border-bottom: none;
    transform: rotate(-45deg);
}

.xtech-slider-button-right::before {
    transform: rotate(135deg);
}

/* Slider layout */
.xtech-offerings-grid {
    display: flex; 
    overflow-x: scroll; 
    -webkit-overflow-scrolling: touch; 
    scroll-snap-type: x mandatory; 
    gap: 24px; /* Refined gap between items */
    padding: 0 0; /* Remove padding here, handled by individual items */
    padding-bottom: 20px; 
    width: 100%;
    box-sizing: border-box;
    scroll-behavior: smooth; /* Smooth scrolling */
}

.xtech-offerings-grid::-webkit-scrollbar {
    height: 8px;
}

.xtech-offerings-grid::-webkit-scrollbar-track {
    background: #e0e0e0;
    border-radius: 10px;
}

.xtech-offerings-grid::-webkit-scrollbar-thumb {
    background: #888888;
    border-radius: 10px;
}

.xtech-offerings-grid::-webkit-scrollbar-thumb:hover {
    background: #555555;
}

/* Slider Item styles */
.xtech-offering-item {
    flex: 0 0 auto; 
    width: 360px; /* Wider items for more content space */
    background: #ffffff; 
    border-radius: 16px; /* More rounded corners */
    padding: 32px; 
    position: relative;
    transition: all 0.2s ease-in-out; /* Faster, snappier transition */
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08); /* Very subtle shadow */
    display: flex;
    flex-direction: column;
    align-items: flex-start; 
    text-align: left; 
    scroll-snap-align: start; 
    margin-left: 0; /* Reset margin */
    user-select: none; /* Prevent text selection during drag */
}

.xtech-offering-item:first-child {
    margin-left: 40px; /* Align first item with container padding */
}

.xtech-offering-item:last-child {
    margin-right: 40px; /* Ensure last item has space */
}

.xtech-offering-item::before {
    content: none; /* No accent line */
}

.xtech-offering-item:hover {
    transform: translateY(-3px); /* Very subtle lift effect */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Slightly stronger shadow on hover */
}

.xtech-offering-item:hover .xtech-item-icon {
    color: #0071e3; /* Apple blue on hover */
    transform: scale(1.02); /* Very subtle scale on hover */
}

.xtech-offering-item:hover .xtech-item-title {
    color: #0071e3; /* Apple blue title on hover */
}

/* Item icon */
.xtech-item-icon {
    width: 48px; 
    height: 48px; 
    margin-bottom: 20px; 
    color: #1d1d1f; /* Dark icon color */
    transition: all 0.2s ease-in-out;
    position: relative;
    z-index: 2;
}

.xtech-item-icon svg {
    width: 100%;
    height: 100%;
}

/* Item content */
.xtech-item-title {
    font-size: 1.5rem; 
    font-weight: 600; 
    margin-bottom: 8px; /* Tighter spacing */
    color: #1d1d1f; /* Dark text color */
    position: relative;
    z-index: 2;
    transition: color 0.2s ease;
}

.xtech-item-description {
    font-size: 1rem; 
    color: #6e6e73; /* Medium grey for description */
    line-height: 1.4; 
    position: relative;
    z-index: 2;
    transition: color 0.2s ease;
}

/* Responsive design */
@media (max-width: 768px) {
    .xtech-offerings-section {
        padding: 40px 0;
    }
    
    .xtech-container {
        padding: 0 20px;
    }
    
    .xtech-section-header {
        margin-bottom: 40px;
        padding-left: 0;
    }
    
    .xtech-section-title {
        font-size: 2.2rem;
    }
    
    .xtech-section-subtitle {
        font-size: 1rem;
    }
    
    .xtech-slider-button {
        width: 40px;
        height: 40px;
    }
    
    .xtech-slider-button::before {
        width: 10px;
        height: 10px;
    }
    
    .xtech-slider-button-left {
        left: 5px;
    }
    
    .xtech-slider-button-right {
        right: 5px;
    }
    
    .xtech-offerings-grid {
        padding: 0 0;
        gap: 16px;
    }
    
    .xtech-offering-item {
        width: 280px; 
        padding: 24px;
    }
    
    .xtech-offering-item:first-child {
        margin-left: 20px; 
    }
    
    .xtech-offering-item:last-child {
        margin-right: 20px; 
    }
    
    .xtech-item-icon {
        width: 40px;
        height: 40px;
        margin-bottom: 16px;
    }
    
    .xtech-item-title {
        font-size: 1.3rem;
    }
    
    .xtech-item-description {
        font-size: 0.9rem;
    }
}

/* Accessibility improvements */
@media (prefers-reduced-motion: reduce) {
    .xtech-offering-item,
    .xtech-item-icon,
    .xtech-slider-button {
        transition: none;
    }
    
    .xtech-offering-item:hover {
        transform: none;
    }
    
    .xtech-offerings-grid {
        scroll-behavior: auto;
    }
}

/* Focus states for keyboard navigation */
.xtech-offering-item:focus {
    outline: 2px solid #0071e3;
    outline-offset: 2px;
}

.xtech-offering-item:focus-visible {
    outline: 2px solid #0071e3;
    outline-offset: 2px;
}

.xtech-slider-button:focus {
    outline: 2px solid #0071e3;
    outline-offset: 2px;
}

.xtech-slider-button:focus-visible {
    outline: 2px solid #0071e3;
    outline-offset: 2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .xtech-offering-item {
        border-color: #000000;
        background: #ffffff;
    }
    
    .xtech-item-title,
    .xtech-item-description {
        color: #000000;
    }
    
    .xtech-slider-button {
        background: #ffffff;
        border: 1px solid #000000;
    }
}









/*product css code */
/* Professional Technical Specifications CSS */
/* Professional Technical Specifications CSS */
/* Professional Technical Specifications CSS */

/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    color: #1e293b;
    background-color: #ffffff;
}

/* CSS Variables - Professional Design System */
:root {
    /* Core Colors */
    --primary: #eab308;
    --primary-foreground: #ffffff;
    --primary-glow: #fbbf24;
    
    --accent: #3b82f6;
    --accent-foreground: #ffffff;
    --accent-muted: #93c5fd;
    
    --background: #ffffff;
    --foreground: #1e293b;
    --surface-elevated: #f8fafc;
    --surface-glass: #f1f5f9;
    
    --muted: #f1f5f9;
    --muted-foreground: #64748b;
    --border: #e2e8f0;
    
    /* Shadows */
    --shadow-elegant: 0 20px 40px -12px rgba(234, 179, 8, 0.15);
    --shadow-glow: 0 0 40px rgba(234, 179, 8, 0.1);
    --shadow-glass: 0 8px 32px rgba(30, 41, 59, 0.08);
    --shadow-card: 0 4px 24px rgba(30, 41, 59, 0.05);
    
    /* Transitions */
    --transition-smooth: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-bounce: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

/* Main Section */
.spec-section {
    min-height: 100vh;
    background: var(--background);
    padding: 30px 24px;
    position: relative;
     overflow: hidden;
 
}

.containertech {
    max-width: 1500px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

/* Header Section */
.header-section {
    text-align: center;
    margin-bottom: 64px;
    animation: fadeInUp 0.8s ease-out;
}

.badge {
    display: inline-block;
    background: var(--surface-elevated);
    color: var(--foreground);
    padding: 8px 16px;
    border-radius: 50px;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 16px;
    border: 1px solid var(--border);
}

.main-title {
    font-size: clamp(3rem, 8vw, 6rem);
    font-weight: 700;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 24px;
    line-height: 1.1;
}

.subtitle {
    font-size: 20px;
    color: var(--muted-foreground);
    max-width: 600px;
    margin: 0 auto;
}

/* Main Grid Layout */
.main-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 32px;
    margin-bottom: 64px;
    align-items: start;
}

/* Left Column */
.left-column {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

/* Feature Cards */
.feature-card {
    background: linear-gradient(135deg, var(--surface-elevated) 0%, var(--surface-glass) 100%);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 32px;
    box-shadow: var(--shadow-glass);
    transition: var(--transition-smooth);
    animation: fadeInLeft 0.8s ease-out;
}

.feature-card:hover {
    box-shadow: var(--shadow-elegant);
    transform: translateY(-4px);
}

.card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.icon-wrapper {
    padding: 8px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.primary-icon {
    background: rgba(234, 179, 8, 0.1);
    color: var(--primary);
}

.accent-icon {
    background: rgba(59, 130, 246, 0.1);
    color: var(--accent);
}

.icon {
    width: 24px;
    height: 24px;
}

.card-titletech {
    font-size: 24px;
    font-weight: 600;
    color: var(--foreground);
}

/* Feature Lists */
.feature-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.feature-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    transition: var(--transition-smooth);
    cursor: pointer;
}

.feature-item:hover {
    background: rgba(248, 250, 252, 0.8);
    transform: translateX(4px);
}

.feature-icon {
    flex-shrink: 0;
    padding: 4px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-smooth);
}

.primary-feature {
    background: rgba(234, 179, 8, 0.2);
    color: var(--primary);
}

.accent-feature {
    background: rgba(59, 130, 246, 0.2);
    color: var(--accent);
}

.feature-item:hover .feature-icon {
    transform: scale(1.1);
    background: var(--primary);
    color: var(--primary-foreground);
}

.feature-item:hover .accent-feature {
    background: var(--accent);
    color: var(--accent-foreground);
}

.icon-small {
    width: 16px;
    height: 16px;
}

.feature-item span {
    color: var(--foreground);
    font-weight: 500;
    transition: var(--transition-smooth);
}

/* Right Column - Technical Table */
.right-column {
    animation: fadeInRight 0.8s ease-out;
}

.tech-table-card {
    background: linear-gradient(135deg, var(--surface-elevated) 0%, var(--surface-glass) 100%);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 32px;
    box-shadow: var(--shadow-glass);
    transition: var(--transition-smooth);
}

.tech-table-card:hover {
    box-shadow: var(--shadow-elegant);
}

.table-container {
    margin-top: 32px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
}

.tech-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--background);
}

.table-row {
    transition: var(--transition-smooth);
}

.table-row:hover {
    background: var(--surface-elevated);
}

.table-row:nth-child(even) {
    background: var(--muted);
}

.table-row:nth-child(even):hover {
    background: var(--surface-elevated);
}

.table-label, .table-value {
    padding: 16px 20px;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.table-label {
    font-weight: 500;
    color: black;
    width: 60%;
}

.table-value {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
    color: black !important;
    font-weight: 600;
    transition: var(--transition-smooth);
}

.table-row:hover .table-value {
    color: black;
    transform: scale(1.02);
}

/* Action buttonstech */
.action-buttonstech {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    animation: fadeInUp 1s ease-out;
}

.btntech {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 32px;
    border-radius: 12px;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); /* More pronounced transition */
    position: relative;
    overflow: hidden;
    border: 2px solid transparent; /* Initial transparent border */
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transform: translateZ(0); /* Force hardware acceleration */
}

.btntech::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1); /* Subtle overlay for shimmer */
    transform: translateX(-100%) skewX(-30deg);
    transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 1;
}

.btntech:hover::before {
    transform: translateX(100%) skewX(-30deg);
}

.btntech-primary {
    background: linear-gradient(45deg, #FFD700 0%, #FFA500 100%); /* Gold to Orange */
    color: #333;
    box-shadow: 0 5px 20px rgba(255, 165, 0, 0.4);
}

.btntech-primary:hover {
    background: linear-gradient(45deg, #FFA500 0%, #FFD700 100%);
    color: #fff;
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 8px 25px rgba(255, 165, 0, 0.6);
    border-color: #FFD700; /* Primary color border on hover */
}

.btntech-secondary {
    background: linear-gradient(45deg, #4682B4 0%, #6A5ACD 100%); /* Steel Blue to Slate Blue */
    color: #fff;
    box-shadow: 0 5px 20px rgba(70, 130, 180, 0.4);
}

.btntech-secondary:hover {
    background: linear-gradient(45deg, #6A5ACD 0%, #4682B4 100%);
    color: #fff;
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 8px 25px rgba(70, 130, 180, 0.6);
    border-color: #4682B4; /* Accent color border on hover */
}

.btntech-icon {
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease; /* Smooth icon transition */
    z-index: 2; /* Ensure icon is above shimmer */
}

.btntech-primary:hover .btntech-icon,
.btntech-secondary:hover .btntech-icon {
    transform: translateX(5px) rotate(5deg); /* Slight movement and rotation on hover */
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bounce {
    0%, 20%, 53%, 80%, 100% {
        transform: translateY(0);
    }
    40%, 43% {
        transform: translateY(-8px);
    }
    70% {
        transform: translateY(-4px);
    }
    90% {
        transform: translateY(-2px);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

@media (max-width: 768px) {
    .action-buttonstech {
        flex-direction: column;
        align-items: center;
    }
    
    .btntech {
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
}


/* Decorative Background Elements */
.decorative-bg {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
}

.floating-element {
    position: absolute;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(234, 179, 8, 0.05) 0%, rgba(59, 130, 246, 0.05) 100%);
    filter: blur(60px);
}

.floating-1 {
    width: 400px;
    height: 400px;
    top: 25%;
    left: 25%;
    animation: float 6s ease-in-out infinite;
}

.floating-2 {
    width: 400px;
    height: 400px;
    bottom: 25%;
    right: 25%;
    animation: float 6s ease-in-out infinite reverse;
    animation-delay: 3s;
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-20px);
    }
}

@keyframes glow {
    0%, 100% {
        transform: scale(1);
        filter: brightness(1);
    }
    50% {
        transform: scale(1.02);
        filter: brightness(1.1);
    }
}

@keyframes bounce {
    0%, 20%, 53%, 80%, 100% {
        transform: translateY(0);
    }
    40%, 43% {
        transform: translateY(-8px);
    }
    70% {
        transform: translateY(-4px);
    }
    90% {
        transform: translateY(-2px);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* Responsive Design */
@media (max-width: 1024px) {
    .main-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .spec-section {
        padding: 60px 16px;
    }
}

@media (max-width: 768px) {
    .feature-card,
    .tech-table-card {
        padding: 24px;
    }
    
    
    .table-label,
    .table-value {
        padding: 12px 16px;
        font-size: 14px;
    }
    
    .floating-1,
    .floating-2 {
        width: 250px;
        height: 250px;
    }
}

@media (max-width: 480px) {
    .header-section {
        margin-bottom: 48px;
    }
    
    .subtitle {
        font-size: 18px;
    }
    
    .card-titletech {
        font-size: 20px;
    }
    
    .feature-item {
        padding: 8px;
    }
}

    /* Additional styles for benefits section */
        .benefit-section {
            margin-bottom: 24px;
            padding: 16px;
            border-radius: 8px;
            background: rgba(248, 250, 252, 0.5);
            border-left: 4px solid var(--primary);
        }

        .benefit-title {
            font-size: 18px;
            font-weight: 600;
            color: var(--foreground);
            margin-bottom: 12px;
        }

        .benefit-description {
            font-size: 14px;
            line-height: 1.6;
            color: var(--muted-foreground);
            text-align: justify;
        }

        /* Fix for card title class name */
        .card-title {
            font-size: 24px;
            font-weight: 600;
            color: var(--foreground);
        }

        /* Responsive adjustments for benefits */
        @media (max-width: 768px) {
            .benefit-section {
                padding: 12px;
                margin-bottom: 16px;
            }
            
            .benefit-title {
                font-size: 16px;
            }
            
            .benefit-description {
                font-size: 13px;
            }
        }

        /* Enhanced responsive design for main grid */
        @media (max-width: 1200px) {
            .main-grid {
                grid-template-columns: 1fr 1.2fr;
            }
        }

        @media (max-width: 1024px) {
            .main-grid {
                grid-template-columns: 1fr;
                gap: 32px;
            }
            
            .left-column {
                order: 1;
            }
            
            .right-column {
                order: 2;
            }
        }

        @media (max-width: 768px) {
            .spec-section {
                padding: 40px 16px;
            }
            
            .header-section {
                margin-bottom: 40px;
            }
            
            .main-title {
                font-size: clamp(2rem, 6vw, 3.5rem);
            }
            
            .subtitle {
                font-size: 16px;
                padding: 0 8px;
            }
        }

        @media (max-width: 480px) {
            .feature-card,
            .tech-table-card {
                padding: 16px;
            }
            
            .card-title {
                font-size: 20px;
            }
            
            .table-label,
            .table-value {
                padding: 10px 12px;
                font-size: 13px;
            }
            
            .btntech {
                padding: 12px 24px;
                font-size: 16px;
            }
        }


/*  ruggud tablet informatin page CSS */
/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}



/* Container */
.manish-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* Header Styles */
.manish-product-header {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: white;
    padding: 48px 0;
    margin-bottom: 32px;
    text-align: center;
}

.manish-header-content h1 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 16px;
    letter-spacing: -0.025em;
}

.manish-header-content h2 {
    font-size: 1.25rem;
    font-weight: 500;
    margin-bottom: 24px;
    opacity: 0.9;
}

.manish-header-content p {
    font-size: 1.125rem;
    opacity: 0.8;
    max-width: 768px;
    margin: 0 auto;
    line-height: 1.7;
}

/* Main Content */
.manish-main-content {
    padding-bottom: 48px;
}

/* Specifications Grid */
.manish-specifications-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 32px;
  margin : 10px;
}

/* Large section for basic parameters */
.manish-large-section {
    grid-column: span 1;
}

/* Specification Section */
.manish-spec-section {
    background: linear-gradient(180deg, #ffffff, #f8fafc);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e2e8f0;
}

.manish-spec-header {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    padding: 18px 28px;
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Soft shadow effect */
    font-family: 'Arial', sans-serif; /* Clean, modern font */
    font-weight: 600; /* Slightly bold for better emphasis */
    color: #ffffff; /* White text for contrast */
}

.manish-spec-header h3 {
    color: white;
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0;
}

.manish-spec-content {
    padding: 24px;
}

/* Specification List */
.manish-spec-list {
    margin: 0;
}

.manish-spec-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 12px 0;
    border-bottom: 1px solid #e2e8f0;
}

.manish-spec-item:last-child {
    border-bottom: none;
}

.manish-spec-item dt {
    font-weight: 500;
    color: #64748b;
    font-size: 0.875rem;
    flex-shrink: 0;
    padding-right: 16px;
    min-width: 140px;
}

.manish-spec-item dd {
    color: #1a202c;
    font-size: 0.875rem;
    text-align: right;
    line-height: 1.5;
    margin: 0;
}

/* Footer */
.manish-footer {
    background-color: #1e293b;
    color: #cbd5e1;
    text-align: center;
    padding: 24px 0;
    margin-top: 48px;
}

.manish-footer p {
    margin: 0;
    font-size: 0.875rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .manish-container {
        padding: 0 16px;
    }
    
    .manish-product-header {
        padding: 32px 0;
    }
    
    .manish-header-content h1 {
        font-size: 2rem;
    }
    
    .manish-header-content h2 {
        font-size: 1.125rem;
    }
    
    .manish-header-content p {
        font-size: 1rem;
    }
    
    .manish-specifications-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .manish-spec-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    
    .manish-spec-item dt {
        min-width: unset;
        padding-right: 0;
    }
    
    .manish-spec-item dd {
        text-align: left;
    }
}

@media (max-width: 480px) {
    .manish-spec-content {
        padding: 16px;
    }
    
    .manish-spec-header {
        padding: 12px 16px;
    }
    
    .manish-header-content h1 {
        font-size: 1.75rem;
    }
}

/* Print Styles */
@media print {
    .manish-product-header {
        background: #2563eb !important;
        -webkit-print-color-adjust: exact;
        color-adjust: exact;
    }
    
    .manish-spec-header {
        background: #2563eb !important;
        -webkit-print-color-adjust: exact;
        color-adjust: exact;
    }
    
    .manish-spec-section {
        break-inside: avoid;
        margin-bottom: 20px;
    }
    
    .manish-footer {
        margin-top: 30px;
    }
}

/* Focus and Accessibility */
.manish-spec-section:focus-within {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Selection styling */
::selection {
    background-color: #2563eb;
    color: white;
}

::-moz-selection {
    background-color: #2563eb;
    color: white;
}













/* product line card downloade section code */




.product_line_card_PDF_download-container {
            width: 100%;
            max-width: 1352px;
            border-radius: 24px;
            overflow: hidden;
            position: relative;
            background: #1a1a1a;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
            padding: 2.5rem;
              margin-inline : 10px;
            display : flex;
            justify-content: center;
            margin : auto;
             display: flex;
            align-content: center;
            justify-content: center;
            
        }

        /* Subtle background shapes */
        .product_line_card_PDF_download-container::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            /* Consolidated background-image declaration on a single line for better formatting */
            background-image: radial-gradient(circle at 10% 10%, rgba(255, 255, 255, 0.08), transparent 18%), radial-gradient(circle at 90% 80%, rgba(255, 255, 255, 0.05), transparent 15%);
            pointer-events: none;
        }

        .product_line_card_PDF_inner-content {
            display: flex;
            gap: 11rem;
            align-items: center;
            flex-wrap: wrap;
        }

        /* Screenshots section */
        .product_line_card_PDF_screenshots-wrapper {
            flex: 1;
            max-width: 480px;
            display: flex;
            justify-content: center;
            padding-bottom: 2rem;
        }

        .product_line_card_PDF_mockup-stack {
            position: relative;
            width: 240px;
            height: 400px;
        }

        .product_line_card_PDF_mockup-card {
            position: absolute;
            width: 100%;
            height: 100%;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
            background: linear-gradient(180deg, #fff, #fafafa);
            display: flex;
            align-items: center;
            justify-content: center;
            transform-origin: center;
        }

        .product_line_card_PDF_mockup-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        .product_line_card_PDF_mockup-card.product_line_card_PDF_top {
            transform: rotate(-8deg) translate(-20px, -20px);
            z-index: 3;
        }

        .product_line_card_PDF_mockup-card.product_line_card_PDF_bottom {
            transform: rotate(6deg) translate(20px, 20px);
            z-index: 2;
        }
        
        .product_line_card_PDF_mockup-stack:hover .product_line_card_PDF_mockup-card.product_line_card_PDF_top {
            transform: rotate(-12deg) translate(-30px, -30px);
        }

        .product_line_card_PDF_mockup-stack:hover .product_line_card_PDF_mockup-card.product_line_card_PDF_bottom {
            transform: rotate(8deg) translate(30px, 30px);
        }


        .product_line_card_PDF_preview-label {
            margin-top: 1rem;
            font-weight: 600;
            color: rgba(255, 255, 255, 0.8);
            font-size: 0.9rem;
            text-align: center;
            width: 100%;
            text-shadow: 0 1px 2px rgba(0,0,0,0.2);
        }

        /* Content section */
        .product_line_card_PDF_content-meta {
            flex: 2;
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
            color: #fff;
            min-width: 300px;
        }

        .product_line_card_PDF_title {
            font-size: clamp(2rem, 4vw, 2.5rem);
            font-weight: 800;
            margin: 0;
            line-height: 1.2;
            letter-spacing: -0.5px;
            text-shadow: 0 2px 4px rgba(0,0,0,0.1);
               color : white;
        }

        .product_line_card_PDF_subtitle {
            margin: 0;
            color: rgba(255, 255, 255, 0.9);
            font-size: 1rem;
            font-weight: 500;
            max-width: 500px;
               color : white;
        }

        .product_line_card_PDF_download-button {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            padding: 1rem; /* Adjusted padding for better vertical spacing */
            border-radius: 12px;
            background: #fff;
            color: #000;
            box-shadow: 0 15px 40px rgba(15, 23, 42, 0.28), inset 0 -3px 8px rgba(255, 255, 255, 0.05);
            font-weight: 700;
            transition: transform 0.2s cubic-bezier(0.2, 0.9, 0.3, 1), box-shadow 0.2s ease, background-color 0.2s ease;
            white-space: nowrap;
        }

        .product_line_card_PDF_download-button:hover {
            transform: translateY(-4px);
            box-shadow: 0 20px 50px rgba(15, 23, 42, 0.38);
        }

        .product_line_card_PDF_download-button:active {
            transform: translateY(0);
            box-shadow: 0 10px 30px rgba(15, 23, 42, 0.2);
        }

        .product_line_card_PDF_button-icon {
            width: 48px;
            height: 48px;
            border-radius: 12px;
            display: grid;
            place-items: center;
            background: linear-gradient(180deg, #2b3646, #0f172a);
            color : white;
            margin-bottom: 0.5rem; /* Added margin for spacing */
        }

        .product_line_card_PDF_button-icon i {
            color: #fff;
            font-size: 1.4rem;
        }

        .product_line_card_PDF_button-text {
            display: flex;
            flex-direction: column;
            align-items: left;
            line-height: 1;
            font-size: 0.9rem;
            text-align: center;
          max-width : 457px;
        }

        .product_line_card_PDF_button-text .product_line_card_PDF_big-text {
            font-weight: 800;
            font-size: 1.1rem;
            margin-bottom: 4px;
        }

        .product_line_card_PDF_note {
            font-size: 0.8rem;
            color: rgba(0, 0, 0, 0.8);
        }

        /* Responsive styles */
        @media (max-width: 880px) {
            .product_line_card_PDF_download-container {
                padding: 2rem;
            }
            .product_line_card_PDF_inner-content {
                flex-direction: column;
                text-align: center;
                gap: 2rem;
            }
            .product_line_card_PDF_content-meta {
                align-items: center;
            }
            .product_line_card_PDF_screenshots-wrapper {
                flex: 0 0 auto;
                padding-bottom: 0;
            }
            .product_line_card_PDF_mockup-stack {
                width: 200px;
                height: 340px;
            }
            .product_line_card_PDF_download-button {
                justify-content: center;
            }
         
        }
         @media (max-width: 700px) {
             
                  .product_line_card_PDF_download-container {
          
             width: 100%;
            max-width: 1200px;
            border-radius: 0px;
            overflow: hidden;
            position: relative;
            background: #1a1a1a;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
            padding: 2.5rem;
            margin : auto;
      
           border-radius : 15px;
        

        }
        
        
 }



.breadcrumb__content .title

 {
    font-size: 34px !important;
    margin-bottom: 10px;
}
@media (min-width: 992px) {
    .col-lg-6
 {
        flex: 0 0 auto;
         width: auto !important;
    }
}



@media (max-width: 767.98px) {
    .tg-header__area-four
 {
       
        padding: 8px 0 !important;
    }
}

.tg-header__top-three {
    padding: 8px 0 !important;
}





@media (max-width: 992px) {
  .home_about-section {
    flex-direction: column !important;
    text-align: center !important;
    align-items: center !important;        /* Horizontally center */
    justify-content: center !important;    /* Vertically center (if height is set) */
  }

  .home_about-section > * {
    margin: 10px 0 !important;   /* spacing between inner elements */
  }
}
.Home_Market_Segments_SectionTitle{
  line-height : none !important; }

.footer__newsletter-inner form .btn {
  border : 1px solid white !important;
  
}




/* Home Slider */
   /* --- Main slider container --- */
      .Home_offer_slider_wrapper {
    position: relative;
    /* width: 90%; */
    /* max-width: 1200px; */
    /* margin: 20px auto; */
    align-items: center;
    overflow: hidden;
    height: 0;
    padding-bottom: 56.25%;
    justify-content: center;
    margin-inline: auto;
}
        
        /* Inner container with relative positioning for slides */
        .Home_offer_slider {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        /* --- Individual slider slides --- */
        .Home_offer_slider_slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 0.6s ease-in-out;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .Home_offer_slider_slide.active {
            opacity: 1;
        }

        .Home_offer_slider_slide img {
            width: 100%;
            height: 100%;
            object-fit: contain; /* यह सुनिश्चित करता है कि पूरी इमेज दिखाई दे और क्रॉप न हो */
            border-radius: 12px;
        }

        /* --- Navigation arrows --- */
        .Home_offer_slider_arrow {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            z-index: 10;
            width: 45px;
            height: 45px;
            background-color: rgba(255, 255, 255, 0.5);
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: background-color 0.3s, transform 0.3s;
            font-size: 24px;
            color: #333;
            border: none;
            outline: none;
        }

        .Home_offer_slider_arrow:hover {
            background-color: rgba(255, 255, 255, 0.8);
            transform: translateY(-50%) scale(1.1);
        }

        .Home_offer_slider_arrow_left {
            left: 20px;
        }

        .Home_offer_slider_arrow_right {
            right: 20px;
        }

        /* --- Dots container --- */
        .Home_offer_slider_dots_container {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 12px;
        }

        .Home_offer_slider_dot {
            width: 14px;
            height: 14px;
            background-color: rgba(255, 255, 255, 0.6);
            border-radius: 50%;
            cursor: pointer;
            transition: background-color 0.3s, transform 0.3s;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        }

        .Home_offer_slider_dot:hover {
            transform: scale(1.2);
        }

        .Home_offer_slider_dot.active {
            background-color: #fff;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        /* --- Media queries for responsiveness --- */
        @media (max-width: 768px) {
            .Home_offer_slider_wrapper {
                width: 95vw;
                height: auto;
            }
            .Home_offer_slider_arrow {
                width: 40px;
                height: 40px;
                font-size: 20px;
            }
            .Home_offer_slider_arrow_left { left: 10px; }
            .Home_offer_slider_arrow_right { right: 10px; }
            .Home_offer_slider_dot {
                width: 12px;
                height: 12px;
            }
        }
        
        @media (max-width: 480px) {
            .Home_offer_slider_wrapper {
                width: 100vw;
                height: auto;
                margin: 0;
                border-radius: 0;
            }
            .Home_offer_slider_slide img {
                height: 100%;
                max-height: 80vh; 
            }
            .Home_offer_slider_arrow {
                width: 35px;
                height: 35px;
                font-size: 18px;
            }
        }



/* popup */
    





/* home slider Code */
   /* Slider container styling with new class name */
        .Home_first_main_slider_container {
            width: 100%;
            position: relative;
            background-color: #000;
        }

        /* Slide image styling with new class name */
        .Home_first_main_slider_item {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            opacity: 0;
            transition: opacity 1s ease-in-out;
        }

        /* Active slide class to make the image visible */
        .Home_first_main_slider_item.active {
            opacity: 1;
        }

        /* Animation for the progress bar */
        @keyframes fill-progress {
            from {
                width: 0%;
            }
            to {
                width: 100%;
            }
        }

        /* Style for the progress bar container */
        .Home_first_main_slider_progress_bar {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 0.5rem;
            background-color: rgba(255, 255, 255, 0.3);
            z-index: 10;
        }

        /* Style for the progress bar fill line */
        .progress-fill {
            height: 100%;
            background-color: white;
            animation: fill-progress 4s linear;
        }

        /* Style for the control button container */
        .control-container {
            position: absolute;
            bottom: 3rem;
            left: 50%;
            transform: translateX(-50%);
            z-index: 20;
        }

        /* Style for the control button with blurred and transparent background */
        .control-button {
            width: 4rem;
            height: 4rem;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 2.5rem;
            color: white;
            background-color: rgba(255, 255, 255, 0.15); /* Slightly more transparent */
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            border-radius: 50%;
            border: none;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }

        .control-button:hover {
            background-color: rgba(255, 255, 255, 0.4);
        }
        
        /* ================================================= */
        /* Media Queries for Responsive Height and Centering */
        /* ================================================= */

        /* Styles for mobile devices (up to 768px) */
        @media (max-width: 768px) {
            .Home_first_main_slider_container {
                height: 329px; /* Reduces the height on mobile devices */
            }
            .control-container {
                position: absolute;
                bottom: 1rem;
                left: 50%;
                transform: translateX(-50%);
                z-index: 20;
            }
            .control-button {
                width: 3rem;
                height: 3rem;
                font-size: 2rem;
            }
        }

        /* Styles for larger devices (from 769px) */
        @media (min-width: 769px) {
            .Home_first_main_slider_container {
                height: 100vh; /* Full viewport height on larger screens */
            }
        }






































