/************
1. 1600px
************/

@media only screen and (max-width: 1600px)
{
	.container {
        width: 100% !important;
        /* max-width: 1600px !important; */
        margin: 0 auto !important;
        /* padding: 0 2rem !important; */
        overflow: hidden !important;
    }
}

/************
2. 1440px
************/

@media only screen and (max-width: 1440px)
{
	.container {
        width: 100% !important;
        max-width: 1440px !important;
        margin: 0 auto !important;
        /* padding: 0 1rem !important; */
        overflow: hidden !important;
    }
}

/* @media only screen and (width: 1440px)
{
	.feature-content {
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        gap: 9.25rem;
        margin-bottom: -100px;
    }
} */


/* --------------------
 mobile 768px
 --------------------- */


/* @media (max-width: 768px){    */
@media only screen and (max-width: 768px) {
    .col-auto {
        flex: 0 0 auto;
        width: auto;
    }

    .col-1 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-2 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-3 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-4 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-5 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-6 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-7 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-8 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-9 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-10 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-11 {
        flex: 0 0 auto;
        width: 100%;
    }

    .col-12 {
        flex: 0 0 auto;
        width: 100%;
    }
    
    section {
        margin-bottom: 10px;
    }

    .separator {
        display: none !important;
    }
    .separator1 {
        /* width: 768px; */
        /* background-image: url("Images/home/Performance_Metrics5.png"); */
        background-image: none;
        margin: 2rem 0;
    }

    /* navbar */

    /* .nav-item  {
        
    } */

    .logo {
        height: 40px;
        /* margin-right: auto; */
    }

    .navbar-nav .nav-item {
        margin-top: 40px;
        display: block;
        margin-left: 0px;
    }

    .navbar-nav .nav-item span {
        display: block;
        width: 100%;
        padding: 16px;
        padding-left: 30px;
        font-size: 18px;
        font-weight: 600;
        font-family: 'Roboto Serif', serif;
        border-bottom: 1px solid #8f8f8f;
        border-left:none
    }

    /*-----  Banner Section -----*/

    .hero-section { 
        padding-bottom: 0rem;
    }
    .hero-section {
        /* padding: 2rem 0; */
        margin: auto;
        display: block;
        max-width: 768px;
    }
    .hero-content {
        margin: 0px 20px 20px 20px;
    }
    .hero-image {
        object-fit: cover;
        height:420px;
    }
    .hero h2.banner-title {
        font-size: 42px;
        font-weight: 700;
    }
    
    .cta-button {
        width: 60%;
    }

    /*----- feature Section -----*/
   
    .feature-block {
        padding-top: 1rem;
        padding-bottom: 3rem;
    }
   
    .feature-img {
        width: 94% ;
        margin: auto;
        display: block;
    }
    .feature-block.ai-powered .feature-text, .feature-block.scalable-storage .feature-text{
        order: -1;
        margin-top: 0px;
        align-items: center;
    }
    .feature-content,
    .feature-content.reverse {
        flex-direction: column;
        align-items: center;
        gap: 4rem;
         margin-bottom: 0px;
    }
    .feature-text,
    .feature-text.right-align {
        text-align: center;
        align-items: center;
        order: -1;
        margin-top: 0px;
    }
	.feature-description.text-end{
		text-align: center !important;
	}
    /* .feature-block .feature-icon {
        display: none;
    }
    */
    .feature-block.scalable-storage {
        margin-top: 40px !important;
    }
    .feature-icon, .feature-title {
        margin-bottom: 20px;
    }
    /*----- cloud-platform-section -----*/

    .cloud-platform-section {
        margin-top: 0;
        padding-top: 0;
    }

    .feature-info h3.feature-name {
        font-size: 15px;
    }
    .cloud-platform-section .platform-title {
        font-weight: 700;
        font-size: 2rem;
    }
    .cloud-platform-section .platform-subtitle {
        font-weight: 400;
        font-size: 1rem;
    }

    .platform-block, .platform-block-01 {
        padding: 0px;
        margin: 0px;
    }
    
    .platform-content .platform-features {
        display: flex;        
        flex-direction: row;
        /* margin-top: 20px !important; */
        /* position: relative; */
    }

    .platform-content .platform-feature {
        display: block;  
        position: relative; 
        width: 100%;
        margin: 6px;
    }

    .platform-content .feature-indicator {
        display: block;  
        transform: rotate(0deg);
        margin-left: 25%;
    }
    .feature-indicator .indicator-icon{
        top: -2px;
    } 
    .platform-content .feature-name {
        margin-top: 62px;
    }
    .platform-content .feature-desc  {
        font-size: 14px;
    }
    .feature-desc-mobile {
        display: block;
    }
    .feature-desc{
        display: none;
    }
    .platform-block .platform-content .platform-showcase {
        background-image:none;
        margin: 0;
        padding: 0;
    }

    .platform-showcase .showcase-content{
        display: flex;
        flex-direction: column;
        padding: 14px;
    }
    .platform-showcase .showcase-content .showcase-desc {
        font-size: 14px;
    }

    .gpu-image, .cloud-image {
        align-items: center;
        object-fit: cover;
    }
    /*----- performance-metrics -----*/

    .performance-metrics {
        margin: 0;
        padding: 0  ;
        display: block  ;
    } 

    .cta-bg-img-mm {
        display: block;
        width: 100%;
        margin: auto;
    }
    .anim-banner {
        min-height: 270px;
        order: -1;
    }
    .cta-content {
        margin-bottom: 30px;
    }
    .cta-content br {
        display: none;
    }
     /*----- Footer -----*/

    .footer {
        margin: 10px;
    }
    .footer .social-links {
        order: 1;
        align-items: center;
        display: none;
    }
    .footer .footer-section {
        margin-bottom : 1rem;
    }
    .social-links-mm {
        display: block;
        padding: 40px 10px 40px 10px;
    }
    .social-icon {
        margin-left: 10px;
    }

    /* about us */

    .about-us h2, .about-us h2 span {
        font-size: 28px;
        margin-top: 20px;
        line-height: 1.5em;
        text-align: left;
        font-weight: 600;
        justify-content: left;
    }
    .about-us h2 span.thin-text {
        color:#8f8f8f;
        font-size: 28px;
        font-style: normal;
        font-weight: 200;
    }
    .about-img h2 {
         font-size: 36px;
    }
    .about-us .about-img img {
        margin-top: 20px;
        object-fit: cover;
        height: 200px;
    }

    
    .expertise {
        margin: 40px 0px 20px 0px;
    }
    .expertise h2 {
        margin-bottom: 18px;
    }

    .sec-list ul {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;   
        
    }

    .sec-list ul li {
        font-size: 20px;
        color:#E5E5E5;
    }


    .vision {
        margin: 40px 0px 20px 0px;  
    }

    .vision p {
        line-height: 2em;
        font-size: 20px;
        color: #E5E5E5;
        margin-right: 10px;
    }

    .team h2.team-title {
        text-align: center;
        font-weight: 400;
        font-size: 34px;
    }


    /* Solutions */

    .hero .hero-img {
        width: 75%;
        margin: auto;
        display: block;
    }
    .top-banner-menu {
        display: block  ;
    }

    .features .key-img img {
        width: 100%;
        padding-bottom: 40px;
    }

    .solutions .content, .demand .content {
        padding: 40px;
    }
    .btn-get-started {
        margin-bottom: 40px;
        border: none;
    }
    a {
        border: none;
    }
    .solutions h2.title {
        margin: 10px 0px 20px 0px;

    }
    section.benifits {
        margin-top:40px ;
    }


    /* Ai Infra */

    .hero.infra .col-2 {
        display: none;
    } 
    .hero.infra .col-6 {
        margin-bottom: 40px;
    } 
    
    .infra h2.banner-title, .whyuse h2.title {
        font-size: 36px;
        padding-left: 20px;
        text-align: center;
    }

    .infra .hero-image {
        object-fit: cover;
        height: 324px;      
    }
    .aiinfra .footer-banner {
        padding: 40px;
    }

    .footer-banner h2.banner-title {
        font-size: 32px;
    }
    

    /* contact */
    .contact-info h2 {
        font-size: 18px;
    }
    .contact .left-content , .contact-info{
        padding: 20px;
    }
    .contact .right-content {
        margin-top: 36px;
         padding: 20px;
    }
}


