/* Responsive adjustments */
/* Responsive hero adjustments */
@media (max-width: 1200px) {
  .main-content .logo {
    max-width: 150px;
    top: 20px;
  }

  /* .building-img {
    max-width: 60vw;
    min-width: 220px;
  } */

  /* .cement-bag {
    max-width: 180px;
  } */

  .product-spec {
    margin: 0 90px;
  }

  .product-spec .d-flex {
    padding: 0 50px;
  }
}

@media (max-width: 992px) {
  .curtain-top img,
  .curtain-bottom img {
    max-width: 95vw;
    max-height: 17vh;
  }

  .curtain-top,
  .curtain-bottom {
    padding: 0 2vw;
  }

  .main-content {
    min-height: 60vh;
    height: auto;
    padding-bottom: 24px;
    padding-top: 36px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
  }

  .main-content .logo {
    position: relative;
    max-width: 90px;
    top: 0;
    left: 0;
    transform: none;
    margin: 0 auto 8px auto;
    display: block;
  }

  .main-content .position-relative {
    min-height: 220px;
  }

  /* .building-img {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 70vw;
    min-width: 100px;
    margin: 0 auto;
    display: block;
  } */

  /* .cement-bag {
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    max-width: 80px;
    margin: 12px auto 0 auto;
    display: block;
  } */

  .product-center {
    width: 180px;
    height: 210px;
  }

  /* .product-center img {
    max-width: 110px;
  } */

  .feature-panel {
    width: 93vw;
    left: 3% !important;
    right: 3% !important;
    text-align: center !important;
  }

  .panel-topleft {
    top: 3%;
  }

  .panel-topright {
    top: 25%;
  }

  .panel-bottomleft {
    bottom: 22%;
  }

  .panel-bottomright {
    bottom: 2%;
  }

  .line {
    display: none;
  }

  .custom-popup {
    max-width: 95%;
    padding: 20px;
    max-height: 90vh;
  }

  .custom-close {
    top: 10px;
    right: 10px;
    font-size: 13px;
  }

  .row.d-flex {
    flex-direction: column;
  }

  .col-lg-5,
  .col-lg-7 {
    width: 100%;
    padding: 10px 0;
  }

  .product-spec {
    margin: 0 50px;
  }

  .product-spec .d-flex {
    padding: 0 30px;
  }
}

@media (max-width: 768px) {
  .footer-bottom {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }

  .footer-links {
    justify-content: center;
    gap: 3rem;
  }

  .vrm-top img {
    gap: 2rem;
    text-align: center;
  }

  .vrm-top .vrm-para {
    font-size: 16px;
  }

  .vrm-bottom p {
    justify-content: center;
    padding-bottom: 20px;
    border-bottom: 1px solid #fff;
    font-size: 15px;
  }

  .vrm-bottom .mini-para {
    font-size: 18px;
  }

  .about-desc {
    font-size: 16px !important;
  }

  .mission h5 {
    font-size: 20px !important;
  }

  .year {
    font-size: 16px !important;
  }

  .journey-timeline h5 {
    font-size: 18px;
  }

  .year::before {
    position: absolute;
    content: "";
    width: 2px !important;
    height: 100%;
    background-color: #3a3b3e;
    left: 150%;
    top: 0;
  }

  .year::after {
    position: absolute;
    content: "";
    width: 11px;
    height: 11px;
    background-color: #3588e8;
    border-radius: 50%;
    left: 141%;
    top: 3% !important;
  }

  .product-info {
    flex-direction: column;
  }

  .product-front,
  .product-back,
  .single-product {
    max-width: 180px;
  }

  .product-spec {
    margin: 0 30px;
  }

  .product-spec .d-flex {
    flex-direction: column;
    text-align: start;
    padding: 0 16px 30px 16px;
  }

  .product-spec .d-flex .img {
    padding-bottom: 30px;
  }

  .product-spec .d-flex h4 {
    font-size: 20px;
  }

  .product-spec .d-flex p {
    font-size: 15px;
  }
}

