@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'DM Sans', serif;
    -webkit-tap-highlight-color: transparent;
    max-width: 100vw;
}
:root{
    --boxShadow: 0 4px 10px rgba(0,0,0,.1);
    --bgGrey: #fbfbfb;
    --white: #ffffff;
    --border: 1px solid #595959c2;;
    --border1: 1px solid #dadada;
    --bs1: 0px 0px 30px rgba(82, 82, 255,.3);
    --bs: 0px 0px 15px rgba(82, 82, 255,.3);
    --txt:#4d4d4d;
    --black:#000;
}
body.noscroll{overflow-y: hidden;}
ul{list-style: none;}
a{text-decoration: none;}
.flex{display:flex;align-items: center}
.flex.jcc{justify-content: center;}
.flex.jcsb{justify-content: space-between;}
.flex.fdc{flex-direction: column;}
.flex.jcs{justify-content: flex-start;}

body{width: 100vw;overflow-x:hidden;background: var(--black);max-width:100vw;overflow-x:hidden}
button{outline:none;border:none;transition:500ms ease;cursor: pointer;}
button:disabled{opacity:.5;pointer-events: none;}

/* index page styles */
.hero_section{height:100dvh;height:100vh}
.hero_div{height: 100%;width: 100%;display:flex;align-items: center;justify-content: center;flex-direction: column;color:var(--white);z-index:2;text-align: center;gap:16px;padding-top: 80px;position:relative}
.hero_bg_media{position:absolute;inset: 0}
.hero_bg_media .swiper-slide:nth-child(4n-3) .intro_slide_img,
.hero_bg_media .swiper-slide:nth-child(4n-2) .intro_slide_img {
  animation: zoomIn 30s ease-in-out infinite;
}

.hero_bg_media .swiper-slide:nth-child(4n-1) .intro_slide_img,
.hero_bg_media .swiper-slide:nth-child(4n) .intro_slide_img {
  animation: zoomOut 30s ease-in-out infinite;
}


.intro_slide, .intro_slide_img{height: 100%;width: 100%;object-fit: cover;}
.hero_div::before{position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,#000000df 0%, rgba(0,0,0,0)40%,#000000db 100%);content: '';}
.hero_h{font-size: 300%;letter-spacing: 5px;line-height: 110%;font-weight:200;}
.hero_a{background:var(--white);transition:300ms ease;display: flex;align-items: center;justify-content: center;gap:8px;color:var(--black);padding:10px 20px;border-radius: 30px;text-transform: uppercase;letter-spacing: 2px;font-size: 90%;font-family: 'Open Sans',Arial, Helvetica, sans-serif;}
.hero_a:hover{gap:16px}
.hero_a ion-icon{font-size: 150%}

nav{display: flex;align-items: center;justify-content: space-between;position:fixed;top:0;left:0;width: 100vw;height: auto;padding:20px;z-index:10;transition:500ms ease}
body:not(:has(.intro_slide)) nav{background: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.1) 100%);padding:12px 20px}

nav.fix, body:not(:has(.intro_slide)) nav.fix{background: linear-gradient(180deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.5) 100%);padding:12px 20px }

.nav_logo.nl2{display: none;}
.navUl{display: flex;gap:16px}
.nav_logo{height: 80px;}
.navUl a{color:var(--white);font-family: 'Open Sans',Arial, Helvetica, sans-serif;text-transform: uppercase;transition:300ms ease;}
.navUl.sm a{font-size: 150%;opacity: .8;}
.navUl.sm a:hover{opacity: 1}
.navUl.mn a{padding:5px;position:relative}
.navUl.mn a::after{position:absolute;content:'';left:50%;bottom:-2px;height:2px;width:100%;transform: translate(-50%,-50%) scaleX(0);transform-origin: center;background:var(--white);transition:300ms ease}
.navUl.mn a:hover:after{transform: translate(-50%,-50%) scaleX(1)}
.navUl.sm{width: 28%;}
.menu_toggle_img, .menu_overlay{display: none;}