/* --------------------
 1024 min
 --------------------- */

@media (min-width: 1024px) {
    
    .logo {
        height: 60px !important;
    }
    .navbar-nav .nav-item {
        margin-left: 30px;
    }
    .separator {
        display: none !important;
    }
    .hero-content {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        gap: 2rem;
        margin-bottom: 2rem;
        /* margin: 0px 80px 40px 80px; */
    }
    .hero h2.banner-title {
        font-size: 42px;
    }
    .platform-content .platform-features {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        margin-bottom: 2rem;
        padding-top: 120px;
        margin-left: 20px;

    }

    .container {
        width: 100%;
        /* max-width: 1024px; */
        padding: 0 62px;
    }


    .hero-title {
        font-size: 3rem;
        line-height: 88px;
    }



    .hero-banner {
        height: auto;
    }


    .feature-block {
        padding-top: 2.5rem;
        padding-bottom: 3.25rem;
    }

   
    .arrow-decoration {
        top: -3.75rem;
    }

    .feature-arrow {
        width: 100px;
    }


    .feature-content, .feature-content.reverse {
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        gap: 9.25rem;
        margin-bottom: 0px;
    }
 
    .feature-text {
        width: 610px;
        order: 1;
        margin-top: 0px;
    }

    .feature-description {
        font-size: 1.5rem;
        line-height: 2;
    }


    .feature-image {
        width: 480px;
        height: 491px;
        order: 2;
    }


    .separator {
        margin: 3rem 0;
        display: none;
    }


    /* .cloud-platform-section {
        padding-top: 0.25rem;
    } */

    /* .platform-block {
        margin-bottom: 8rem;    
    }
    .platform-block-01 {
        margin-bottom: 8rem;
    } */

    .feature-title {
        font-size: 3rem;
        line-height: 52px;
    }
    .platform-subtitle {
        font-size: 1.3rem;
        line-height: 1.5;
        width: 80%;
    }

    .platform-content {
        flex-direction: row;
        gap: 3rem;
        margin: auto;
    }


    .platform-feature {
        width: 334px;
    }



    .feature-indicator {
        display: block;
    }


    .feature-info {
        margin-left: 65px;
    }


    .feature-name {
        width: 239px;
    }

    .feature-desc {
        width: 264px;
    }


    .platform-showcase {
        flex-direction: row;
        align-items: flex-start;
        gap: 0.625rem;
        margin-left: auto;
    }


    .platform-block-01 .showcase-content {
        flex-direction: row;
        align-items: flex-start;
        gap: 2rem;
    }


    .showcase-image {
        width: 233px;
        height: 233px;
    }


    /* .showcase-info {
        width: 80%;
    } */


    /* .showcase-desc { */
        /* width: 285px; */
    /* } */

    .gpu-models-list {
        position: absolute;
        /* top: 309px; */
        left: 423px;
        width: 180px;
    }


    .performance-metrics {
        padding-top: 0.875rem;
        display: block;
        margin: auto;
        margin-left: 20px   ;
    }


    .metric-card {
        width: auto;
        height: 242px;
        padding: 2rem;
    }
    /* .metric-value {
        font-size: 3rem;
        line-height: 2.5rem;
    } */

    .metric-chart {
        max-width: none;
    }

    /* .trusted-section {
        gap: 3.25rem;
        padding: 9.125rem 0;
    } */


    .metrics-grid {
        gap: 0;
        margin: auto;
    }

    .metrics-title {
        font-size: 3rem;
        line-height: 2.5rem;
        height: 5rem;
        padding-bottom: 30px;
    }

    .trusted-title {
        font-size: 3rem;
        line-height: 52px;
        margin-bottom: 36px;
    }

    .companies-grid {
        gap: 2.5rem;
    }

    .company-item {
        width: 200px;
    }

    .company-name {
        font-size: 1.5rem;
    }

    /* .cta-background {
        height: 440px;
        padding: 0;
        margin: 20px;
    } */

    /* .cta-content {
        width: 736px;
        gap: 1.25rem;
        padding-top: 2.375rem;
        padding-left: 4.5rem;
    } */


    .cta-description {
        font-size: 1.375rem;
        line-height: 2;
    }

    .footer {
        gap: 3.25rem;
        padding: 3.75rem 0 0.25rem;
        /* margin: 0px 80px 0px 80px; */
    }

    .footer-top {
        flex-direction: row;
    }

    .footer-logo {
        width: 320px;
        height: 53px;
    }


    .social-links {
        flex-direction: column;
        gap: 1.375rem;
    }

    .footer-links {
        flex-direction: row;
        gap: 2rem;
        max-width: 900px;
        margin-top: 4rem;
    }


    .footer-section {
        /* width: 252px; */
        margin-left: 1rem;
    }

    .footer-section::before {
        display: block;
    }
    .bg-image {
        opacity: 1;
    }

    .bg-gpu {
        width: 1048px;
        height: 688px;
        top: 1267px;
        left: 318px;
    }

    .bg-storage {
        width: 1012px;
        height: 644px;
        top: 2149px;
        left: 339px;
    }

    /* .cta-bg-img-mm {
        display: none;
    } */

    .col-6.anim-banner {
        width: 50% !important;
        order: 1;   
    }
    .col-6.cta-content br {
        display: none;
    }   
    
}

