 @media screen and (min-width: 1200px) {
     .container {
         max-width: 1410px;
     }
 }
 @media(min-width: 1600px){
    .wrapper{
            zoom: 0.9;
    }
 }

 @media screen and (max-width: 1365px) {

     .hero-inner-main,
     .header-inner {
         padding-inline: 40px;
     }

     .flagship-main {
         padding-left: 80px;
     }
     .footer-inner {
    padding: 85px 60px 40px 60px;
}
.footer-brand img{
    height: 80px;
}
.read-btn, .invest-btn {
    padding-inline: 24px;
}
 }

 @media screen and (max-width: 1199px) {
     .hero .left-content h1 {
         font-size: 36.26px;
         line-height: 48px;
     }

     .flagship-main {
         padding-left: 40px;
     }

     .title h2,
     .title p {
         font-size: 32px;
         line-height: 40px;
     }

     .purpose-sec {
         padding: 140px 0;
     }

     .box .dot-top-main {
         left: 87px;
     }

     .forefront-box {
         border-radius: 32px;
         padding: 40px;
     }

     .audits-box {
         padding-left: 50px;
         padding-right: 50px;
     }

     .leadership-inner {
         padding: 120px 24px;
     }

     .leadership-inner .text-box p {
         font-size: 20px;
     }

     .get-start-inner {
         padding: 100px 0;
     }

     .get-start-inner .text-box h4 {
         color: #fff;
         font-weight: normal;
         font-size: 42px;
         max-width: 475px;
     }

     .footer-inner {
         padding: 40px 24px;
     }

     .footer-left img {
         height: 72px;
     }

     .footer-left p {
         font-size: 16px;
         margin: 50px 0 0 0;
     }

     .newslatter h4 {
         font-size: 20px;
         margin-bottom: 20px;
     }

     .newslatter .form-control {
         height: 52px;
         font-size: 18px;
         padding-left: 20px;
     }

     .newslatter a {
         height: 52px;
         width: 160px;
         font-size: 16px;
     }

     .footer-detail {
         margin: 30px 0 0 0;
     }

     .links-box h4 {
         font-size: 18px;
         margin-bottom: 18px;
     }

     .links-box ul li a {
         font-size: 16px;
     }

     .footer-description {
         padding: 30px 0 80px 0;
         margin-top: 30px;
     }
     .read-btn {
    padding-inline: 20px;
}
header {
    top: 44px;
}
 }

 @media screen and (max-width: 991px) {
     .read-docs-btn {
         font-size: 16px;
         height: 52px;
         min-width: 130px;
     }

     .hero .main-btn {
         height: 52px;
         font-size: 16px;
         padding-inline: 12px;
     }

     .hero .left-content h1 {
         font-size: 31px;
         line-height: 41px;
         padding-bottom: 20px;
     }

     .hero .left-content p {
         font-size: 16px;
         line-height: 24px;
         padding-bottom: 14px;
     }

     .hero .right-content img {
         height: 250px;
     }

     .flagship-main {
         padding-left: 0;
     }

     .flagship-left {
         margin: 0 auto;
         padding: 36px 40px;
         max-width: 100%;
     }

     .purpose-sec {
         padding: 100px 0;
     }

     .boxes-top {
         padding-bottom: 40px;
         max-width: 100%;
     }

     .box {
         padding: 20px;
     }

     .boxes-top {
         gap: 20px;
     }

     .box h3 {
         font-size: 27px;
     }

     .ecosystem-main::after {
         height: 875px;
     }

     .ecosystem-main {
         padding-top: 40px;
     }

     .box {
         max-width: 320px;
         padding: 14px;
     }

     .boxes-top {
         gap: 12px;
     }

     .box ol li a {
         min-width: 135px;
     }

     .box .dot-main {
         display: none;
     }

     .title h2 {
         font-size: 28px;
     }

     .forefront-inner {
         margin: 50px auto 0;
     }

     .forefront-box {
         border-radius: 14px;
         padding: 40px 20px;
     }

     .forefront-box h4 {
         font-size: 22px;
         margin-bottom: 10px;
     }

     .forefront-box p {
         font-size: 16px;
     }

     .forefront-box ul {
         column-gap: 20px;
         margin: 20px 0 0 0;
         row-gap: 20px;
     }

     .forefront-box ul li img {
         height: 26px;
     }

     .audits-box {
         padding-left: 30px;
         padding-right: 30px;
     }

     .leadership-inner {
         padding: 80px 24px;
         border-radius: 20px;
     }

     .leadership-inner .text-box h4 {
         font-size: 26px;
         margin-bottom: 20px;
     }

     .leadership-inner .text-box p {
         font-size: 16px;
     }

     .accordion-item {
         padding: 30px 30px;
     }

     .accordion-button {
         font-size: 20px;
     }

     .accordion-body p {
         font-size: 18px;
         margin-top: 20px;
     }

     .get-start-inner {
         padding: 50px;
     }

     .get-start-inner .text-box {
         justify-content: space-between;
     }

     .get-start-inner .text-box h4 {
         font-size: 30px;
         max-width: 310px;
     }

     .get-start-inner .text-box ul li a {
         height: 50px;
         padding: 0 50px;
     }

     footer {
         padding: 30px 0;
     }

     .footer-left {
         margin-bottom: 30px;
     }

     .footer-left p {
         font-size: 16px;
         margin: 20px 0 0 0;
         max-width: 100%;
     }

     .footer-description p {
         font-size: 18px;
         margin-bottom: 20px;
     }

     .hero-inner-main,
     .header-inner {
         padding-inline: 26px;
     }

     .flagship-right {
         padding: 50px 0;
     }

     .flagship-right ol {
         max-width: 460px;
     }
     .box ol li a {
    font-size: 12px;
    padding: 0 10px;
}
.read-btn, .invest-btn {
    font-size: 20px;
    height: 56px;
    padding-inline: 32px;
}
 }

 @media screen and (max-width: 767px) {

     .container,
     .container-sm {
         max-width: 100%;
     }

     .boxes-top {
         flex-direction: column;
     }

     .box {
         min-height: auto;
         max-width: 100%;
     }

     .ecosystem-main::after {
         height: 100%;
     }

     .boxes-top {
         padding-bottom: 20px;
     }

     .hero-inner-main,
     .header-inner {
         padding-inline: 20px;
     }

     .header-inner .brand img {
         height: 40px;
     }

     .hero-inner-main {
         padding-top: 150px;
     }

     .purpose-sec {
         padding: 56px 0;
     }

     .title h2,
     .title p {
         font-size: 26px;
         line-height: 34px;
     }

     .flagship {
         padding-top: 40px;
         padding-bottom: 42px;
     }

     .read-btn {
         font-size: 18px;
         height: 56px;
     }

     .ecosystem-main .title,
     .flagship .title {
         padding-bottom: 30px;
     }

     .flagship-left .title {
         padding-bottom: 15px;
     }

     .hero .right-content img {
         height: 220px;
     }

     .hero .main-btn {
         padding-inline: 20px;
     }

     .title h2 {
         font-size: 24px;
         line-height: 32px;
     }

     .flagship-left p {
         font-size: 16px;
         font-weight: 300;
         line-height: 26px;
         padding-bottom: 26px;
     }

     .forefront-inner {
         margin: 30px auto 0;
     }

     .forefront-inner {
         grid-template-columns: 1fr;
     }

     .forefront-box {
         border-radius: 14px;
         padding: 24px;
     }

     .forefront-box h4 {
         font-size: 24px;
         margin-bottom: 14px;
         line-height: 30px;
     }

     .forefront-box p {
         font-size: 14px;
         line-height: 24px;
     }

     .leadership-inner {
         padding: 40px 20px;
         border-radius: 16px;
     }

     .accordion {
         margin-top: 30px;
     }

     .accordion-item {
         border-radius: 16px;
         padding: 16px;
         margin-bottom: 16px;
     }

     .accordion-item:first-of-type {
         border-top-left-radius: 16px;
         border-top-right-radius: 16px;
     }

     .accordion-item:last-of-type {
         border-bottom-right-radius: 16px;
         border-bottom-left-radius: 16px;
     }

     .accordion-button {
         font-size: 16px;
     }

     .accordion-body p {
         font-size: 14px;
         margin-top: 16px;
     }

     .accordion-button span img {
         height: 8px;
     }

     .accordion-button span {
         width: 16px;
         height: 16px;
     }

     .get-start-inner {
         padding: 24px;
         border-radius: 16px;
     }

     .get-start-inner .text-box {
         flex-direction: column;
     }

     .get-start-inner .text-box h4 {
         font-size: 24px;
         max-width: 100%;
         text-align: center;
     }

     .get-start-inner .text-box ul {
         width: 100%;
         max-width: 320px;
         margin-top: 30px;
     }

     .footer-inner {
         border-radius: 16px;
         padding: 24px;
     }

     .footer-left img {
         height: 52px;
     }

     .footer-left p {
         line-height: 160%;
     }

     .flagship-left {
         padding: 24px;
     }

     .box p {
         font-size: 14px;
         line-height: 24px;
         padding-bottom: 20px;
     }

     .leadership-inner .text-box {
         max-width: 100%;
     }
     .hero .right-content {
    text-align: center;
     }
     .hero-inner-main {
    padding-bottom: 50px;
}
 }

 @media screen and (max-width: 575px) {
     .header-inner .brand img {
         height: 30px;
     }

     .header-inner ol {
         gap: 10px;
     }

     .header-inner ol li a img {
         height: 16px;
     }

     header .main-btn {
         font-size: 10px;
         height: 28px;
         padding-inline: 12px;
         border-radius: 16px;
     }

     .hero-inner-main {
         padding-top: 100px;
         padding-bottom: 40px;
     }

     .hero .left-content h1 {
         font-size: 24px;
         line-height: 34px;
         padding-bottom: 12px;
     }

     .hero .left-content p {
         font-size: 14px;
         line-height: 22px;
         padding-bottom: 12px;
     }

     .hero .main-btn,
     .read-docs-btn {
         height: 40px;
     }

     .hero .right-content img {
         height: 180px;
     }

     .hero .main-btn,
     .read-docs-btn {
         font-size: 14px;
     }

     .title h2,
     .title p {
         font-size: 24px;
         line-height: 34px;
     }

     .flagship-left {
         padding: 24px;
     }

      header {
        top: 30px;
    }

     .purpose-inner .title p {
         font-size: 20px;
         line-height: 30px;
     }

     .flagship-left p {
         font-size: 14px;
         padding-bottom: 24px;
     }
    .purpose-sec {
        padding: 40px 0;
    }
     .purpose-inner .title p {
         font-size: 16px;
         line-height: 26px;
         margin-top: 10px;
     }

     .read-btn {
         height: 48px;
         padding-inline: 20px;
     }

     .flagship-right ol li {
         gap: 20px;
         margin-bottom: 20px;
     }

     .flagship-right {
         padding: 50px 20px;
     }

     .flagship-right ol li {
         gap: 10px;
     }

     .flagship-right ol li span img {
         height: 16px;
     }

     .box h3 {
         font-size: 20px;
     }

     .ecosystem-main::after,
     .flagship-right,
     .hero-inner-main,
     .flagship-main,
     .box {
         border-radius: 16px;
     }

     .read-btn {
         font-size: 16px;
     }

     .flagship-right p {
         font-size: 16px;
     }

     .newslatter form {
         flex-direction: column;
     }

     .newslatter .form-control {
         height: 56px;
         font-size: 18px;
         padding-left: 26px;
         flex: inherit;
     }

     .newslatter a {
         height: 56px;
         width: 100%;
         font-size: 18px;
     }

     .footer-detail {
         grid-template-columns: 1fr;
         gap: 30px;
     }

     .links-box h4 {
         font-size: 20px;
         margin-bottom: 15px;
     }

     .footer-description {
         padding: 20px 0 30px 0;
         margin-top: 20px;
     }

     .footer-description p {
         font-size: 14px;
         margin-bottom: 12px;
     }

     .copyright p {
         font-size: 14px;
     }
         .main-btn,
         .hero .main-btn {
        padding-inline: 14px;
    }
    .box ol li a {
    font-size: 12px;
    }
        .read-btn, .invest-btn {
        font-size: 14px;
        height: 44px;
        padding-inline: 16px;
    }
        .box ol li a {
        min-width: 124px;
    }
    .hero-inner-main{
        border-radius: 0;
    }
    .hero .left-content ol {
    gap: 10px;
    justify-content: center;
 }
     .main-btn, .hero .main-btn,
     .invest-btn {
        padding-inline: 12px;
    }
    .box ol li a, .box ol li span {
    min-width: 130px;
    }
}