.mopa_div{width:100%;display: grid;grid-template-columns: 45% 1fr;gap:20px;background:#070707}
.mopa_img_container::after{content:'';position:absolute;right:0;bottom:0;height: 100%;width: 50%;background:linear-gradient(to left, #070707 0%, rgba(0,0,0,0)100%);}
.mopa_img_container{width:100%;height: 90vh;overflow: hidden;margin:0 auto;position:relative}
.mopa_img{height: 100%;width: 100%;object-fit: cover;}
.mopa_p_container{display: flex;align-items: flex-start;justify-content: center;flex-direction: column;gap:10px;color:var(--white);padding:1rem}
.section_head{font-weight: 600;font-size: 250%;}
.section_p{font-size: 105%;}
.line{width:100%;height:1px;background:linear-gradient(to right, var(--white)0%,var(--white)70%,rgba(0,0,0,0)100%);opacity: .4;margin:16px 0}
section.mopa, section.wwa{min-height: 100vh}
section.mopa .section_head{font-weight:300}
section.mopa .section_p{font-weight: 300;color:rgb(201, 201, 201)}
.faded_logo{opacity: .8;}

section.wwa{background-image:url('/assets/wwa_bg.webp');background-size: cover;background-repeat: no-repeat;background-position: center;}
.wwa_wwa_container{display: grid;grid-template-columns: 1fr 1fr;gap:20px;padding:100px;border-radius: 30px;border:1px solid var(--white);background:rgba(255,255,255,.05);backdrop-filter: blur(8px);width: 80%;}
.wwa_stats_container{display: grid;grid-template-columns: 1fr 1fr;gap:10px}
.stat_div{border:1px solid var(--white);background:var(--black);padding:20px;color:var(--white);border-radius: 80px;text-align: center;}
.stat_h1{font-weight: 800;font-size: 250%;line-height: 140%;}
.stat_h1 span{display: block;font-weight: 500;text-transform: uppercase;font-size: 35%;width: 100%;line-height: 90%;}
.wwa .section_p{width: 80%;margin-bottom: 20px;}

section.services, section.projects, section.testimonials, section.contact_us, footer {color:var(--white);padding:100px 0}
.service_lia{display: flex;align-items: center;justify-content: space-between;padding:30px 0;width:80%;margin:20px auto}
.service_li{position:relative;overflow:hidden}
.service_li:not(:last-child){border-bottom: var(--border)}
.service_li_bg_img{opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:100%;width:100%;object-fit:cover;transition:500ms ease;pointer-events: none;z-index:1}
.service_li:hover .service_li_bg_img{opacity:.7}
.service_li:hover::after{content:'';position:absolute;top:0;left:0;height: 100%;width:100%;z-index:2;background:rgba(0,0,0,.3)}
.service_name{text-transform: uppercase;font-size: 150%;position:relative;z-index:3}
.service_desc{display: flex;align-items: center;justify-content: space-between;white-space: nowrap;width: 70%;position:relative;z-index:3}
.service_desc .section_p{width: 70%;overflow:hidden;text-overflow: ellipsis;}
.service_desc button{background:var(--white);color:var(--black);padding:8px 20px;border-radius: 30px;font-size: 150%;display: grid;place-items: center;border:1px solid var(--white);transition:500ms ease}
.service_li:hover .service_desc button{background:transparent;color:var(--white)}


.project_grid{margin:60px auto;width:80%;display: grid;grid-template-columns: repeat(4,1fr);gap:24px}
.project_card:nth-of-type(3), .project_card:nth-of-type(4){grid-column: span 2;}
.project_card{position:relative;border-radius: 10px;overflow: hidden;height: 32vh;}
.project_img_wrap{overflow: hidden;height: 100%;width:100%}
.project_img{object-fit: cover;transition:300ms ease;height: 100%;width:100%}
.project_card:hover .project_img{transform:scale(1.05)}
section.projects .hero_a{margin-top: 40px;}
.home_projects{margin-top: 4rem;position:relative;padding-bottom: 40px;}
.home_project{aspect-ratio: 1/1;}
.home_project .project_img_wrap{transform: scale(.8);opacity: .5;pointer-events: none;}
.home_project.swiper-slide-active .project_img_wrap{opacity: 1;transform: scale(1);cursor: pointer;pointer-events: all;}
.hp_btn{position:absolute;top:45%;color:var(--white);transition:500ms ease;aspect-ratio: 1/1;display: grid;place-items: center;font-size:200%;height: 60px;width:60px;border-radius: 50%;z-index:4;border:1px solid transparent}
.hp_btn.prv{left:24%}
.hp_btn.nxt{right:24%}
.hp_btn:hover{border-color: var(--white);background:rgba(255,255,255,.1)}
.projects_slides{z-index:4;height: 50px;margin-bottom: -30px;}
.swiper-pagination-bullet{background:var(--white);height: 8px;width: 8px;}

.testimonials_container{margin:40px auto 0 auto;width:80%;position:relative;padding:40px 0 100px 0}
.tstmnl_quote{height: 30px;}
.client_detail{display: flex;align-items: flex-start;justify-content: space-between;margin:10px 0}
.ratings{display: flex;gap:4px}
.ratings ion-icon{font-size: 80%;}
.testimonial{padding:20px;border:1px solid var(--white);border-radius: 20px;}
.client_title{font-size: 70%;opacity: .7;}
.review{font-size: 90%;opacity: .8;}
.rm_btn{color:var(--white);cursor: pointer;margin-left: 5px;text-decoration: underline;transition:300ms ease;opacity: .5;}
.rm_btn:hover{opacity: 1;}

.contact_grid{width: 70%;border-radius: 20px;overflow: hidden;display: grid;grid-template-columns: 1fr 1fr;border:var(--border)}
.cg_left{position:relative;display: flex;align-items: center;justify-content: center;padding:40px}
.cg_bg{position:absolute;object-fit: cover;opacity: .5;height: 100%;width:100%;top:50%;left:50%;transform: translate(-50%,-50%);}
.cg_left .section_head{width: 80%;font-size: 300%;line-height: 100%;}
.cg_left .section_p{width: 100%;font-size: 200%;margin:10px 0}
.cg_left ion-icon{font-size: 200%;}
.cg_form_wrap{padding:40px}
.inp_label{display: block;margin-left: 10px;margin-bottom: 4px;}
.inp_box{background:none;outline:none;border:var(--border);padding:15px 20px;border-radius: 16px;width: 100%;transition:500ms ease}
.inp_grp{padding:10px 0}
.inp_box:hover{border-color:#eeeeee92}
.inp_box:focus{border-color:var(--white)}

footer{border-top: var(--border);}
.footer_grid{width: 80%;display: grid;grid-template-columns: 20% 20% 1fr 20%;gap:20px}
.footer_logo{height: 80px;margin-top: -5px;}
.footer_lia{padding:10px;opacity:.7;font-size: 110%;transition:300ms ease;position:relative}
.footer_lia:hover{opacity: 1;}
.footer_li{margin-bottom: 10px;}
.footer_lia::after{position:absolute;content:'';bottom:2px;left:60%;height:1px;width:100%;transform-origin: left;transition:300ms ease;transform: translateX(-50%) scaleX(0);background:var(--white)}
.footer_lia:hover:after{transform: translateX(-50%) scaleX(.8)}
.fcd_div{display: flex;align-items: flex-start;justify-content: flex-start;margin-bottom: 10px;gap:10px;opacity: .8;font-size: 90%;}
.fcd_div .section_p{width: 80%;}
.fcd_div ion-icon{font-size: 120%;margin-right: 2px;margin-top: 3px;}
.ftr_ul{display: flex;}
.ftr_li{padding:0 10px;font-size: 150%;display: grid;place-items:center;}
.ftr_lia{opacity: .7;transition:300ms ease}
.ftr_li:hover .ftr_lia{opacity: 1;transform: scale(1.2);}

/* index page styles */

/* about page styles */
.top_img_wrap{height:70vh;position:relative;max-width: 100vw;overflow-x: hidden;}
.top_img{object-fit: cover;height: 100%;width: 100%;}
.pg_cdiv{display: grid;grid-template-columns: 30% 1fr; gap:40px;width: 80%;color:var(--white);padding:80px 0}
.pg_cdetail .section_head{font-size: 170%;margin-bottom: 12px;}
.abt_head_wrap{background:var(--white);display: flex;align-items: center;justify-content: space-evenly;padding:30px 20px;max-width: 100vw;overflow-x: hidden;}
.abt_head_wrap ion-icon{font-size: 300%;}
.pg_container:not(:last-of-type) .pg_cdiv{border-bottom: var(--border)}

/* about page styles */


/* service page styles */
.service_grid{width:80%;display: grid;grid-template-columns: 1fr 1fr;gap:160px;color:var(--white);padding:100px 0}
.service_img{width: 100%;object-fit: contain;height: auto;max-height:50vh;}
.pg_container:has(.service_grid):nth-child(2n) .pg_cdetail{order:2}

/* service page styles */

.top_sec_abs_div{position:absolute;color:var(--white);z-index: 1;top:50%;left:0%;width: 100%;text-align: center;}
.top_sec_abs_div .section_head{font-size: 350%;margin-bottom: -1%;}
.top_sec_abs_div .section_p{font-size: 200%}
.project_tags{color:var(--white);display: flex;align-items: center;justify-content: center;flex-wrap: wrap;gap:4px;margin:40px auto;width: 80%;}
.project_tag{padding:8px 10px;transition:300ms ease;font-size: 120%;font-weight: 400;position:relative;border-radius: 30px;}
.project_tag:not(:first-child)::before{position:absolute;top:50%;left:0;height: 50%;width: 1px;content:'';background:var(--white);transform: translate(-50%,-50%);}
.project_tag.active{border-bottom:2px solid var(--white);border-radius: 0;pointer-events: none}
.projects_container{width: 80%;margin:40px auto;display: grid;grid-template-columns: repeat(3,1fr);gap:40px;color:var(--white)}
.pc_img_wrap{overflow: hidden;height: 50vh;position:relative}
.pc_img{object-fit: cover;height: 100%;width: 100%;transition:500ms ease;filter:grayscale(100%)}
.pc_card{cursor: pointer}
.pc_card:hover .pc_img{transform: scale(1.1);filter:grayscale(0)}
.pc_detail{padding:12px;text-align: center;}
.pc_name{font-size: 180%;}
.pc_img_wrap::after{content:'';position:absolute;bottom:0;left:0;height: 40%;width:100%;background:linear-gradient(to top,rgba(0,0,0,.5)0%,rgba(0,0,0,0)100%);z-index:1}

.blogs_container{color:var(--white);width:80%;margin:100px auto;overflow: hidden;}
.blogs_wrapper{margin-top: 40px;}
.blog_card{padding:32px;border:var(--border);border-radius: 20px;margin-bottom: 20px;}
.blog_tags_div{display: flex;align-items: flex-start;justify-content: space-between;margin-bottom: 16px;}
.blog_ul{display: flex;align-items: center;justify-content: flex-start;gap:8px}
.blog_lia{font-size: 90%;padding:4px 12px;border-radius: 8px;border:var(--border);transition:300ms ease}
.blog_lia:hover{background:rgba(255,255,255,.1)}
.blog_date{opacity: .8;font-size: 80%;}
.blog_det_div{margin-top: 16px;}
.blog_title{font-size: 180%;font-weight: 600;}
.blog_p{font-size: 90%;}

.blog_content{width:70%;margin:100px auto 0 auto;color:var(--white)}
.blog_content ul{list-style: disc;padding-left: 20px;}
.blog_content h1{font-size: 250%;font-weight: 600;}
.blog_content h2{font-size: 200%;margin-top: 40px;margin-bottom:20px;font-weight: 600;}
.blog_content h3{font-size: 180%;margin-top:32px;font-weight: 500;margin-bottom: 16px;}
body:has(.blog_content) .blogs_container{width: 70%;}
body:has(.blog_content) .blogs_container .section_head{font-size: 180%;}
body:has(.blog_content) .blogs_wrapper{display: grid;grid-template-columns: repeat(2,1fr);gap:5px 20px;margin-top: 20px;}
body:has(.blog_content) .blogs_wrapper .blog_title{font-size: 150%;}
body:has(.blog_content) .blogs_wrapper .blog_p{font-size: 80%;}
.blog_content .blog_ul{list-style: none;margin:20px 0;padding-left: 0;}
.post_credits{font-size: 80%;color:rgb(175, 175, 175);margin: 10px 0;}
.post_credits.cat{margin-top: 0;text-decoration: none;color:var(--white);font-size: 90%;}
.post_comments_wrap{margin-top: 20px;}
.post_comment:not(:first-of-type){border-top:var(--border);padding-top: 10px;}
.comment_img_wrap{background:#383838;font-size: 120%;border-radius: 50%;}
.post_comment .mopt_title{margin-top: -3px;}
.comment_text{padding:20px;background:#1a1a1a;margin:10px 0;max-width: 40vw;display: inline-block;border-radius: 10px;}
.comment-notes, .email-notes{font-size: 80%;opacity: .7;margin-bottom: 10px}
.comment-respond label{font-size: 80%;display: block;margin-bottom: 4px;margin-top: 16px;}
.comment-respond input, .comment-respond textarea{background:none;outline:none;border:var(--border);padding:15px 20px;border-radius: 16px;width: 100%;transition:500ms ease;max-width: 40vw;background:#1a1a1a9a;}
.comment-form-cookies-consent{display: flex;justify-content: flex-start;align-items: center;margin-top: 10px}
.comment-form-cookies-consent input{width: 3%;margin-bottom: -10px;}
.form-submit input[type = submit]{background:var(--white);color:var(--black);display: inline-block;cursor: pointer;transition: 300ms ease;padding:8px 20px;border-radius: 8px;font-weight: 500;}
.form-submit input[type = submit]:hover{filter:brightness(110%)}
.form-submit{margin-top: 20px;display: inline-block;}

.galWrap{ max-width: 1000px; margin: 10px auto; position: relative; }
.galleryGrid{display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 1fr 1fr; grid-gap: 5px;}
.sapGal{color: var(--textBlack); font-size: 70%; cursor: pointer; padding: 5px 10px; border-radius: 8px; background: var(--black); position: absolute; bottom: 10px; right: 10px; transition: 300ms ease;border: var(--border); font-weight: 500; z-index: 2}
.sapGal:hover{filter: brightness(120%);}
.galleryImg{width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
.galleryImg:nth-child(1){grid-column: 1 / 3; grid-row: 1 / 3}
.galleryImg:nth-child(2){grid-row: 1 / 3}
.fullScreenGallery{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 5px; grid-auto-flow: dense; max-width: 1000px}
.fsGalleryImg{width: 100%; height: 100%;object-fit: cover;}
.galImg2{grid-column: span 2}
.galImg3{grid-row: span 2}
.galClose{position: fixed; top: 15px; right: 25px; font-size: 150%;transition: 300ms ease;cursor: pointer; z-index: 11;border-radius: 50%;padding:4px;background:rgba(255,255,255,.2);color:var(--white)}
.galClose:hover{background:var(--white);color:var(--black)}
.project_detail_dialog{position:fixed;inset:0;z-index:10;height: 100dvh;height: 100vh;width: 100vw;overflow-y: auto;overflow-x: hidden;display: flex;align-items: center;justify-content: flex-start;padding:40px 0;flex-direction: column;background:var(--black);gap:20px}
.fsGalleryWrap{width:70%;animation: slideFadeIn 300ms ease-in}
.project_detail_dialog .project_detail{width: 70%;color:var(--white)}
.project_detail_dialog .project_detail .client_name{font-weight: 600;font-size: 180%;}
.hp_btn.tst{top:82%;z-index:4;height: 40px;width: 40px;font-size: 100%;background:rgba(255,255,255,.1)}
.hp_btn.tst.prv{left:46.5%}
.hp_btn.tst.nxt{right:46.5%}
.testimonials_container.swiper-pagination{pointer-events: none;}

.ind_animation{position:fixed;inset: 0;background:var(--black);z-index:10;display: flex;align-items: center;justify-content: center;animation:fadeOut 3000ms linear;opacity: 0;pointer-events: none;}
.ind_anim_logo{animation:growSlideUp 3000ms linear;position:absolute;left:49.8%}
.hd1{display: none;}
@media (max-width:738px){

    ::-webkit-scrollbar {height: 0px;width: 0px;}

    body{width: 100vw;overflow-x: hidden;max-width: 100vw;}
    .hero_div{padding-bottom: 10px}
    .hero_div::before{bottom:-2px}
    .hero_h{font-size: 90%;width: 90%;letter-spacing: 2px;margin-top: 5rem;}
    .hero_section{height:35dvh;height:35vh}
    .hero_section .hero_a, .hd1 .hero_a{padding:8px 16px;font-size: 70%}
    .hero_div .hero_h, .hero_div .hero_a{display: none;}
    .hd1{display: flex;flex-direction: column;align-items: center;justify-content: center;width: 90%;margin: 0 auto;color:var(--white);text-align: center}
    .hd1 .hero_h{margin-bottom: 20px;margin-top: 40px;}


    .navUl.sm{display: none;}
    .menu_overlay{position:fixed;z-index:5;height:100vh;width:100vw;top:0;left:0;display: block;pointer-events: none;opacity: 0;transition: 200ms ease;backdrop-filter: blur(2px);}
    .navUl.mn{position:fixed;top:0;left:-100vw;width:75vw;background:var(--white);height:100vh;flex-direction: column;padding-top: 20vh;transition:300ms ease}
    .navUl.mn a{padding:30px 20px;color:var(--black)}
    .navUl.mn li{padding:10px 0;display: block;width:100%;}
    .navUl.mn li:not(:last-child){border-bottom: 1px solid #eeeeee2c;}
    .menu_toggle_img{display: block;height:16px;margin-bottom: 8px;}
    body:has(nav.show) .menu_overlay{opacity: 1;pointer-events: all;transition: 200ms ease;}
    nav.show .navUl.mn{left:0}
     
    .nav_logo{height: 65px;margin-left: 78%;}
    .nav_logo.nl1{display: none;}
    .nav_logo.nl2{display: block;height: 50px;}
    nav{border-color:#eeeeee2c;}

    section{max-width: 100vw;overflow-x: hidden;}

    .mopa_div{width:100%;grid-template-columns: 1fr;padding:0 0 4rem 0;position:relative}
    .wwa_wwa_container{width:100%;grid-template-columns: 1fr;}
    .mopa_img_container{height: 50vh;width: 100%;}
    .mopa_img{width: 70%;}
    .section_head{font-size: 150%;}
    .section_p{font-size: 90%;}
    .mopa_p_container{gap:5px;text-align: left;align-items: center}
    .faded_logo{position:absolute;height: 30vh;left:80%;transform: translate(-50%,-50%);bottom:30%;z-index:3;opacity: .6;}
    .mopa_img_container::before{content:'';position:absolute;right:0;bottom:0;width:100%;height:40%;background:linear-gradient(to top, var(--black) 0%,rgba(0,0,0,0)100%)}
    .mopa_div::before{content:'';position:absolute;right:0;top:0;width:100%;height:20%;background:linear-gradient(to bottom, var(--black) 0%,var(--black) 50%,rgba(0,0,0,0)100%);z-index:3}
    .mopa_img_container::after{width: 70%;right:30%;width:30%}
    section.mopa{position:relative}
    section.mopa .section_head{width: 100%;}


    .wwa_wwa_container{padding:40px 20px;gap:40px;width: 90%;}
    .wwa_wwa_container .mopa_p_container{padding:0}
    .stat_h1{font-size: 150%;}
    .stat_div{padding:10px}

    .service_lia{width:90%;flex-direction: column;align-items: flex-start;justify-content: flex-end;}
    .service_desc{white-space: wrap;width: 100%;align-items: flex-start;margin-top: 10px;}
    .service_name{font-size: 120%;}
    .service_desc button{padding:4px 10px;font-size: 120%}
    section.services, section.testimonials, footer{padding:80px 0}

    .project_grid{grid-template-columns: 1fr 1fr;gap:14px;width: 90%;margin:40px auto}
    .project_card{height: 20vh;}
    section.projects{border-top:var(--border);border-bottom:var(--border) }
    .hp_btn{top:30%}
    .hp_btn.prv{left:5%}
    .hp_btn.nxt{right:5%}
    .hp_btn.tst.prv{left:37%}
    .hp_btn.tst.nxt{right:37%}
    .hp_btn.tst{top:80%}

    .testimonials_container{width:90%;margin:40px auto 20px auto;padding-top:20px}
    section.testimonials .section_head{width:80%;text-align: center;}
    .review{font-size: 76%;}

    .contact_grid{width: 90%;grid-template-columns: 1fr;}
    section.contact_us{border-top: var(--border);}
    .cg_left .section_head{width: 80%;font-size: 200%;width: 100%;}
    .cg_left .section_p{font-size: 100%}
    .cg_form_wrap{padding:20px;padding-bottom: 40px;}
    .inp_box{font-size: 90%;padding:16px 12px;}

    .footer_grid{width: 90%;grid-template-columns: 1fr;gap:40px}
    .footer_ul{display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-start;margin-left: -10px;}
    .footer_lia{font-size: 90%;}
    .ftr_ul{margin-left: -10px;}

    .top_img_wrap{height:30vh}
    .pg_cdiv{grid-template-columns: 1fr; gap:20px;width: 90%;padding:50px 0 70px 0}
    .pg_cdetail .section_head{font-size: 120%;margin-bottom: 5px;}
    .abt_head_wrap{padding:20px 16px}
    .abt_head_wrap .section_head{font-size: 90%}
    .abt_head_wrap ion-icon{font-size: 100%;}

    .service_grid{width: 90%;grid-template-columns: 1fr;gap:40px;padding:50px 0}
    .pg_container:has(.service_grid) .pg_cdetail{order:2}

    .top_sec_abs_div{text-align: center;width: 100%;left:0}
    .top_sec_abs_div .section_head{font-size: 150%;}
    .top_sec_abs_div .section_p{font-size: 100%}
    .project_tags{width: 100vw;overflow-x: auto;flex-wrap: nowrap;justify-content: start;padding-left: 10px;margin-top: 20px;gap:0;margin-bottom: -10px;}
    .project_tag{font-size: 70%;padding:8px;white-space: nowrap;font-weight: 400; }
    .project_tag:not(:first-child)::before{left:0}

    .projects_container{width: 90%;margin:20px auto;grid-template-columns: 1fr;gap:24px}
    .pc_detail{padding:8px}
    .pc_name{font-size: 100%;}
    .pc_img_wrap{height: 28vh;}

    .blogs_container{width:90%;margin:40px auto}
    .blogs_wrapper{margin-top: 20px;}
    .blog_card{padding:16px}
    .blog_lia{font-size: 70%}
    .blog_date{opacity: .8;font-size: 60%;}
    .blog_title{font-size: 120%;margin-bottom: 10px;}
    .blog_p{font-size: 70%;}

    .blog_content{width:90%;margin-top: 40px;}
    .blog_content h1{font-size: 180%;}
    .blog_content h2{font-size: 160%;margin: 28px 0 8px 0}
    .blog_content h3{font-size: 140%;margin:28px 0 8px 0;font-weight: 500}

    body:has(.blog_content) .blogs_container{width: 90%;}
    body:has(.blog_content) .blogs_container .section_head{font-size: 150%;}
    body:has(.blog_content) .blogs_wrapper{grid-template-columns: 1fr;gap:0}
    body:has(.blog_content) .blogs_wrapper .blog_title{font-size: 120%;}
    body:has(.blog_content) .blogs_wrapper .blog_p{font-size: 70%;}
    .comment_text{max-width: 100%;}
    .comment-respond input, .comment-respond textarea{max-width:100%}
    .blog_content p{font-size: 90%;}

    .galClose{top: 10px; right: 10px; font-size: 100%}
    .fsGalleryWrap{width:85%}
    .project_detail_dialog .project_detail{width: 85%}
    .project_detail_dialog .project_detail .client_name{font-size: 120%;}
    .project_detail_dialog{padding:20px 0}
    .fullScreenGallery{grid-template-columns: repeat(3,1fr);}

    .ind_anim_logo{height:50px}


}
@keyframes rotate {
    0%{transform: rotate(0deg);}
    50%{transform: rotate(360deg);}
    100%{transform: rotate(0deg);}
}
@keyframes slide {
    0%{transform: translateX(80%);}
    100%{transform: translateX(-120%);}
}
@keyframes slideDown {
    0%{top:-100px}
    100%{top:0}
}
@keyframes slideUp {
    0%{bottom:-100px}
    100%{bottom:0}
}
@keyframes bs_slide {
    0%{opacity:0;margin-bottom: -150px;}
    100%{opacity:1;margin-bottom: 0;}
}
@keyframes bs_slide1 {
    0%{margin-bottom: -100vh;}
    100%{margin-bottom: 0;}
}
@keyframes slideFadeIn {
    0%{bottom: -100vh; opacity: 0}
    100%{bottom: 0; opacity: 1}
}

@keyframes smoothbounceball{ 
    from { transform: translate3d(0, 0, 0) scale(1); opacity: .8;} 
    to { transform: translate3d(0, 5px, 0) scale(.8); filter:brightness(120%); opacity: 1;} 
} 

@keyframes zoom {
    0%{transform: translate(-50%,-50%) scale(0);}
    100%{transform: translate(-50%,-50%) scale(1);}
}
@keyframes grow {
    0%{transform: translateY(-50%) scale(0); opacity:0;}
    100%{transform: translateY(-50%) scale(1);opacity: 1;}
}
@keyframes smallBall {
    0%{margin-left:0;transform: scale(0);opacity: 0;}
    50%{margin-left:-50px;transform: scale(.8); width:180px;border-radius: 50px;opacity: 1;}
    100%{margin-left:0;width:100px;}
}
@keyframes sbImg {
    0%{opacity: 0; right:-100px}
    50%{opacity: 1; right:-100px}
    100%{opacity: 1; right:11px}
}
@keyframes cmAn {
    0%{opacity: 0; transform:scale(0)}
    60%{opacity: 0; transform:scale(0)}
    70%{opacity: 1; transform:scale(1)}
    100%{opacity: 1; transform:scale(1)}
}
@keyframes slideSDbefore {
    0%{transform: scale(0);left:-50px}
    50%{transform: scale(0);}
    100%{transform: scale(2);left:0}
}
@keyframes slideSDbefore1 {
    0%{transform: scale(0);right:-50px;bottom:-50px}
    50%{transform: scale(0);bottom:0}
    100%{transform: scale(2);right:0;bottom:0}
}
@keyframes slidejksd {
    0%{opacity:0;margin-bottom: -200px;}
    80%{opacity:0;margin-bottom: -200px;}
    100%{opacity:1;margin-bottom: 0;}
}
@keyframes zoomIn {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
  }
  
  @keyframes zoomOut {
    0% { transform: scale(1.2); }
    50% { transform: scale(1); }
    100% { transform: scale(1.2); }
  }


  @keyframes growSlideUp{
    0%{transform: translate(-50%,-50%) scale(0);top:50%}
    10%{transform: translate(-50%,-50%) scale(1.2);top:50%}
    40%{transform: translate(-50%,-50%) scale(1.2);top:50%}
    70%{transform: translate(-50%,-50%) scale(.8); opacity: .4;}
    80%{transform: translate(-50%,-50%) scale(.6); top:8.35%;}
    100%{transform: translate(-50%,-50%) scale(0); top:8.35%;opacity: 0;}
  }

    @keyframes growSlideUp1{
    0%{transform: translate(-50%,-50%) scale(0);top:50%;left:50%}
    10%{transform: translate(-50%,-50%) scale(1.5);top:50%;left:50%}
    40%{transform: translate(-50%,-50%) scale(1.5);top:50%;left:50%}
    80%{transform: translate(-50%,-50%) scale(1); top:2.8rem;left:19%}
    100%{transform: translate(-50%,-50%) scale(1); top:2.8rem;left:19%}
  }

  @keyframes fadeOut {
    0% { opacity: 1; }
    90% { opacity: 1; }
    100% { opacity: 0; }
  }