@media (min-width: 1024px) {
    .cta-title {
        font-size: 3.75rem;
        line-height: 68px;
    }
    
}


.platform-showcase.cloud-compute .showcase-image {
    @media (min-width: 1024px) {
        width: 251.09px;
        height: 205.01px;
    }
}
.platform-showcase.cloud-compute .showcase-info {
    @media (min-width: 1024px) {
        width: 276px;
    }
}
.platform-showcase.cloud-compute .showcase-desc {
    @media (min-width: 1024px) {
        /* width: 274px; */
    }
}
@media (min-width: 1024px) {
    .gpu-models-list .gpu-model:first-child {
        width: 150px;
    }

    .cloud-services-list .cloud-service:first-child {
        width: 150px;
        /* margin-bottom: 35px; */
    }

    .cloud-services-list .cloud-service:not(:first-child) {
        width: 177px;
    }
}

@media (min-width: 1024px) {
    .feature-content.reverse {
        justify-content: center;
        gap: 7.625rem;
         margin-bottom: 0px;
    }
}

@media (min-width: 1024px) {
    .feature-text.right-align {
        align-items: flex-end;
        /* text-align: right; */
        order: 2 !important;
        margin-top: 0px;
    }
}
@media (max-width: 1024px) {
    .feature-text.right-align {
        align-items: flex-end;
        /* text-align: right; */
        order: -1 !important;
        margin-top: 0px;
    }
}