@media (max-width: 600px) {
  .curtain-top img,
  .curtain-bottom img {
    max-width: 96vw;
    max-height: 12vh;
  }

  .curtain-top,
  .curtain-bottom {
    padding: 0 1vw;
  }

  .main-content {
    min-height: 44vh;
    padding-top: 18px;
    padding-bottom: 16px;
  }

  .main-content .logo {
    max-width: 54px;
    margin-bottom: 6px;
  }

  /* .building-img {
    width: 92vw;
    min-width: 60px;
  } */

  /* .cement-bag {
    max-width: 52px;
    margin-top: 6px;
  } */

  .container {
    padding-left: 4vw;
    padding-right: 4vw;
  }
}

@media (max-width: 576px) {
  .small-flex {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: start;
  }

  .journey-section h2 {
    font-size: 30px;
  }

  .journey-timeline {
    max-width: 420px !important;
  }

  .journey-timeline img {
    width: 420px !important;
    height: auto;
  }

  .journey-timeline {
    text-align: left;
  }

  .year {
    display: block;
    border-bottom: 1px solid #fff;
  }

  .year::before {
    position: absolute;
    display: none;
  }

  .year::after {
    display: none;
  }

  .w-sm-80 {
    width: 80% !important;
    margin: 0 auto;
  }
}

@media (max-width: 468px) {
  .curtain-top img,
  .curtain-bottom img {
    max-width: 98vw;
    max-height: 10vh;
  }

  .main-content .logo {
    max-width: 60px;
  }

  /* .building-img {
    min-width: 60px;
  } */

  /* .cement-bag {
    max-width: 60px;
  } */

  .journey-timeline {
    max-width: 350px !important;
  }

  .journey-timeline img {
    width: 350px !important;
    height: auto;
  }
}

/* Responsive Design for Static Home Page */

/* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
  .feature-reveal-sticky {
    flex-direction: column;
  }

  .feature-reveal-sticky > div {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 24px 0;
  }

  .feature-reveal-sticky > div > div {
    width: 50%;
  }

  .feature-reveal-sticky > div .feature-panel {
    width: 100%;
    padding: 0 16px;
    text-align: left;
  }

  .mb-300 {
    margin-bottom: 24px;
  }

  .line {
    display: none;
  }

  .product-center {
    transform: rotate(0deg);
    top: 0;
    left: 0;
  }
  .product-center img {
    margin: 0 auto;
    margin-top: 32px;
  }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
  .feature-reveal-sticky > div {
    display: block;
  }

  .product-center img {
    max-width: 170px;
  }

  .feature-reveal-sticky > div > div {
    width: 100%;
  }

  .feature-reveal-sticky > div .feature-panel {
    width: 100%;
    padding: 0;
    margin: 0 auto;
  }

  .product-center img {
    margin: 0 auto;
  }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
  .building-img {
    max-width: 80vw;
  }
}

@media (max-width: 575.98px) {
    .hero-section{
        opacity: 1 !important;

    }
  .cement-bag {
    max-width: 67px;
     top: -95px;
    right: -70%;

  }
  #cement-bag{
    transform:translate3d(0px,0px ,0px) !important;
  }
  .building-img {
    /* top: 110px; */
    max-width: 80vw;
    position: static;
    top: 0;
    width: auto;
    /* height: 100%; */
    margin-top: 100px;

  }
  #main-blue-section-home{
    transform: translate3d(0px, 0px, 0px) !important;
  }
  .hero-content{
    margin-bottom: -95px;
  }






  /* <!-- Center Cement Bag --> */
  .cement-feature-home-img{

  }
  .panel-topleft-feature,
.panel-topright-feature,
.panel-bottomleft-feature,
.panel-bottomright-feature {
  opacity: 1;
  transition: none;
}
}
.awards-accolades-section{
    display: none;
}
.sarbottam-cement-feture-section{
    display: none;
}
@media (max-width:768px) {
      .awards-accolades-section{
        display: block;

      }
      .awards-accolades-section-wrapper{
         text-align: center;
      }
      .sarbottam-cement-feture-section{
        display: block;
        padding: 48px 0;
      }
      .sarbottam-cement-feture-section-wrapper{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 100px;
      }
        .sarbottam-cement-feture-section-wrapper .cement-feature-img-wrapper img{
          width: 200px;
          height: auto;
          margin: auto;
      }
      .cement-feature-card-wrapper{
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap:48px;

      }
     .cement-feature-card{
         text-align: center;
     }
}
