@media screen and (max-width: 950px){
.desktop{
    display: none !important;
}
.mobile{
    display: flex !important;
}
.hd-header-talk ul li a {
    font-size: 10px;
    gap: 0.5vh;
}
.hd-header-talk ul li a svg {
    height: 2vh;
}
.hd-header-logo {
    height: 85%;
    width: 13%;
    margin: 1vh 0 0;
}
.hd-header {
    height: 50px;
    padding: 0px 2.5%;
}
.footer {
    padding: 20vh 5% 10vh;
}
 .mobile-header {
    position: fixed;
    bottom: 2%;
    display: flex;
    align-items: center;
    left: 0;
    height: 60px;
    justify-content: center;
    width: 100%;
    transition:bottom 0.5s linear;
    z-index: 99999;
  }
   .mobile-header.off-canvas{
bottom: 0%;
}

 .mobile-header.fixed {
/* bottom: -8%; */
bottom: 0%;
}
.hd-header-nav {
         height: 100%;
        border-radius: 20px 20px 0 0;
        width: 100%;
        backdrop-filter: blur(12px);
         background: #fff0fefa;
        border: 1px solid #f369e0bf;
}
.hd-header-nav ul {
    display: flex
;
    align-items: center;
    justify-content: space-between;
    padding: 0 5%;
    gap: 1vh;
    width: 100%;
}
.hd-header-nav ul li a {
    font-size: 12px;
    color: #7b0771;
}
.hd-hero-section {
        opacity: 0;
        transform: translateY(25px);
        animation: fadeSlideUp 0.8s 
cubic-bezier(0.23, 1, 0.32, 1) forwards;
        animation-delay: 0.2s;
        display: flex
;
        flex-direction: column;
        justify-content: end;
            padding: 10vh 2% 0;
                    overflow: hidden;

}
    .hd-hero-section h2.digi {
        float: none;
        margin: -2vh 0 0px;
              font-size: 10vh;
        width: fit-content;
    }
.hd-hero-section h2.digi span {
    top: auto;
    bottom: 0%;
    right: 1%;
    left: auto;
}
.hd-hero-section h2 {
         font-family: "neue-haas-grotesk-display";
        font-weight: 600;
        font-size: 11vh;
}

.hd-hero-section h2 span {
 font-size: 1vh;
        left: 0.7%;
        width: 57%;
        top: -10%;
        letter-spacing: 0.2px;
        word-spacing: 1px;
        line-height: 1.5;
}
.hero-info p {
        font-size: 11px;
        padding: 5% 2% 5.5% 3%;
        line-height: 1.6;
        position: relative;
}
.hero-info {
    float: none;
    position: relative;
    width: 100%;
    flex-direction: column;
    padding: 2vh 0 0;
}
.hero-info p svg.genesis-hero--svg-left {
    transform: rotate(-180deg);
    bottom: 0%;
    left: 1%;
}
.hero-info p svg.genesis-hero--svg-right {
    top: 2%;
    right: 1%;
}
.hero-bg{
position: absolute;
        
        /* object-fit: cover; */
        top: -40%;
        height: 110%;
        background-image: url(../content/images/hd-hero-overlay.webp), url(../content/images/hd-hero-main.webp);
        background-position: 50% 100%, 50% 100%;
        background-repeat: repeat, no-repeat;
        background-size: cover, cover;
        width: 100%;
}
.hd-hero-btn {
margin: 5vh 0% 2vh;
        font-size: 12px;
        padding: 2.5vh 1vh;
        width: 100%;
        gap: 1vh;
        align-items: center;
        box-shadow: inset 0px 0 7px #c271d2c9;
}
.hd-hero-section .stat-card h2{
         font-size: 14px;
}
    .stats-wrapper {
        gap: 1%;
        position: relative;
        bottom: auto;
        right: auto;
        padding: 0;
        height: auto;
        justify-content: start;
        box-shadow: inset 0px 0 7px #c271d26e;
        background-color: #f9ebff;
        border-radius: 5px;
        margin: 2vh 1%;
    }
    .hd-hero-section .stat-card p {
       font-size: 7.3px;
        padding: 1vh 0;
        line-height: 1.6;
        font-weight: 500;
        letter-spacing: 0.5px;
    }
    .stat-card {
         width: 32%;
        height: 100%;
        background: transparent;
        box-shadow: none;
        padding: 1vh 3% 1vh 2%;
        position: relative;
    }
    .stat-card.sc::after{
content: "";
        position: absolute;
        height: 65%;
        width: 2px;
        background-color: #cb74c454;
        top: 20%;
        right: -5%;
    }
    .stat-card.sc::before{
content: "";
        position: absolute;
        height: 65%;
        width: 2px;
        background-color: #cb74c454;
        top: 20%;
        left: 0%;
    }
.hd-hero-section .stat-card h2 span {
    font-size: 30px;
}
.hd-hero-btn svg{
    height: 2vh;
    width: auto;
}
.hd-hero-btn svg path{
   fill: #8f1a85;
}

/* abouy-us */

.hd-about-us {
        height: auto;
        margin: 5vh 0% 2vh;
        flex-direction: column;
        background: #8f1a8517;
        backdrop-filter: blur(18px);
        padding: 2% 2%;
        border-radius: 12px;    
}
.hd-about-left {
 height: 100%;
        width: 100%;
        padding: 2vh 4%;
        gap: 5vh;
        background: transparent;
        border-radius: 8px 8px 0 0;
}
.hd-about-left h3 {
    font-size: 14px;
}
.hd-about-left-top-h5 {
        font-size: 12px;
        line-height: 1.5;
            
}
.hd-about-left.hd_ab2{
border-radius: 0 0 8px 8px;
        flex-direction: column-reverse;
        padding: 2vh 3%;
        background: transparent;
               backdrop-filter: none;
}
.hd-about-left-top-h5 span {
    color: #212121;
    font-weight: 600;
    word-spacing: 0;
    font-size: 1.2vh;
}
.hd-about-left h4 {
    font-size: 12px;
}
.hd-about-right {
    height: 100%;
        padding: 0;
        flex-direction: column-reverse;
    width: 100%;
}
.hd-about-right .hd-about-top h2 {
font-size: 18px;
        padding: 0vh 1% 2vh 2%;
        line-height: 1.3;
        font-weight: 600;
}
.hd-card{
        min-width: 65%;
        height: auto;
        min-height: auto;
        padding: 2vh 4% 4vh;
        border-radius: 6px;
}
.hd-carousel-container {
    margin-top: 0;
}
.hd-about-bottom {
padding: 2vh 0 4vh;
}
.hd-card h3 svg {
    width: 3.2vh;
    height: auto;
}
.hd-card-content h4 {
           font-size: 12px;
        padding: 7vh 0 1.5vh;
}
.hd-card p {
        line-height: 1.5;
        font-size: 10px;
}
.hd-card::after {
 content: "";
        position: absolute;
        top: 0%;
        left: 0%;
        height: 30%;
        width: 30%;
        border-radius: 0 0rem 3rem 0;
}
.hd-about-left-svg {
    position: absolute;
    top: 7%;
    right: 1%;
    height: auto;
    width: 5%;
}
.hd_project_details {
width: 90%;
        padding: 5vh 0 1vh;
        margin: 10vh auto 5vh;
        border-radius: 12px;
}
.hd_project_details h1 {
    font-size: 16px;
    margin-bottom: 0;
}
.hd_project_details p {
    font-size: 12px;
    padding: 0 4% 0 4%;
    text-align: start;
    padding-top: 3vh;
}
.hd_project_details .hd-hero-btn {
    place-self: center;
    margin: 4vh 3% 1vh;
    padding: 2.5vh 7vh;
    font-size: 11px;
    width: 90%;
}
.hd-about-left-svg1{
    top: 2%;
        right: auto;
        height: auto;
        width: 5%;
        left: 2%;
}
.hd-ww-do {
    height: auto;
    padding: 5vh 2% 2vh;
    flex-direction: column;
}
.hd-ww-do .hd-about-left{
        background: #8f1a8517;
}
.hd-about-top {
    flex-direction: column;
            row-gap: 4vh;
}
.hd-about-top-parent {
    width: 100%;
    height: 100%;
}
    .hd-ww-do .hd-about-right {
        height: 100%;
        padding: 0;
        flex-direction: column-reverse;
        width: 100%;
        padding: 2vh 1%;
    }
    .hd-about-top-parent-card-content {
    padding: 20vh 10vh 0 7%;
    transform: translate3d(0, 0, 26px);
}
.hd-about-top-parent-card-content h1 {
    font-size: 40px;
}
.hd-about-top-parent-card-content .title {
    font-size: 16px;
}
.hd-about-top-parent-card-content .text {
    font-size: 12px;
}
.bottom {
    padding: 10vh 5% 3vh;
    position: relative;
    bottom: auto;
    left: auto;
    right: auto;
}
.bottom .social-buttons-container .social-button{
    font-size: 12px;
}
.hd-about-top-parent-card-logo .circle3 {
    width: 14vh;
}
.hd-about-top-parent-card-logo .circle4 {
    width: 11vh;
}
.hd-about-top-parent-card-logo .circle5 {
    width: 7vh;
}
.hd-about-top-parent-card-logo .circle5 .svg path {
    fill: #9d1d92;
}
    .hd-ww-do .hd-about-left.hd_ab2{
        background: transparent;
        padding: 5vh 2% 0;
}
.hd-case-study-heading{
    padding: 10vh 0 5vh;
    font-size: 18px;
}
.hd-case-study {
    height: auto;
    width: 100%;
}
.hd-case-study-content-left {
height: 100%;
        width: 100%;
        gap: 2%;
        row-gap: 1vh;
}
.hd-case-study-card {
    height: 30vh;
    border-radius: 5px;
}
.hd-case-study-card.hd-m-card{
    width: 100%;
    flex-direction: column;
    height: 35vh;
}
.hd-case-study-card-bottom h3,
.hd-case-study-card-bottom p{
    font-size: 8px;
}
.tags {
    gap: 2%;
}
.tag {
        padding: 0.5vh 0.5vh;
        border-radius: 3px;
        /* width: 49%; */
        font-size: 12px;
        line-height: normal;
}
.tag span {
    font-size: 8px;
}
.overlay-content p{
    font-weight: 500;
    text-transform: uppercase;
    font-size: 8px;
}
.hd_info_section-main-div1 h3 {
    font-size: 18px;
}
.hd_info_section-main-div2-top-hover p,
.hd_info_section-main-div2-bottom p {
          font-size: 12px;
        gap: 0.5vh;
}
.hd_info_section-main-div2-top,
.hd_info_section-main-div2-bottom{
    flex-direction: column;
    row-gap: 3vh;
}
.hd_info_section-main-div2-top-hover p sup,
.hd_info_section-main-div2-bottom-hover p sup{
    font-size: 12px;
}
.hd_info_section-main-div2 {
    gap: 3vh;
}
.hd_info_section {
    margin: 10vh 0 10vh;
}
.hd_info_section-main {
    width: 95%;
    /* height: 70%; */
    display: flex
;
    flex-direction: column;
    padding: 5vh 0 0vh;
    backdrop-filter: blur(20px);
    background: #daa4dc5c;
    border-radius: 12px;
    gap: 8vh;
}
.hd_info_section-main-div2 .hd-hero-btn {
    place-self: center;
    margin: 5vh 3% 0vh;
    padding: 3.3vh 0vh;
    font-size: 12px;
    height: auto;
    width: 90%;
}


.process-data {
    flex-direction: column;
}
.process-data .p-data-left {
    height: 50%;
    width: 100%;
    justify-content: start;
    align-items: end;
    padding-left: 8%;
}

.process-data .p-data-right {
    height: 50%;
    width: 100%;
    justify-content: start;
    padding-left: 8%;
    align-items: start;
    padding-top: 0%;
}
.p-data-left h1 {
    font-size: 20px;
  
}

.p-data-right p {
    font-size: 12px;
    width: 80%;
  
    line-height: 1.3;
}

.trust-item {
    height: 100%;
    min-width: 100vw;
}
.process-element {
    padding-left: 0;
}
.trust-item h1 {
    position: absolute;
    top: 8vw;
    left: 16vw;
    font-size: 112px;
   
    color: transparent;
}

.trust-item svg .title-medium {
    font-size: 26px;
}
.trust-item svg .desc {
    font-size: 16px;
    opacity: 60%;
}
.trust-item .fix-svg {
    position: absolute;
    top: 5%;
    left: -6%;
    z-index: -1;
    height: 209px;
    width: 194px;
}
.rounded-shape {
    width: 50%;
    height: 100%;
    border-radius: 0 50% 50% 0;
    position: absolute;
    top: 0px;
    left: -29px;
    z-index: 0;
}
.rating-video-section {
    width: 100%;
    height: 100%;
    overflow: hidden;
    overflow-x: scroll;
    scrollbar-width: none;
}
.rating-video-cards {
    width: 70%;
    height: 100%;
    background: #8f1a8517;
    padding: 1% 1% 0.5%;
    border-radius: 6px;
    min-width: 70%;
}
.rating-video-cards video {
    height: 90%;
    border-radius: 6px;
}
   .rating-video-section .hd-case-study-card-bottom h3{
padding: 1vh 0;
    }
.hd-about-us.rating-section .hd-about-bottom {
    padding: 1vh 0 2vh;
}
.footer-text-small {
    font-size: 10px;
    margin-bottom: 20px;
}
.send-message h3 {
    font-size: 3vw;
}
.footer-title-container {
    padding: 5vh 0 10vh;
}
.footer-contact {
    display: flex
;
    gap: 6%;
    margin-top: 20px;
    justify-content: space-between;
}
.contact-item h4 {
    margin-bottom: 1.5vh;
    font-size: 12px;
}
.contact-item p {
    margin: 1vh 0;
    font-size: 10px;
}
.faq-wrapper {
    width: 100%;
}
.faq-container {
    border-radius: 2px;
        backdrop-filter: blur(5px);
    background: rgb(226 155 222 / 0%);
}
.question {
  font-size: 12px;
    font-weight: 500;
    line-height: 1.55;
}
.answer {
    font-family: 'Helvetica';
    font-size: 10px;
    padding: 3% 5% 2%;
    line-height: 1.5;
    color: #000;
    opacity: 0.8;
    text-transform: uppercase;
}
.hd-about-us.rating-section .hd-about-left{
        background: #8f1a8517;
}
.hd-about-us.rating-section{
    background: transparent;
}
    .hd-about-us.rating-section .hd-about-left.hd_ab2 {
        background: transparent;
    }
    .hd-about-us.rating-section.faq-section .hd-about-bottom {
        padding: 1vh 2% 0vh;
        background: #8f1a8517;
        border-radius: 5px;
    }

/* hiara-services start */
.hiara-services .hd-ww-do {
    padding: 5vh 2% 2vh;
}
.hiara-services h2 {
    font-size: 40px;
    padding: 12vh 0 0;
    background: linear-gradient(to top, #F8F8F8 -4%, #f000dc 45%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.hiara-services h4 {
    font-family: "neue-haas-grotesk-display";
    font-size: 11px;
    font-weight: 500;
    width: 100%;
    letter-spacing: 1px;
    line-height: 1.5;
    text-transform: uppercase;
    place-self: center;
}
.hiara-services-about {
    padding: 2vh 14% 0;
    justify-content: space-between;
    text-align: center;
}
.hiara-services h5{
        font-size: 12px;
        line-height: 1.5;
    }
.hiara-services h5 span   {
        font-size: 12px;
        line-height: 1.5;
    }


/* hiara-services end */
.why-hiara h2{
   font-size: 40px;
    padding: 12vh 0 0;
    background: linear-gradient(to top, #F8F8F8 -4%, #f000dc 45%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
}
.why-hiara .hiara-services-about{
padding: 2vh 5%;
}
.why-hiara .hiara-services-about h4{
      font-size: 11px;
    width: 100%;  
}
    .why-hiara .comparison-card h2 {
        font-size: 18px;
        padding: 0;
        margin: 0 0 4vh 0;
    }
.comparison-card {
        flex: 1 1 100%;
        padding: 4vh 5% 2vh;
    width: 100%;
    border-radius: 8px;
    transition: all 0.4s 
ease;
    position: relative;
    overflow: hidden;
}
.comparison-card ul li{
        font-size: 12px;
}
.comparison-section {
    padding: 5vh 5% 0;
}
.case-study h2{
    font-size: 40px;
    padding: 12vh 0 0;
    background: linear-gradient(to top, #F8F8F8 -4%, #f000dc 45%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.case-study .hiara-services-about h4{
    font-family: "neue-haas-grotesk-display";
    font-size: 11px;
    font-weight: 500;
    width: 100%;
    letter-spacing: 1px;
    line-height: 1.5;
    text-transform: uppercase;
    place-self: center;
}
.case-study .hiara-services-about {
    padding: 5vh 6% 5vh;
    justify-content: space-between;
    text-align: center;
}
.case-study .hd-case-study-card {
    height: 40vh;
    width: 100%;
    border-radius: 8px;
}
.case-study-detailed-top h2 {
    font-size: 24px;
    width: 90%;
    padding: 0 5% 5%;
}
.case-study-detailed-top {
    width: 100%;
    height: 45vh;
    align-items: end;
    justify-content: start;
}
.case-study-detailed {
           padding: 0vh 2% 7vh;
}
.case-study-detailed-bottom {
    height: auto;
    width: 100%;
    padding: 1vh 0 0;
    display: flex
;
    flex-direction: column;
}
.case-study-detailed-bottom-left {
    width: 100%;
    height: 100%;
}
.case-study-detailed-bottom-right {
    width: 100%;
    height: 100%;
    padding: 3vh 2%;
    display: flex
;
    flex-wrap: wrap;
}
.case-study-detailed-bottom-right-card h2 {
    font-size: 12px;
}
.case-study-detailed-bottom-right-card p {
    font-size: 10px;
    padding: 1vh 0 0;
}
.case-study-detailed-bottom-right-card {
    padding: 0 0 3vh 0;
}

.P-client-logo-containeR-top {
    width: 100%;
    height: 35vh;
    padding: 0 0 4vh;
}
.P-client-logo-containeR-top p {
    font-family: 'Helvetica';
    font-size: 10px;
    padding: 0 5%;
    padding-top: 3vh;
    width: 100%;
}
.P-client-logo-containeR-top h2 {
    font-size: 18px;
    line-height: 1.5;
}
.client-logo-container-logo-div {
     width: 5%;
        min-width: 15vh;
}
.client-logo-container-logo-div img {
          width: 70%;
        height: 100%;
        /* max-width: 100px; */
        /* max-height: 50px; */
        filter: brightness(0.8);
}
.client-logo-container-logo-track {
    row-gap: 6vh;
}

.client-logo-container-logo {
           padding: 8vh 0 8vh;
}
.client-logo-row:nth-child(2) {
    animation-direction: reverse;
    animation-duration: 100s;
}
.P-client-logo-containeR-bottom h2 {
    font-size: 16px;
    line-height: 1.5;
}
.P-client-logo-containeR-bottom p {
    font-family: 'Helvetica';
    font-size: 10px;
    padding: 0 0%;
    line-height: 1.5;
    text-align: center;
    padding-top: 3vh;
    color: #000;
    width: 95%;
    text-transform: uppercase;
}
.P-client-logo-containeR-bottom{
        padding: 0 2%;
    justify-content: end;
    width: 100%;
    height: 35vh;
}
.partners-logo {
    width: fit-content;
    /* height: 4vh; */
    padding: 1vh 5%;
    margin: 2vh 0 0;
    border: 1px solid #cc00d333;
    border-radius: 30rem;
    backdrop-filter: blur(10px);
    background: #efd4f247;
}
.partners-logo img {
    height: 3vh;
    width: 100%;
    object-fit: contain;
}
.about-mentor-container {
    height: auto;
    padding: 1% 1.5% 1%;
    width: 100%;
    margin: 10vh 0 10vh;
}
.about-mentor-content-container{
        flex-direction: column;
    height: auto;
}
.about-mentor-content-container-left {
    width: 100%;
    height: 100%;
}
.about-mentor-content-container-left-bottom h3 {
    font-size: 12px;
}
.about-mentor-content-container-left-bottom p{
    font-size: 10px;
}
.tts-about-us-section-right.tts-about-mentor-right {
    width: 100%;
    height: 100%;
    padding: 1vh 2%;
}
.tts-about-us-section-right-content h3 {
    font-size: 12px;
            padding: 1vh 0 5vh 0;

}
.tts-about-us-section-right-content p {
    font-size: 10px;
}
.tts-about-us-section-right-content h5 {
    font-size: 10px;
    width: 100%;
    padding: 5vh 0 0;
}
.tts-about-us-section-right-content h5 span {
    font-size: 8px;
}
.about-mentor-container h2 {
    font-size: 18px;
    padding: 3vh 0 3vh 0;
}









}