/* --------------------
 768 min 
 --------------------- */

@media (min-width: 768px) {
    .container {
        width: 100%;
        padding: 0 2rem;
    }

    .header {
        padding: 2rem 0;
    }

    .nav-wrapper {
        gap: 52px;
    }

    .nav-menu {
        display: flex;
    }

    .mobile-menu-btn {
        display: none;
    }

    .hero-title {
        font-size: 3.5rem;
    }

    .cta-button {
        height: 60px;
        padding: 0.875rem 2rem;
        font-size: 1.25rem;
        
    }

    .cta-bg-img-mm {
        display: none;
    }
    .arrow-icon {
        width: 28px;
        height: 28px;
    }

    .hero-banner {
        height: auto;
    } 

    .feature-arrow {
        width: 80px;
    }

    .feature-title {
        font-size: 2.25rem;
    }

    .feature-description {
        font-size: 1.25rem;
		line-height: 1.7;
    }

    .metrics-title {
        font-size: 2.25rem;
         padding-bottom: 30px;
    }

    .metrics-grid {
        grid-template-columns: repeat(2, 1fr);
        margin: 10px;
    }

    .trusted-title {
        font-size: 2.25rem;
    }

    .cta-title {
        font-size: 3rem;
    }

    .cta-description {
        font-size: 1.25rem;
    }

    .hidden-desktop {
        display: none !important;
    }
}



/* --------------------
 Extra 
 --------------------- */


/* Responsive Utilities */
@media (max-width: 767px) {
    .hidden-mobile {
        display: none !important;
    }
}

 @media (max-width: 768px) {
    .header {
        padding: 2rem 0;
        margin: 0;  
    }
}

@media (min-width: 640px) {
    .cta-button {
        width: fit-content;
    }
}


@media (max-width: 768px) {
    .platform-box {
        flex-direction: column;
    }

    .platform-content {
        flex-direction: column;
    }
    
    .platform-features {
        width: 100%;
    }

    /* --- GPU Section --- */
    #globalCloudDiv {
        flex-direction: column;
        width: 100%;
    }

    #gpuList {
        display: flex;
        flex-direction: row;
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 15px;
        margin-bottom: 20px;
        list-style: none;
        padding-left: 0;
        width: 100%;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    #gpuList::-webkit-scrollbar {
        display: none;
    }

    #gpuList .gpu-model {
        flex: 0 0 auto;
        background-color: #6c757d;
        color: white;
        padding: 12px 28px;
        border-radius: 25px;
        margin-right: 10px;
        font-weight: 500;
        transition: background-color 0.3s, color 0.3s;
        border: 0;
    }

    #gpuList .gpu-model.active {
        background-color: #FDBA35;
        color: #111;
    }

    #gpuShowcase {
        width: 100%;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    #gpuShowcase .showcase-image,
    #gpuShowcase .showcase-info {
        width: 100%;
        max-width: 350px;
    }

    #gpuShowcase .showcase-image {
        margin-bottom: 20px;
    }

    /* --- Full Stack Section (NEW) --- */
    #fullStackDiv {
        flex-direction: column;
        width: 100%;
    }
    
    .cloud-services-list {
        display: flex;
        flex-direction: row;
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 15px;
        margin-bottom: 20px;
        width: 100%;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .cloud-services-list::-webkit-scrollbar {
        display: none;
    }

    .cloud-services-list .cloud-service {
        flex: 0 0 auto;
        background-color: #6c757d;
        color: white !important; /* Use !important to override desktop text color style */
        padding: 12px 28px;
        border-radius: 25px;
        margin-right: 10px;
        font-weight: 500;
        transition: background-color 0.3s, color 0.3s;
        border: 0;
    }

    .cloud-services-list .cloud-service.active {
        background-color: #FDBA35;
        color: #111 !important; /* Use !important to override desktop text color style */
    }

    #fullStackDiv .showcase-content {
        width: 100%;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    #fullStackDiv .showcase-image,
    #fullStackDiv .showcase-info {
        width: 100%;
        max-width: 350px;
    }

    #fullStackDiv .showcase-image {
        margin-bottom: 20px;
    }
}


@media (max-width: 768px) {
    .team .row {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-start; /* Align items to the start */
        -ms-overflow-style: none;  /* Hide scrollbar for IE and Edge */
        scrollbar-width: none;  /* Hide scrollbar for Firefox */
    }

    .team .row::-webkit-scrollbar {
        display: none; /* Hide scrollbar for Chrome, Safari, and Opera */
    }
    
    .team .team-item {
        flex: 0 0 auto; /* Prevent shrinking/growing */
        width: 65%;     /* Set a width to show 1 and a bit of the next item */
        margin-right: 15px; /* Add space between items */
    }
    
    /* Remove Bootstrap's justification on mobile */
    .team .justify-content-center {
        justify-content: flex-start !important;
    }
}


 @media (max-width: 768px) {
    /* Arrange tab sections side-by-side on mobile */
    .platform-features {
        display: flex;
        align-items: flex-start; /* Keeps the tops of the tabs aligned */
        gap: 15px; /* Adds space between the two tabs */
    }

    /* Hide the description of the tab that is NOT active */
    .platform-feature:not(.active) .feature-desc {
        display: none;
    }
}



    /* Tablet Styles (769px - 1023px) */
@media (min-width: 769px) and (max-width: 1023px) {
    .container {
        width: 100%;
        /* max-width: 960px !important; */
        padding: 0 1rem !important;
    }

    .hero-title {
        font-size: 3rem !important;
    }

    .banner-title,
    .feature-title,
    .metrics-title,
    .trusted-title,
    .cta-title {
        font-size: 2.2rem !important;
    }

    

    .col-6, .col-8, .col-3 {
        width: 100%;
    }
    
    .header {
        margin: 0 40px !important;
    }

    .logo {
        height: 80px !important;
    }
    .navbar-nav .nav-item {
        margin-top: 40px;
        display: block;
        margin-left: 0px;
    }

    .navbar-nav .nav-item span {
        display: block;
        width: 100%;
        padding: 16px;
        padding-left: 30px;
        font-size: 18px;
        font-weight: 600;
        font-family: 'Roboto Serif', serif;
        border-bottom: 1px solid #8f8f8f;
        border-left:none
    }

    .hero-content {
        margin: 0 40px 30px !important;
    }
    
    .feature-content,
    .feature-content.reverse {
        flex-direction: column;
        align-items: center;
        gap: 4rem;
         margin-bottom: 0px;
    }

    .features-section {
        vertical-align: middle;
    }

    .feature-text,
    .feature-text.right-align {
        text-align: center;
        align-items: center;
        order: -1;
        margin-top: 0px;
    }

    .feature-description {
        font-size: 24px;
    }
    .feature-block {
        position: relative;
        width: 100%;
        padding-top: 1rem;
        padding-bottom: 1.875rem;
    }

    .feature-image {
        width: 50%;
    }

    /* .platform-content {
        flex-direction: column;
    }

    .platform-features {
        flex-direction: row;
        width: 100%;
        justify-content: space-around;
        padding-top: 0;
        margin-bottom: 2rem;
    }

    .platform-feature {
        width: 45%;
    }

    .feature-indicator {
        display: none;
    } */
/* 
    .feature-info {
        margin-left: 0;
        text-align: center;
    } */

    /* .platform-box {
        width: 100%;
    }

    .platform-block .platform-content .platform-showcase,
    .platform-content .platform-showcase.cloud-compute {
        background-image: none;
        padding: 0;
    } */

    .cloud-platform-section {
        margin-top: 0;
        padding-top: 0;
    }

    .feature-info h3.feature-name {
        font-size: 15px;
    }
    .cloud-platform-section .platform-title {
        font-weight: 700;
        font-size: 2rem;
    }
    .cloud-platform-section .platform-subtitle {
        font-weight: 400;
        font-size: 1.5rem;
    }

    .platform-block, .platform-block-01 {
        padding: 0px;
        margin: 0px;
    }
    
    .platform-content .platform-features {
        display: flex;        
        flex-direction: row;
        /* margin-top: 20px !important; */
        /* position: relative; */
    }

    .platform-content .platform-feature {
        display: block;  
        position: relative; 
        width: 100%;
        margin: 6px;
        text-align: center;
    }

    .platform-content .feature-indicator {
        display: block;  
        transform: rotate(0deg);
        margin-left: 45%;
    }
    .feature-indicator .indicator-icon{
        top: -2px;
    } 
    .platform-content .feature-name {
        margin-top: 62px;
         font-size: 20px;
    }

    .platform-content .feature-desc  {
        font-size: 14px;
    }
    .feature-desc-mobile {
        display: block;
        font-size: 18px;
    }
    .feature-desc{
        display: none;
    }
    .platform-block .platform-content .platform-showcase {
        background-image:none;
        margin: 0;
        padding: 0;
    }

    .platform-showcase .showcase-content{
        display: flex;
        flex-direction: column;
        padding: 14px;
    }
    .platform-showcase .showcase-content .showcase-desc {
        font-size: 18px;
    }
    
    .gpu-image, .cloud-image {
        align-items: center;
        object-fit: cover;
    }
    
    #gpuList,
    .cloud-services-list {
        display: flex;
        flex-direction: row;
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 15px;
        margin-bottom: 20px;
        list-style: none;
        padding-left: 0;
        width: 100%;
        border-right: none;
    }

    #gpuList::-webkit-scrollbar,
    .cloud-services-list::-webkit-scrollbar {
        display: none;
    }

    #gpuList .gpu-model,
    .cloud-services-list .cloud-service {
        flex: 0 0 auto;
        background-color: #6c757d;
        color: white !important;
        padding: 12px 28px;
        border-radius: 25px;
        margin-right: 10px;
        font-weight: 500;
        border: 0;
    }

    #gpuList .gpu-model.active,
    .cloud-services-list .cloud-service.active {
        background-color: #FDBA35;
        color: #111 !important;
    }

    .showcase-content {
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-right: 0;
    }
    
    /* .metrics-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    } */

    .metric-card {
        width: 100%;
        height: auto;
    }

    .companies-grid {
        gap: 2rem;
    }

    .company-item {
        width: 120px;
    }

    .cta-content {
        padding: 1rem;
        /* align-items: center;
        text-align: center; */
        width: 100%;
    }

    .footer {
        margin: 0 40px;
    }

    .footer-links {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }

    .footer-section {
        margin-bottom: 2rem;
    }

     .social-links-mm {
        display: block;
        padding: 40px 10px 40px 10px;
    }
    .social-icon {
        margin-left: 10px;
    }


    /* Solution Page */

    .gpuCloud .col-6, #cloudStorage .col-6{
        width: 65%;
    }
    .gpuCloud .col-2, #cloudStorage .col-2{
        display: none;
    }

    .solutions-info .content, .demand-info .content{
        padding: 24px;
    }
    .features .key-img img, .demand-info .key-img img{
        width: 100%;
        margin-top: 40px;
    }

    .vision .col-6, .expertise .col-6  {
        width: 50%;
    }
    .expertise .col-3 {
        width: 25%;
    }
    .col-3.team-item {
        width: 25%;
    }
    .expertise {
        margin: 40px 0px 40px 0px;
    }
    .vision {
        margin: 40px 0px 40px 0px;
    }

    .hero.infra .col-6 {
        width: 65%;
    }
    .hero.infra .col-2 {
        display: none;    
    }
    .aiinfra .footer-banner {
        padding: 40px;
    }
    .contact .col-6 {
        width: 50%;
    }
    /* .yellow-text {
        font-size: 20px;
    } */

    .social-links {
        display: none;
    }
     .solutions .content, .demand .content {
        padding: 20px !important;
    }

    .col-6.cta-content, .col-6.cta-bg {
        width: 50%;
    }
    .col-6.anim-banner {
        width: 50%;
    }
    .col-6.cta-content br {
        display: none;
    }
    .anim-cta-bg {
        width: auto;
        /* height: 300px; */
        display: block;
        margin: auto;
        padding-top: 40px;
        margin-left: -25%;
    }
    h2.cta-title {
        font-size: 24px !important;
    }
    .cta-bg-img-mm {
        display: none;
    }
}


@media only screen and (max-width: 768px) {

    .home-banner-img-anim {
        height: 280px !important;
    }
    .anim-cta-bg {
        width: auto;
        height: 300px;
        display: block;
        margin: auto;
        padding-top: 40px;
        margin-left: -25%;
    }
    .col-6 {
        width: 100%;
        display: block;
    }
    .cta-section {
        margin: 20px;
    }
    
}


@media (width: 768px) and (height: 1024px) {
/* @media screen and (max-width: 1024 AND min-height: 768px) { */
    .feature-img {
        width: 50% !important;
        margin: auto;
        display: block;
        padding-bottom: 60px;
    }
    .feature-text {
        text-align: center;
        order: -1;
        margin-top: 0px;
    }
    .nav-item span {
        font-weight: 500;
        font-size: 12px !important;
        line-height: 1.25;
        color: white;
    } 
    .feature-name {
        padding-left: 40px;
    }
    .feature-text{
        margin-top: 60px;
        
    }
    .feature-block.ai-powered .feature-icon {
        margin-bottom: 20px;
    }
    .key-img {
        width: 60%;
        height: auto;
        margin: auto;
    }
    .solutions-info, .demand-info {
        padding: 100px;
        text-align: center;
    }
    .solutions .content p, .demand .content p {
        padding: 10px 20px 10px 20px;
        text-align: left;
    }
    .icon-text h4 br {
        display: none;
    }
    .infra .hero-img {
        width: 60%;
        height: auto;
        margin: auto;
        display: block;
    }
    .gpuCloud .hero-img, #cloudStorage .hero-img {
        width: 60%;
        height: auto;
        margin: auto;
        display: block;
    }
    .cta-title {
        font-size: 2rem;
    } 
    .hero h2.banner-title {
        font-size: 40px !important;
        font-weight: 700;
    }
    .cta-bg-img-mm {
        display: none;
    }
    .col-6.anim-banner, .col-6.cta-content {
        width: 50% !important;
        order: 1;   
    }
    .col-6.cta-content br {
        display: none;
    }   
}


@media (width: 1024px) and (height: 768) {
    .nav-item span {
        font-size: 12px !important;
    } 
    .solutions .content, .demand .content {
        padding: 20px !important;
    }
    .hero h2.banner-title {
        font-size: 40px !important;
        font-weight: 700;
    }
    .cta-bg-img-mm {
        display: none;
    }
}


@media (width: 1024px) {
    .nav-item span {
        font-size: 12px !important;
    } 
    .metric-card {
        width: 95% !important;
    }
    .solutions .content, .demand .content {
        padding: 40px;
    }
    .cta-bg-img-mm {
        display: none;
    }
}


@media (max-width: 1180px){
    .logo {
        height: 60px ;
    }
    .navbar-nav .nav-item {
        font-size: 12px !important;
        margin-left: 16px !important;
    }
   .feature-text.right-align {
        order: -1 !important;   
        margin-top: 0px;
   }
   .feature-block.scalable-storage {
    /* padding-top: 60px !important; */
   } 
   .solutions .icon-text img, .demand .icon-text img
    {
        padding-right: 20px;
        height: 36px;
    }
    /* .contact .cta-button {
        width: 50% !important   ;
    } */
    .separator {
       height: 0px;
       margin-bottom: 40px;
    }
    .cloud-platform-section {
        margin-top: 40px;
    }
    .icon-text h4 br {
        display: none;
    }
    .cta-background {
        padding: 1rem 1rem;
    } 
    .platform-block .platform-content .platform-showcase {
        background-image:none;
        padding-top: 0;
        
    }
    .platform-content .platform-features {
        padding-top: 10px;
    } 
    .feature-desc {
        font-size: 1rem;
    }
    .cloud-service {
        font-size: 14px;
    }
    .cloud-services-list, .showcase-content {
        padding-top: 0;
    }
    .platform-block, .platform-block-01 {
        height: auto;
        min-height: 460px;
    }
    /* .cta-bg-img-mm {
        display: none;
    } */
}

@media (max-width: 740px) {
    .logo {
        height: 42px;
        margin-right: auto;
    }
    h2 {
        font-size: 30px !important;
    }
    h2.yellow-text {
        font-size: 20px !important;
    }
    .solutions .content p, .demand .content p {
        padding: 10px 20px 10px 20px;
    }

    .demand .content {
        padding: 20px;
    }
    .icon-text h4 br {
        display: none;
    }

}  

@media (width: 712px) {
    .feature-img{
        max-width: 50%;
    }
    .feature-block {
        display: block;
        text-align: center;
        align-items: center;
    }

    .feature-content,
    .feature-content.reverse {
        flex-direction: column;
        align-items: center;
        gap: 4rem;
         margin-bottom: 0px;
    }
    .feature-text,
    .feature-text.right-align {
        text-align: center;
        align-items: center;
        order: -1;
        margin-top: 0px;
    }

    .col-4 .content {
        flex: 0 0 auto;
        width: 100%;
    }
   .solutions-info , .demand-info {
        padding: 120px;
        align-items: center;
    }
    .features .key-img img {
        width: 60%;
        height: auto;
        display: block;
        margin: auto;
    }
    .icon-text h4 br {
        display: none;
    }
    .col-6.cta-content, .col-6.cta-bg {
        width: 50%;
    }
    .anim-cta-bg {
        width: auto;
        height: 300px;
        display: block;
        margin: auto;
        padding-top: 40px;
        margin-left: -25%;
    }
    h2.cta-title {
        font-size: 24px !important;
    }
    .cta-bg-img-mm {
        display: none;
    }
    .col-6.anim-banner {
        width: 50% !important;
        order: 1;   
    }
    .col-6.cta-content br {
        display: none;
    }   
    
}




@media (width: 768px) and (height:616px) {
    .feature-img{
        max-width: 50%;
    }
    .feature-block {
        display: block;
        text-align: center;
        align-items: center;
        margin-bottom: 40px;
    }
    .col-4 .content {
        flex: 0 0 auto;
        width: 100%;
    }
   .solutions-info , .demand-info {
        padding: 120px;
        align-items: center;
    }
    .features .key-img img {
        width: 60%;
        height: auto;
        display: block;
        margin: auto;
    }
    .icon-text h4 br {
        display: none;
    }
    
}

@media (width: 616px) and (height:768px) {
    .feature-img{
        max-width: 50%;
    }
    .feature-block {
        display: block;
        text-align: center;
        align-items: center;
        margin-bottom: 40px;
    }
    .col-4 .content {
        flex: 0 0 auto;
        width: 100%;
    }
   .solutions-info , .demand-info {
        padding: 120px;
        align-items: center;
    }
    .features .key-img img {
        width: 60%;
        height: auto;
        display: block;
        margin: auto;
    }
    .icon-text h4 br {
        display: none;
    }
}


@media screen and (width:1280px) {
    .feature-content,
    .feature-content.reverse {
        flex-direction: column;
        align-items: center;
        gap: 4rem;
         margin-bottom: 0px;
    }
    .feature-text,
    .feature-text.right-align {
        text-align: center;
        align-items: center;
        order: -1 !important;
        margin-top: 0px;
    }   
    .feature-img {
        width: 80% ;
        margin: auto;
        display: block;
        padding-bottom: 60px;
    }
    .cta-bg-img-mm {
        display: none;
    }
}

@media screen and (width:667px) {
    .navbar > .container, .navbar > .container-fluid, .navbar > .container-sm, .navbar > .container-md, .navbar > .container-lg, .navbar > .container-xl, .navbar > .container-xxl {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
    }
}

@media only screen and (width: 1180px) {
    .feature-img {
        width: 50% ;
        margin: auto;
        display: block;
        padding-bottom: 60px;
    }
    .cta-bg-img-mm {
        display: none;
    }
}

@media only screen and (width: 1366px) {
    /* .feature-img {
        width: 70% ;
        margin: auto;
        display: block;
        padding-bottom: 60px;
    } */
    .main {
        margin-left: 24px;
        margin-right: 24px;
    }
    .feature-content, .feature-content.reverse {
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        gap: 1.25rem;
        margin-bottom: 0px;
    }
    .solutions .content, .demand-info .content {
        padding: 40px;
    }
    .cta-bg-img-mm {
        display: none;
    }
}


@media only screen and (width: 1138px) {
    .feature-content, .feature-content.reverse {
        flex-direction: col;
        justify-content: center;
        align-items: flex-start;
        /* gap: 9.25rem; */
        margin-bottom: 0px;
        order: -1 !important;
    }   
    .feature-img {
        width: 90% ;
        margin: auto;
        display: block;
        padding-bottom: 60px;
    }
    .cta-bg-img-mm {
        display: none !important;
    }
    

}


@media only screen and (width: 1180px) {
    .feature-content, .feature-content.reverse {
        flex-direction: col;
        justify-content: center;
        align-items: flex-start;
        gap: 9.25rem;
        margin-bottom: 0px;
    }   
    .feature-img {
        width: 90% ;
        margin: auto;
        display: block;
        padding-bottom: 60px;
    }
    .cta-bg-img-mm {
        display: none;
    }

}

@media (max-width: 660px){
	#nav-tab.nav-tabs{
		gap: 20px;
		flex-wrap: nowrap;
		overflow: auto;
	}
	#nav-tab.nav-tabs .nav-link{
		width: 100%;
		padding: 0px;
	}
	
	#nav-tab.nav-tabs .nav-link h4{
		white-space: nowrap;
	}
	
	#nav-tab.nav-tabs .nav-link img{
		max-width: 120px;
	}
}
