/*
 Theme Name:   Sumobaby Child
 Description:  Custom theme built on Understrap
 Author:       Sumobaby
 Author URI:   https://www.sumobaby.net
 Template:     understrap
 Version:      1.0.1
 
*/

:target {
    scroll-margin-top: 110px;
}


:root {
    --bs-primary-rgb:  0,74,173;
    --primary: rgba(246, 246, 246, 1);
    --secondary: rgba(25, 25, 25, 1);
    --blue: rgba(0, 74, 173, 1);
    --yellow: rgba(254, 255, 185, 1); 
    --black: #191919;
}
html { scroll-behavior: smooth; }


body { font-family: "Lekton", monospace; font-weight: 400; line-height: 1.6; font-size:20px ; color: var(--secondary);  }
body, a, button{ cursor: none !important; font-size: 16px; }

/* Ensure native cursor is visible over Termly banner */
[class^="termly-styles-"],
[class^="termly-styles-"] * {
  cursor: auto !important;
}

/* Make interactive items show pointer */
[class^="termly-styles-"] button,
[class^="termly-styles-"] a,
[class^="termly-styles-"] [role="button"] {
  cursor: pointer !important;
}


h1, h1 , h3, h4 {  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 500; }
h1, .h1 { font-size: 80px; text-transform: uppercase; }
h2, .h2{ font-size: 50px; }
h3 { font-size: 30px; }
h4 { font-size: 20px; }
section { background: #fff; position: relative; }
h1.mainheading { font-size:3rem; }
h2.heroheading { font-size: 2rem }

#wrapper-navbar { position: fixed; top: 0; z-index: 9500; display: block; transition: 0.3s all; background-color: transparent; width: 100% }
#page-wrapper { padding-top: 3em }
.home #page-wrapper { padding-top:0; }
.navbar-nav .menu-item {  margin-left:0.8em; margin-right:0.8em; display: inline-flex; align-items: center; }
.navbar-nav .nav-link, .navbar-nav .menu-item { font-family: "Lekton", monospace; font-weight: 400; font-size:1em; text-decoration: none; }
.navbar-nav .nav-link { position: relative; }
.navbar-nav .nav-link:before, .blacklink:before { position: absolute; bottom: 10px; display: block; content: ""; width: 0; height: 1px; background-color: var(--secondary);  transition: width 0.2s ease-in-out;  left: 50%; transform: translateX(-50%);  }
.navbar-nav .nav-link:hover:before, .navbar-nav .nav-link:focus:before { width: 90%; }

.blacklink { text-decoration: none; color: var(--black);  position: relative; }
.blacklink:hover, .blacklink:focus { color: var(--black); }
.blacklink:before { bottom: 3px; }
.blacklink:hover:before, .blacklink:focus:before { width: 90%; }


.slide-bg picture, .hero-poster, .hero-video { width: 100%; height: 100%; object-fit: cover; position: absolute; }
.slide-bg picture { z-index: 1; }

section.hero-video-container { height: 85vh; overflow: hidden;  position:relative !important; display: flex; flex-direction: column; justify-content: space-between; }
.hero-video {  width: 100%; height: 100%; object-fit: cover; z-index: 2; }
.hero-overlay { position: absolute; inset: 0; /*backdrop-filter: blur(1px); */mix-blend-mode:multiply; background-color: rgba( 0,74,173, 0.3); z-index: 20; pointer-events: none; }
.hero-content { position: relative; z-index: 90; }
.slide-bg { position: absolute; width: 100%; display: flex; justify-content: center; left: 0; height: 100%; min-height: 100vh; z-index: 1; overflow: hidden }


.light, .light h1, .light h2, .light h3, .light h4, .light p, .light a {  color: var(--primary);  transition: all ease-in-out 0.6s; }
.dark, .dark h1, .dark h2, .dark h3, .dark h4, .dark p , .dark a{ color: var(--secondary); transition: all ease-in-out 0.6s; }
.light, .light section  { background-color: var(--secondary); transition: all ease-in-out 0.6s;  }
.dark, .dark section  { background-color: white; transition: all ease-in-out 0.6s;  }

.dark .sub-menu-trigger:after, .sticky .sub-menu-trigger:after { border-top-color: var(--secondary); }
h2.heroheading span { display: block; width: 100%; }

.menucta { color: #fff }

.scrambling-text { position: absolute; bottom: 20px; right: 20px; z-index: 10; font-size: 1.5rem; text-align: right; pointer-events: none; white-space: nowrap; z-index: 50; }
.scrambling-text span { display: none; }
.scrambling-text span.scramble { display: inline; }
.centered-list { display: inline-block; text-align: left; list-style-position: inside; padding-left: 0; }

.navbar-expand-lg .navbar-nav .dropdown-menu { position: absolute; top: 100%; }

@media screen and (min-width:992px) {
  .navbar-expand-lg .navbar-nav .menu-item:hover .dropdown-menu { display: block; }
  .navbar-expand-lg .navbar-nav .menu-item:hover .sub-menu-trigger:after { transform: rotate(180deg); }

}

.navbar-expand-lg .navbar-nav .menu-item .dropdown-menu .menu-item a { color: #191919; }
.dropdown-toggle::after { transition: all ease-in-out 0.3s; display: none; }
.sub-menu-trigger:after { display: inline-block; margin-left: .255em; vertical-align: .255em; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-bottom: 0; transition: all ease-in-out 0.3s; border-left: .3em solid transparent; }
.navbar-expand-lg .navbar-nav .dropdown-menu li { width: 100%; left: 0; margin: 0; }


.cursor { pointer-events: none; }
.cursor__ball { position: absolute; top: 0; left: 0; mix-blend-mode: difference; z-index: 999990; }      
circle { fill: #f7f8fa; }

.home header.light nav#main-nav a.navbar-brand img { filter: brightness(0) invert(1); }
.home header.light.sticky nav#main-nav a.navbar-brand img { filter: none; }
.navbar-nav .nav-link{ font-size: 18px; font-weight: 400; }
a.btn-primary { text-decoration: none; font-weight: 700; padding: 11px 12px; line-height: 1; letter-spacing: 2px; text-transform: uppercase; align-items: center; gap: 20px;  position: relative; }
a.btn-primary:after { content: ""; background-image: url(./images/white-arrow.svg); width: 12px; height: 12px; background-repeat: no-repeat; background-position: center; }
a.btn-primary.black, .dark a.btn-primary, .home .sticky a.btn-primary.menucta  { color: var(--secondary); }
a.btn-primary.black::after, .dark a.btn-primary::after, .home .sticky a.btn-primary.menucta::after { filter: invert(140%) sepia(8%) saturate(78%) hue-rotate(90deg) brightness(8%) contrast(100%); }
a.btn-primary:before { content: ""; display: inline-block; position: absolute; width: 100%; height: 1px; background:var(--primary); bottom: 0; transition: width 0.2s ease-in-out; left: 50%; transform: translateX(-50%); }
a.btn-primary:hover:before { width:0%; }
a.btn-primary.black:before, .dark a.btn-primary:before, .home .sticky a.btn-primary.menucta:before { width: 100%; background-color: var(--secondary); } 
a.btn-primary.black:hover:before, .dark a.btn-primary:hover:before, .home .sticky a.btn-primary.menucta:hover:before { width: 0; } 

header#wrapper-navbar.sticky { background-color: var(--primary); box-shadow: 0 0 6px 0px rgb(25 25 25 / 30%); }
.home .sticky .navbar-nav li a.nav-link{ color: var(--secondary); }
nav#main-nav { padding: 40px 20px; transition: 0.3s all; }
.sticky nav#main-nav { padding:  20px; }
/* banner */
.hero-video-container .hero-content{ padding-bottom: 100px; }
.scrambling-text{ bottom: 80px; right: 10px; font-size: 26px; font-weight: 400; }
.banner-lines { position: absolute; width: 100%; height: 100%; display: grid; grid-template-columns: repeat(4, 1fr);  margin: 0 auto; left: 0; right: 0; }
.banner-lines .line { border-left: 1px solid rgb(246 246 246 / 16%); }
.banner-lines .line:last-child { border-right: 1px solid rgb(246 246 246 / 16%); }

/* Padding Bottom */
.pb-6  { padding-bottom: 4.5rem!important; }
.pb-7  { padding-bottom: 6rem!important;   }
.pb-8  { padding-bottom: 9rem!important;   }
.pb-9  { padding-bottom: 12rem!important;  }
.pb-10 { padding-bottom: 15rem!important;  }

/* Padding Start (left in LTR / right in RTL) */
.ps-6  { padding-inline-start: 4.5rem!important; }
.ps-7  { padding-inline-start: 6rem!important;   }
.ps-8  { padding-inline-start: 9rem!important;   }
.ps-9  { padding-inline-start: 12rem!important;  }
.ps-10 { padding-inline-start: 15rem!important;  }

/* Padding End (right in LTR / left in RTL) */
.pe-6  { padding-inline-end: 4.5rem!important; }
.pe-7  { padding-inline-end: 6rem!important;   }
.pe-8  { padding-inline-end: 9rem!important;   }
.pe-9  { padding-inline-end: 12rem!important;  }
.pe-10 { padding-inline-end: 15rem!important;  }

/* Padding Y (top + bottom) */
.py-6  { padding-top: 4.5rem!important; padding-bottom: 4.5rem!important; }
.py-7  { padding-top: 6rem!important;   padding-bottom: 6rem!important;   }
.py-8  { padding-top: 9rem!important;   padding-bottom: 9rem!important;   }
.py-9  { padding-top: 12rem!important;  padding-bottom: 12rem!important;  }
.py-10 { padding-top: 15rem!important;  padding-bottom: 15rem!important;  }


/* Margin Top */
.mt-6  { margin-top: 4.5rem!important; }
.mt-7  { margin-top: 6rem!important;   }
.mt-8  { margin-top: 9rem!important;   }
.mt-9  { margin-top: 12rem!important;  }
.mt-10 { margin-top: 15rem!important;  }

/* Margin Bottom */
.mb-6  { margin-bottom: 4.5rem!important; }
.mb-7  { margin-bottom: 6rem!important;   }
.mb-8  { margin-bottom: 9rem!important;   }
.mb-9  { margin-bottom: 12rem!important;  }
.mb-10 { margin-bottom: 15rem!important;  }

/* Margin Start */
.ms-6  { margin-inline-start: 4.5rem!important; }
.ms-7  { margin-inline-start: 6rem!important;   }
.ms-8  { margin-inline-start: 9rem!important;   }
.ms-9  { margin-inline-start: 12rem!important;  }
.ms-10 { margin-inline-start: 15rem!important;  }

/* Margin End */
.me-6  { margin-inline-end: 4.5rem!important; }
.me-7  { margin-inline-end: 6rem!important;   }
.me-8  { margin-inline-end: 9rem!important;   }
.me-9  { margin-inline-end: 12rem!important;  }
.me-10 { margin-inline-end: 15rem!important;  }

/* Margin Y (top + bottom) */
.my-6  { margin-top: 4.5rem!important; margin-bottom: 4.5rem!important; }
.my-7  { margin-top: 6rem!important;   margin-bottom: 6rem!important;   }
.my-8  { margin-top: 9rem!important;   margin-bottom: 9rem!important;   }
.my-9  { margin-top: 12rem!important;  margin-bottom: 12rem!important;  }
.my-10 { margin-top: 15rem!important;  margin-bottom: 15rem!important;  }


.pagination .next, .pagination .prev { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-size: 1.2em }

#wrapper-footer { padding-top: 90px; padding-bottom: 0; }
.site-footer .hero-left { margin-bottom: 44px; }
.site-footer .hero-right h2 { font-size: 70px; color: var(--secondary); margin-bottom: 50px; }
.footer-wrapper-menus { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 135px 0; }
.footer-wrapper-menus .footer-menu { display: flex; gap: 90px; color: var(--secondary); }
.footer-wrapper-menus .footer-menu ul { list-style: none; padding-left: 0; }
.footer-wrapper-menus .footer-menu ul a { text-decoration: none; font-weight: 700; color: var(--secondary); letter-spacing: 2px; text-transform: uppercase; position: relative; margin-bottom: 6px; display: inline-block; }
.footer-wrapper-menus .footer-menu ul a:after { position: absolute; bottom: 2px; display: block; content: ""; width: 0; height: 1px; background-color: var(--secondary); transition: width 0.2s ease-in-out; left: 50%; transform: translateX(-50%); }
.footer-wrapper-menus .footer-menu ul a:hover:after { width: 100%; }
.social-icon{ gap: 28px; }
.social-icon i { color: var(--blue); font-size: 24px; }
.copyrigth { background-color: var(--blue); color: var(--primary); text-align: center; padding: 10px; font-weight: 400; }
.copyrigth p { margin-bottom: 0; line-height: 1.3; }
.copyrigth a { color: var(--primary); text-decoration: none; }


/* newsletter */
.newsletter-sec { display: flex; background-color: var(--secondary); border-radius: 999px; align-items: center; }
.newsletter-sec .newsletter-img img { border-radius: 999px; max-height: 370px; width: 100%; object-fit: cover; height: 100%; }
.newsletter-sec .newsletter-form .gf_browser_chrome { border-top-right-radius: 999px; border-bottom-right-radius: 999px; height: 100%; }
section.subscribe { padding: 150px 0; }
.newsletter-form .gf_browser_chrome { width: 65%; margin: 0 auto; }
.newsletter-sec h2{ color: var(--primary); }
.newsletter-sec p.gform_description { color: #AAAAAA; font-weight: 400; margin-bottom: 50px; }
.subscribe .newsletter-sec .newsletter-form .gform_fields input { font-size: 16px; background-color: transparent; border: 0; border-radius: 0; border-bottom: 1px solid #AAAAAA; padding: 19px 25px; padding-top: 0; color: #F6F6F6; padding-right: 100px; font-family: 'HelveticaNeue', sans-serif; }
.subscribe .newsletter-sec .newsletter-form .gform_fields input::placeholder{ color: #717171; font-size: 17px; font-weight: 500; }
.subscribe .newsletter-sec .newsletter-form .gform_fields input:focus-visible, .subscribe .newsletter-sec .newsletter-form .gform_fields input:focus { border: 0; border-radius: 0; border-bottom: 2px solid #AAAAAA; outline: none; }
#page .subscribe .newsletter-sec .gform-footer.gform_footer input.gform_button[type="submit"]:focus{ outline: none; border: none; }
.subscribe .newsletter-sec .newsletter-form .gf_browser_chrome form { position: relative; }
.subscribe .newsletter-sec .newsletter-form .gform-theme--framework .gform_validation_errors { display: none; }
.gform-footer.gform_footer { position: absolute; right: 0; top: 0; margin: 0 !important; }

#page .subscribe .newsletter-sec .gform-footer.gform_footer input.gform_button[type="submit"] {
    letter-spacing: 2px;
    font-weight: 700;
    color: #F6F6F6;
    background-color: transparent;
    font-size: 16px;
    line-height: 1;
    text-transform: uppercase;
    padding-left: 0;
    padding-right: 50px;
    background-image: url(./images/white-arrow.svg);
    background-repeat: no-repeat;
    background-position: right 25px center;
    transition: all ease-in-out 0.3s;
}

#page .subscribe .newsletter-sec .gform-footer.gform_footer input.gform_button[type="submit"]:hover {
    background-position: right 20px center;
}

/* LOGO SLIDER */
.swiper.logo-slider .swiper-slide.slick-slide { padding: 15px; margin: 0 20px; }
.swiper.logo-slider .swiper-slide.slick-slide img { filter: grayscale(1); transition: 0.3s all; }
.swiper.logo-slider .swiper-slide.slick-slide:hover img { filter: none; }

/* counter numbers */
section.stats-section { padding-top: 170px; } 
.num-counter .right-side > h2, .num-counter .right-side > p { width: 80%; }
.num-counter .right-side h2 { margin-bottom: 30px; }
.num-counter .right-side > p { font-size: 16px; color: #AAAAAA; font-weight: 400; }
.stats-grid { margin-top: 100px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.stats-grid .stat-item h3 { font-size: 60px; color: #FEFFB9; font-weight: 500; }
.stat-item { text-align: center; }
.stats-grid .stat-item p { font-size: 20px; font-family: 'HelveticaNeue', sans-serif; }

/* article */

.article-section { padding: 200px 0 230px; }
.article-section .latest-article { display: flex; }
.article-section .left-side { width: 33%; }
.article-section .right-side { width: 67%; padding-left: 20px; }
.progress { display: block; width: 80%; height: 2px; border-radius: 10px; overflow: hidden; background-color:  rgba(246, 246, 246, 0.1); background-image: linear-gradient(to right, #ffffff, #ffffff); background-repeat: no-repeat; background-size: 0 100%; transition: background-size .4s ease-in-out; margin-top: 50px; }
/* .blog_selection-my-slider .slick-slide {
  margin-right: 50px; 
} */
 .blog_selection-my-slider .slick-slide { margin-right: 25px; margin-left: 25px; }
/* .blog_selection-my-slider .slick-list.draggable {
    padding-right: 20px;
} */

.blog_selection-my-slider .swiper-slide picture {
  aspect-ratio: 1200 / 808;
  width: 100%;
  display: block;
  overflow: hidden;

}

.blog_selection-my-slider .swiper-slide picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: all .3s ease-in-out;
}


.blog_selection-my-slider .swiper-slide.slick-slide:hover  img {
    transform: scale(1.1);
}


.blog_selection-my-slider .swiper-slide.slick-slide .slide-content{
    margin: 30px 0;
    padding-right: 80px;
}

.blog_selection-my-slider .swiper-slide.slick-slide .slide-content a {
    text-decoration: none;
}

.article-section .left-side{
    margin-left: calc((100% - 1460px) / 2 + 12px);
    flex: 0 0 24%;
}
.article-section .right-side{
     flex: 1; 
     overflow: hidden;
}

button.slick-arrow {
    font-size: 0;
    background: none;
    border: 0;
    background-image: url(./images/white-arrow.svg);
    background-repeat: no-repeat;
    background-position: center;
        width: 20px;
    height: 20px;
    position: absolute;
    top: 40px;
    left: 25px;
}
.blog_selection-my-slider {
    padding-top: 130px;
        margin: 0 -25px;
}
button.slick-prev.slick-arrow {
    transform: rotate(-135deg);
}
button.slick-next.slick-arrow {
    transform: rotate(45deg);
    left: 65px;
    margin-top: -2px;
}
.blog_selection-my-slider .slick-list {
  padding-left: 5px !important;   
  padding-right: 43%;           
}

/* services */
.services-sec{
    padding: 80px 0 200px;
}
.intro-content{
    width: 70%;
}
.intro-content p{
    font-size: 16px;
    font-weight: 400;
}
.services-sec ul.nav li.nav-item a {
    color: #191919;
    background: none;
    text-transform: none;
    position: relative;
        margin-bottom: 30px;
}
.services-sec ul.nav li.nav-item a.active::before {
    position: absolute;
    content: "";
    background-image: url(./images/blue-arrow.svg);
    background-repeat: no-repeat;
    background-position: left bottom;
    width: 30px;
    height: 30px;
    left: -50px;
    bottom: 30px;
}
.services-tab{
    gap: 80px;
}
.services-tab .tab-content {
    padding-left: 60px;
}
.services-feature-sec {
    background: #EDEDED;
    padding: 100px;
    border-radius: 10px;
    height: 430px;
    display: flex;
    align-items: center;
    margin-bottom: 30px;
    justify-content: center;
}
.services-feature{
    width: 100%;
    height: 100%;
}
.services-tab  .tab-pane .services-feature-sec{
  position: relative;
  overflow: hidden;
}
/* .tab-pane .services-feature, .tab-pane.active .services-feature{
    transition: 1s all;
} */
/* .tab-pane .services-overlay {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    transform: translateY(0%);
    transition: transform 2.5s cubic-bezier(.22, .9, .3, 1);
    top: 0;
    background-color: #EDEDED;
} */
/* .tab-pane .services-overlay.revealed {
    transform: translateY(-100%);
}
@media (prefers-reduced-motion: reduce) {
  .tab-pane .services-overlay {
    transition: none;
    transform: none !important;
  }
} */
 .tab-pane {
    opacity: 0;
    transition: opacity 0.6s ease-in-out;
    max-height: 0;
    overflow: hidden;
}
.tab-pane.fade-in {
    opacity: 1;
    max-height: fit-content;
}
.tab-pane .service-content {
    opacity: 0;
    transition: fade 0.3s ease 0.3s!important;
}
.tab-pane.fade.fade-in  .service-content {
    opacity: 1;
}
/* .services-feature img {
  opacity: 0;
  transition: opacity 0.5s ease-in-out 0.2s !important;
}

.tab-pane.show .services-feature img {
  opacity: 1;
} */
/* .services-feature .services-overlay{
  display: block;
  background-color: #191919;
  width: 100%;
  hei
  transform: translateY(0);       
  transition: transform 1.5s ease-in-out;
}

.services-feature .services-overlay.revealed {
  transform: translateY(100%);  
} */


/* projects */

section.case-studies-showcase { padding: 30px 0 150px; }
.section-header { max-width: 500px; margin: 0 auto; margin-bottom: 45px; }
.case-studies-showcase .container { min-height: 1550px; }
.case-studies-card { position: absolute; }
.case-studies-card.case-studies-card-1 { top: -20px; }
.case-studies-card.case-studies-card-1 img { width: 280px; height: 260px; }
.case-studies-card.case-studies-card-2 { right: 140px; top: 140px; }
.case-studies-card.case-studies-card-2 img { width: 335px; height: 420px; }
.case-studies-card.case-studies-card-3 { top: 515px; left: 240px; }
.case-studies-card.case-studies-card-3 img { width: 370px; height: 340px; }
.case-studies-card.case-studies-card-4 { right: 0; top: 700px; }
.case-studies-card.case-studies-card-4 img { width: 236px; height: 260px; }
.case-studies-card img { transform: scale(1); transition: all ease-in-out 0.3s; }
.case-studies-card:hover img { transform: scale(1.05); }
.case-studies-card.case-studies-card-5 { bottom: 100px; left: 0; top: auto; }
.case-studies-card.case-studies-card-5 img { width: 276px; height: 260px; }
.case-studies-card.case-studies-card-6 { bottom: 0; right: 380px; }
.case-studies-card.case-studies-card-6 img { width: 335px; height: 420px; }
.section-header-wrapper { position: relative; }
.section-header { position: sticky; top: 50%; transform: translateY(-50%);  z-index: 3; }
.case-studies-card img { background: #0000000D; object-fit: cover; border-radius: 10px; }
.case-studies-card p.case-studies-meta { margin-top: 10px; color: var(--secondary); font-weight: 400; line-height: 1.6; font-size: 16px; text-decoration: none; }

/* breadcrumb */
.custom_breadcrumb{
    padding: 0 12px;
    padding-top: 100px;
}
.page-main-title p, .page-main-title h1 {
    margin-bottom: 0;
}
.custom_breadcrumb nav.breadcrumb {
    column-gap: 10px;
    color: #AAAAAA;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
}
.custom_breadcrumb nav.breadcrumb a {
    color: var(--secondary);
    text-decoration: none;
    font-size: 18px;
}

/* services page */
.head-border-b {
    border-bottom: 1px solid #AAAAAA;
    padding-bottom: 25px;
}
.head-space{
    padding-bottom: 55px;
}
.service-section .service-icon img {
    max-width: 130px;
}
.service-section .service-icon {
    background: #EDEDED;
}
.service-section .service-icon {
    background: #EDEDED;
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    position: relative;
}
.service-section {
    padding: 55px 0;
    background-color: transparent;
    transition: background-color 0.5s ease;
    position: relative;
    overflow: hidden;
}
.service-detail{
    display: flex;
    align-items: flex-end;   
    justify-content: space-between;
    z-index: 1;
}
.service-detail p{
    width: 55%;
    margin-bottom: 0;
}
.service-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.service-name{
    position: relative;
}
.service-num{
    position: absolute;
}
.service-num {
    position: absolute;
    left: -20px;
    font-size: 20px;
    font-weight: 500;
    top: 4px;
    color: var(--secondary);
    font-family: 'HelveticaNeue', sans-serif;
    margin: 0;
}
.service-name small {
    color: #AAAAAA;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}
.service-section.top .service-num, .service-section.top  small, .service-section.top  h2, .service-section.top  p,  .service-section.top a, 
.service-section.bottom .service-num, .service-section.bottom  small, .service-section.bottom  h2, .service-section.bottom  p,  .service-section.bottom a{
    color: var(--primary);
    transition: 1.5s all;
}
 .service-section.top a, .service-section.bottom a{
    border-bottom: 1px solid var(--primary);
}
.service-section.top a:after, .service-section.bottom a:after{
    filter: none;
}
  .service-section.top .service-icon, .service-section.bottom .service-icon{
    background: none;
}

.service-section.top .service-icon img, .service-section.bottom .service-icon img { aspect-ratio: 1; position: absolute; max-width: unset; bottom: -35%; opacity: 0.1; }
.service-section.top .service-icon img, .service-section.bottom .service-icon img { filter: brightness(0) invert(1); }

.service-section > .services-overlay { position: absolute; display: block; width: 100%; height: 100%; transition: transform , top 1s cubic-bezier(.22, .9, .3, 1); top: 0; z-index: -1; transform: translateY(0%); }

/* .service-section:hover > .services-overlay{
    transform: translateY(100%);
    background-color: var(--blue);
    z-index: 0;
    transition: transform , top 1s cubic-bezier(.22, .9, .3, 1);
    top: -100%;
} */
.service-section.top > .services-overlay{
    transform: translateY(100%);
    background-color: var(--blue);
    z-index: 0;
    top: -100%;
}
.service-section.bottom > .services-overlay{
    transform: translateY(-100%);
    background-color: var(--blue);
    z-index: 0;
    top: 100%;
}
.service-section:last-child {
  margin-bottom: 150px;
} 



div#popupModal {
    width: 100%;
    height: 100%;
    background-color: #00000069;
    z-index: 9999;
}
div#popupModal .modal-dialog {
    height: 100%;
    display: flex;
    align-items: center;
    margin-top: 0;
    margin-bottom: 0;
    max-width: 600px;
}
div#popupModal .modal-dialog h2 {
    font-size: 34px;
    color: var(--blue);
    margin-bottom: 10px;
    font-weight: 600;
}
div#popupModal .modal-dialog .modal-content{
    padding: 25px;
}
div#popupModal .modal-dialog .modal-content > p{
    font-size: 14px;
}
.gform-footer.gform_footer.top_label {
    position: relative;
    vertical-align: bottom;
    display: flex;
    justify-content: flex-start;
    bottom: 0px;
    margin-top: 30px !important;
    margin-bottom: 10px !important;
}
span.close {
    font-size: 40px;
    position: absolute;
    right: 20px;
    top: 0;
}
div#popupModal .modal-dialog .gform_heading{
    margin-bottom: 30px;
}
.gform-footer.gform_footer.top_label input{
    background-color: var(--blue);
    font-size: 20px;
}
.gform-body.gform_body .gform_fields {
    gap: 20px;
}
.gform-body.gform_body .gform_fields .gfield_label {
    display: none;
}
.gform-body.gform_body .gform_fields input {
    margin-bottom: 8px;
    font-size: 16px;
    background-color: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid #AAAAAA;
    padding: 5px 10px;
    padding-top: 0;
    color: #717171;
    line-height: 1;
    font-family: 'Lekton';
    box-shadow: none;
}
.gform-body.gform_body .gform_fields input:focus, .gform-body.gform_body .gform_fields input:focus-visible{
    box-shadow: none;
    outline: none;
}
#popupModal .modal-dialog .modal-content .gform-footer.gform_footer.top_label input[type="submit"] {
    text-transform: uppercase;
    font-weight: 700;
    background-color: var(--blue);
    font-size: 16px;
    line-height: 1;
    padding: 14px 20px;
    border-radius: 10px;
    letter-spacing: 2px;
    min-width: 140px;
    border: 1px solid var(--blue);
    color: #FFFFFF;
    transition: 0.3s all;
}
#popupModal .modal-dialog .modal-content .gform-footer.gform_footer.top_label input[type="submit"]:hover{
    color: var(--blue);
    background-color: #FFFFFF;
}
html.lenis {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}
.lenis.lenis-scrolling iframe {
   pointer-events: none;
}
/* .tab-pane {
    display: none;
}
.tab-pane.active {
    display: block;
} */
.section-header h2 {
    /* text-shadow: 1px 1px 10px #ffffff, 1px 1px 10px #ffffff; */
    text-shadow: 0px 0px 10px #ffffff, 0px 4px 6px #ffffff;
}
.section-header a.cta-button {
    text-shadow: 0px 0px 4px #ffffff, 0px 0px 6px #ffffff;
}

/* case study page */
div#archive-wrapper {
    padding: 0;
}
.page-template-case-studies article.case_study.type-case_study{
    padding: 40px 0;
}
.page-template-case-studies article.case_study.type-case_study:nth-child(even) {
    background: var(--primary);
}
.page-template-case-studies article.case_study.type-case_study:nth-child(odd) {
    background: var(--secondary);
}
.page-template-case-studies article.case_study.type-case_study:nth-child(even) p{
    color: #717171;
}
.page-template-case-studies article.case_study.type-case_study:nth-child(even) h2{
    color: var(--secondary);
}
.page-template-case-studies article.case_study.type-case_study:nth-child(even) a.btn-primary{
    color: var(--secondary);
    border-bottom: 1px solid var(--secondary);
}
.page-template-case-studies article.case_study.type-case_study:nth-child(even) a.btn-primary:after{
    filter: invert(140%) sepia(8%) saturate(78%) hue-rotate(90deg) brightness(8%) contrast(100%);
}
.page-template-case-studies article.case_study.type-case_study:nth-child(odd) p{
    color: var(--primary);
}
.page-template-case-studies article.case_study.type-case_study:nth-child(odd) h2{
    color: #ffffff;
}
.page-template-case-studies article.case_study.type-case_study:nth-child(odd) a.btn-primary{
    color: var(--primary);
    border-bottom: 1px solid var(--primary);
}
#popupModal .gform_wrapper .gform_validation_errors {
    padding: 10px;
    margin-bottom: 20px;
    margin-top: 20px;
        outline: none;
}
.case_study.type-case_study .article-section {
  padding: 0;
}
div#popupModal .modal-dialog h2.gform_submission_error.hide_summary {
    font-size: 15px;
    font-weight: normal;
    margin: 0;
}
.gfield_description.validation_message.gfield_validation_message {
    margin-top: 0 !important;
}
.case_study.type-case_study .article-section .right-side {
  padding-left: 80px;
  padding-right: 40px;
}
.case_study.type-case_study .article-section .latest-article img {
  width: 100%;
  height: calc(100vh - 180px);
  border-radius: 10px;
  object-fit: cover;
}
.case_study.type-case_study .article-section .left-side {
  padding-top: 90px;
  padding-bottom: 100px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.w-fit{
    width: fit-content;
}
.page-template-case-studies article.case_study.type-case_study h2 {
  margin-bottom: 30px;
  text-transform: none;
}
.page-template-case-studies  article.case_study.type-case_study {
    text-transform: uppercase;
}
.page-template-case-studies article.case_study.type-case_study:last-child {
  margin-bottom: 120px;
}
.case_study {
    position: sticky;
    top: 100px;
    transform-origin: center top;
}
.blog-head-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 10px;
    margin-bottom: 80px;
}
.category-listing-wrapper .category-listing {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 20px;
}
.category-listing-wrapper .category-listing a img {
    filter: invert(47%) sepia(0%) saturate(1%) hue-rotate(332deg) brightness(94%) contrast(95%);
    transition: 0.5s all;
}
.category-listing-wrapper .category-listing a {
    gap: 7px;
    padding: 0px 24px;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
    color: #717171;
    text-decoration: none;
    position: relative;
        line-height: 26px;
            height: 26px;
    transition: 0.5s all;
}
.category-listing-wrapper .category-listing a.active, .category-listing-wrapper .category-listing a:hover {
    color: #004AAD;
}
.category-listing-wrapper .category-listing a.active:after, .category-listing-wrapper .category-listing a:hover:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #004AAD;
    bottom: -27px;
    
    transition: 0.5s all;
        right: 0;
}
.category-listing-wrapper .category-listing a.active img, .category-listing-wrapper .category-listing a:hover img{
    filter: none;
}
.blog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    display: grid;
    row-gap: 80px;
    column-gap: 30px;
}
.blog-grid .blog-card a img {
    border-radius: 10px;
    height: 300px;
    object-fit: cover;
    width: 100%;
}
.blog-grid .blog-card a.blog-category img {
    width: 16px;
    height: 16px;
        border-radius: unset;
    object-fit: unset;
}
.blog-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
    margin-top: 20px;
}
.blog-category {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    color: #717171;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
}
.category-item{
    display: flex;
    align-items: center;
    gap: 5px;
}
.category-item p,.category-item a, .post-categories a{
    color: #717171;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
}
.category-item img, .post-categories img{
    filter: invert(47%) sepia(0%) saturate(1%) hue-rotate(332deg) brightness(94%) contrast(95%);
}
.blog-meta span.blog-date , .entry-meta .post-date{
    font-size: 16px;
    font-weight: 400;
    color: var(--secondary);
}
h3.blog-title a{
    font-size: 30px;
    color: var(--secondary);
    text-decoration: none;
    margin-top: 20px;  
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 72px;
}
.blog-list .pagination {
    justify-content: center;
        gap: 10px;
}
.blog-list .pagination li span, .blog-list .pagination li a {
    color: #717171;
    background: none;
    font-size: 18px;
    font-weight: 400;
    border: none;
}
.blog-list .pagination li.active span{
    color: #004AAD;
    font-weight: 700;
}
.blog-list div.pagination {
    padding-top: 70px;
    padding-bottom: 100px;
}
.blog-list .pagination li a.next.page-link, .blog-list .pagination li a.prev.page-link {
    display: none;
}
.blog-list .pagination li a:focus, .blog-list .pagination li a:focus-visible{
    box-shadow: none;
    outline: none;
    border: 0;
}

/* blog detail */
header.entry-header .entry-meta {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 20px;
}
.single-post .content-area .site-main article picture img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border-radius: 10px;
}
.content_sidebar_wrapped{
    display: flex;
    gap: 50px;
    justify-content: space-between;
}
.content_sidebar_wrapped #right-sidebar {
    list-style: none;
    padding-left: 40px;
    position: relative;
    text-align: end;
}
.content_sidebar_wrapped #right-sidebar aside {
    position: sticky;
    top: 100px;
}
.content_sidebar_wrapped #right-sidebar aside li:not(:last-child){
    margin-bottom: 10px;
}
.content_sidebar_wrapped #right-sidebar aside li a {
    color: #717171;
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: 0;
    padding: 6px 10px;
    transition: 0.5s all;
}
.content_sidebar_wrapped #right-sidebar aside li a:hover, .content_sidebar_wrapped #right-sidebar aside li a.active {
    color: #FFFFFF;
    background-color: #004AAD;
}
.content_sidebar_wrapped .entry-content {
    margin-top: 50px;
}
.content_sidebar_wrapped  .entry-content h2{
    margin-top: 80px;
    margin-bottom: 25px;
}
.content_sidebar_wrapped  .entry-content h3{
     margin-top: 70px;
    margin-bottom: 20px;
}
.content_sidebar_wrapped  .entry-content h4, .content_sidebar_wrapped  .entry-content h5,.content_sidebar_wrapped  .entry-content h6{
     margin-top: 40px;
    margin-bottom: 20px;
}
.single-post .entry-content a {
    font-weight: 700;
    color: #004AAD;
}
.single-post .entry-content ul li:before {
    width: 20px;
    background-image: url(./images/white-arrow.svg);
    content: "";
    background-position: center left;
    background-size: 10px;
    background-repeat: no-repeat;
    display: inline-block;
    height: 20px;
    position: absolute;
    filter: brightness(0) saturate(100%) invert(40%) sepia(24%) saturate(0%) hue-rotate(166deg) brightness(105%) contrast(97%);
    left: -30px;
    top: 6px;
    transform: rotate(45deg);
}
.single-post .entry-content ul li, .single-post .entry-content ol li {
    position: relative;
    margin-bottom: 12px;
}
.single-post .entry-content ul {
    list-style: none;
}
.entry-content ol {
    list-style-type: none;
    counter-reset: my-counter;
    padding-left: 0;
    margin: 30px 0;
}
.entry-content ol li:before {
    counter-increment: my-counter;
    content: counter(my-counter, decimal-leading-zero) " ";
    margin-right: 6px;
    color: #004AAD;
    font-weight: 700;
    font-size: 16px;
}
.custom-toc ul{
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}
.custom-toc-title {
    display: none;
}

/* about us */
 .top-column .left-side .section-title {
    padding: 30px 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    color: #717171;
}
.about-us .top-column  h2 , .about-design .top-column  h2 {
    margin-bottom: 30px;
}
.bottom-column .img .Image_1, .bottom-column .img .Image_0 {
    padding-right: 230px;
}
.about-us:not(.about-design-full-width) .bottom-column .img .Image_0 picture, .about-design:not(.about-design-full-width) .bottom-column .img .Image_0 picture {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.about-us:not(.about-design-full-width) .bottom-column .img .Image_0 picture > img, .about-design:not(.about-design-full-width) .bottom-column .img .Image_0 picture > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
 
.about-us.about-design-full-width .bottom-column .img .Image_1 picture { display: block; width: 100%; overflow: hidden; border-radius: 15px }
.about-us.about-design-full-width .bottom-column .img .Image_1 picture > img { display: block; width: 100%; height: 200px; object-fit: cover; min-width: 100%;  }



.bottom-column .img {
    padding-top: 80px;
    flex-direction: row-reverse;
}
.content-area .site-main .about-us  .bottom-column .img .Image_0 img {
    height: 560px;
}
.entry-content .about-us, .entry-content .about-design {
    margin-bottom: 200px;
}
.about-design .bottom-column .img .Image_0, .about-design .bottom-column .img .Image_1{
    padding-right: 0;
}
.content-area .about-design .bottom-column .img .Image_1 img {
    height: 360px;
}
.about-design-btn {
    position: absolute;
    bottom: 0;
}
.about-design-full-width .img:not(.Image_1) .Image_0 {
    padding-right: 0;
}
.content-area .site-main  .about-design-full-width .img:not(.Image_1) .Image_0 img{
    height: 320px;
    width: 100%;
        object-fit: cover;
}
.about-design-full-width .right-side .about-content > .btns{
        grid-column: 2;
}
.about-us .right-side .about-content , .about-design .right-side .about-content {
    padding-right: 210px;
}
.about-design-full-width .right-side  .about-content{
    column-gap: 40px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding-right: 0;
}

/* contact us */

.get-in-touch .contact-form{
    background-color: #EDEDED;
    padding: 80px 90px;
    border-radius: 10px;
}
.contact-us .page-title {
    width: 76%;
}
.contact-us .page-title h2 {
    padding: 24px 0 15px;
        margin-bottom: 0;
}
.contact-us  .section-title, .contact-details > span, .contact-details >p strong{
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #717171;
    font-size: 16px;
    font-weight: 700;
}
.contact-details > span, .contact-details >p strong {
    margin-bottom: 20px;
    display: inline-block;
    margin-top: 45px;
}
.contact-details ul.slides {
    list-style-type: none;
    padding-left: 0;
}


.contact-details ul.slides a {
    color: var(--secondary);
    text-decoration: none;
    position: relative;
}

.contact-details ul.slides a:hover:before {
    width: 100%;
}

.contact-details ul.slides a:before {
    position: absolute;
    bottom: 0px;
    display: block;
    content: "";
    width: 0;
    height: 1px;
    background-color: var(--secondary);
    transition: width 0.2s ease-in-out;
    left: 50%;
    transform: translateX(-50%);
}

.contact-details ul.slides li:not(:last-child){
    margin-bottom: 15px;
}
.contact-map {
    margin-top: 120px;
}
.contact-form .gform-body.gform_body .gform_fields .gfield--type-radio legend.gfield_label.gform-field-label,
.contact-form .gform-body.gform_body .gform_fields .gfield--type-checkbox legend.gfield_label.gform-field-label, 
.contact-form .gform-body.gform_body .gform_fields .gfield--type-textarea .gfield_label.gform-field-label {
    font-weight: 700;
    display: block;
    text-transform: uppercase;
    color: #717171;
    letter-spacing: 1px;
        margin-bottom: 20px;
}
.contact-form .gform-body.gform_body .gform_fields .gfield--type-radio input, 
.contact-form .gform-body.gform_body .gform_fields input[type="checkbox"] {
    border: 1px solid #aaaaaa;
    border-radius: 50px;
    max-width: 20px;
    padding: 2px 5px;
}
.contact-form .gform-body.gform_body .gform_fields input[type="checkbox"] {
    border-radius: 2px;
}
.contact-form .gform-body.gform_body .gform_fields .gfield--type-radio input:checked{
    background-color: #ffffff;
}
.contact-form .gform-body.gform_body .gform_fields .gfield--type-radio input:checked:before {
    background-color: var(--blue);
    width: 8px;
    height: 8px;
}
.contact-form .gform-body.gform_body .gform_fields input[type="checkbox"]:before{
    color: var(--blue);
    background-color: #ffffff;
}
.contact-form .gform-body.gform_body .gform_fields .gfield--type-textarea .charleft.ginput_counter {
    display: none;
}
.contact-form .gform-body.gform_body .gform_fields {
    row-gap: 40px;
}
fieldset.gfield.gfield--type-consent.gfield--type-choice {
    margin-top: 20px;
}
fieldset.gfield.gfield--type-consent.gfield--type-choice label.gform-field-label {
    color: #717171;
    font-weight: 400;
    letter-spacing: 0;
    font-size: 14px;
}
.contact-form .gform-body.gform_body .gform_fields .gfield--type-textarea textarea.textarea {
    background: none;
    border-radius: 5px;
    border: 1px solid #AAAAAA;
    box-shadow: none;
}
.contact-info {
    position: sticky;
    top: 100px;
    overflow: hidden;
}
.contact-form .gform_wrapper form .gform-footer input.gform_button.button[type="submit"] {
    text-decoration: none;
    font-weight: 700;
    padding: 11px 50px 11px 17px;
    line-height: 1;
    letter-spacing: 2px;
    text-transform: uppercase;
    align-items: center;
    gap: 20px;
    color: var(--secondary);
    border-bottom: 1px solid var(--secondary);
    background: none;
    box-shadow: none;
    border-radius: 0;
    font-size: 16px;
    position: relative;
    display: inline-flex;
    background-image: url(./images/white-arrow.svg);
    background-repeat: no-repeat;
    background-position: top 12px right 24px;
    filter: invert(140%) sepia(8%) saturate(78%) hue-rotate(90deg) brightness(8%) contrast(100%);

}

.contact-form .gform_wrapper form .gform-footer input.gform_button.button[type="submit"]:focus{
    box-shadow: none;
    outline: none;
    border: 0;
    border-bottom: 1px solid var(--secondary);
}
.contact-form .gform-footer.gform_footer.top_label {
    margin-top: 50px !important;
}
.contact-form .gform_validation_errors ol {
    display: none;
}
.contact-form .gform_validation_errors {
    border-radius: 5px;
    padding: 6px 10px;
}
.contact-form .gform_heading {
    margin-bottom: 50px;
}

/* portfolio */
.casestudy-warpper {
    display: flex;
    gap: 20px;
    justify-content: space-between;
}
header.casestudy-header .casestudy-placeholder img {
    width: 236px;
    height: auto;
    border-radius: 10px;
}
.casestudy-main h1 {
    margin-bottom: 80px;
}
.casestudy-feature .casestudy-list {
    display: flex;
    margin-bottom: 50px;
}
.casestudy-feature .casestudy-list p:first-child {
    font-size: 16px;
    width: 240px;
    color: #717171;
    font-weight: 700;
    letter-spacing: 1px;
}
.casestudy-feature .casestudy-list p {
    color: #191919;
    font-size: 16px;
    font-weight: 700;
    width: 350px;
    letter-spacing: 1px;
    margin-bottom: 0;
    text-transform: uppercase;
}
.casestudy-thumbnail img {
    width: 100%;
    height: 800px;
    object-fit: cover;
}
.casestudy-content .content {
    width: 65%;
    column-gap: 40px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding-right: 0;
}
.casestudy-content .images {
    display: flex;
    justify-content: end;
    margin-left: auto;
    gap: 24px;
    align-items: end;
    margin-top: -60px;
    flex-direction: row-reverse;
}
.casestudy-section .entry-content > div:not(:last-child) { margin-bottom: 80px; }
.casestudy-content .images img.image0 {
    height: 600px;
    object-fit: cover;
    width: 470px;
    max-width: none;
    border-radius: 10px;
}
.casestudy-row {
    display: flex;
    justify-content: space-between;
    align-items: end;
}
.casestudy-row .casestudy-col {
    display: flex;
    gap: 30px;
    align-items: end;
}
.casestudy-row .casestudy-col img.image0 {
    height: 600px;
    object-fit: cover;
    width: 470px;
    max-width: none;
    border-radius: 10px;
}
img.small_image {
    width: 278px;
    object-fit: cover;
    height: 349px;
    max-width: none;
    border-radius: 10px;
    object-position: center;
}
.casestudy-section img{
    border-radius: 10px;
}
.casestudy-col-content {
    width: 40%;
}
.mb-60{
    margin-bottom: 60px !important;
}
.mb-140{
    margin-bottom: 140px !important;
}
.leftImage .ImageContent{
    display: flex;
    gap: 30px;
    align-items: end;
}
.leftImage .ImageContent img.image0 {
    aspect-ratio: 1;
    max-width: 470px;
    border-radius: 10px;
        object-fit: cover;
}
.casestudy-section .content_wrapped h2 {
    margin-bottom: 60px;
}
.casestudy-btn{
    margin-top: 120px;
}
.casestudy-section .entry-content > div:last-child {
    margin-bottom: 100px;
}

.single-case_study h2.hel { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;  }

/* team page start */

.team-detail {
    padding: 60px 0 100px;
}
.team-desc p {
    margin-bottom: 70px;
}
.team-info img {
    margin-bottom: 20px;
}

.team-info picture,
.team-info img {
  max-width: 348px;
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}


.team-info p:not(.h2){
    font-size: 18px;
}
.team-list{
    row-gap: 75px;
}
.contact-to-team .h1{
    letter-spacing: -2px;
}
.contact-to-team .h1 span{
    display: block;
    margin: 0;
    text-align: center;
}
.team-cta {
    position: absolute;
    right: 250px;
    bottom: 30px;
}

.team-info.main-team-im picture,
.team-info.main-team-im img {
  max-width: 348px;
  width: 100%;
  height: auto;
  border-radius: 10px;
  display: block;
}


.contact-to-team {
    padding: 130px 0 180px;
}
.accordion-header button.accordion-button span, .accordion-header button.accordion-button h4 {
    width: 50%;
}
.accordion-header button.accordion-button span.label {
    padding-left: 20px;
}
.accordion-header button.accordion-button{
    padding: 0;
    background: transparent;
}
.career-accordion .accordion-item {
    padding-top: 80px;
    border: 0;
}
.career-accordion .accordion-item .accordion-header {
    padding: 20px 0;
        border-bottom: 1px solid #AAAAAA;
}
.career-accordion .accordion-item .accordion-header button:focus, .career-accordion .accordion-item .accordion-header button:focus-visible,
.career-accordion .accordion-item .accordion-header button:focus-within{
    border-color: unset;
    box-shadow: none;
    outline: none;
}
.career-accordion .accordion-item .accordion-header button.accordion-button:not(.collapsed){
    background: none;
    box-shadow: none;
}
.career-accordion .accordion-item:has(.collapse){
    transition: 0.3s all;
}
.career-accordion .accordion-item:has(.collapse.show), .career-accordion .accordion-item:has(.collapsing) {
    background: black;
}
.career-accordion .accordion-item .accordion-header:has(button.accordion-button:not(.collapsed)){
    box-shadow: none;
    border-color: transparent;
}
.career-accordion .accordion-item .accordion-body{
    color: #FFFFFF;
}
.career-accordion .accordion-item .accordion-header button.accordion-button:not(.collapsed) {
    color: #AAAAAA;
}
.career-accordion .accordion-item .accordion-header button.accordion-button:not(.collapsed) span.label {
    color: #ffffff;
}
.career-accordion .accordion-item .accordion-body a.learn-more.btn-primary , .newsletter-sec .application-content a.learn-more.btn-primary{
    background: none;
    color: #ffffff !important;
        margin-top: 40px;
}
.career-accordion.accordion-flush .accordion-collapse .accordion-body {
    padding: 20px 0 0;
    padding-bottom: 100px;
}
.career-accordion .accordion-item .accordion-body ul {
    padding-left: 20px;
    list-style: none;
}
.career-accordion .accordion-item .accordion-body ul li{
    position: relative;
    margin-bottom: 6px;
}
.career-accordion .accordion-item .accordion-body ul li:before {
    content: "";
    background: url(./images/right-arrow.svg);
    left: -20px;
    position: absolute;
    width: 12px;
    height: 12px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    top: 8px;
}
.accordion-list {
    gap: 10px;
    display: flex;
}
.accordion-list p {
    border: 1px solid #717171;
    padding: 8px 20px;
    border-radius: 40px;
}
.accordion-flush .accordion-item .accordion-button::after, .accordion-flush .accordion-item .accordion-button.collapsed::after{
    display: none;
}
.plusminus {
    display: block;
    position: relative;
    width: 21px;
    height: 21px;
    margin-left: auto;
}
.accordion-header button.accordion-button .plusminus span:nth-child(1) {
    display: block;
    position: absolute;
    margin: 0 10%;
       width: 20px;
    height: 1px;
    background: #191919;
    top: 12px;
    -moz-transition: all .25s ease;
    -webkit-transition: all .25s 
ease;
    -o-transition: all .25s ease;
    transition: all .25s 
ease;
}
.accordion-header button.accordion-button .plusminus span:nth-child(2) {
    display: block;
    position: absolute;
    margin: 10% 0;
       width: 1px;
    height: 20px;
    background: #191919;
    left: 11px;
    -moz-transition: all .25s ease;
    -webkit-transition: all .25s 
ease;
    -o-transition: all .25s ease;
    transition: all .25s 
ease;
}
.accordion-header button.accordion-button:not(.collapsed) .plusminus span:nth-child(2) {
    background: #FFFFFF;
    -moz-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.newsletter-sec .application-content {
    width: 55%;
    margin-left: 110px;

}
.newsletter-sec .application-content p{
    color: #AAAAAA;
    margin-top: 16px;
    margin-bottom: 0;
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul {
    padding: 26px 30px;
    backdrop-filter: blur(40px);
    background: #FFFFFFCC;
    min-width: 140px;
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul li{
   
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul li:not(:last-child){
    margin-bottom: 20px;
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul li img {
    width: 20px;
    height: 20px;
    filter: invert(47%) sepia(0%) saturate(1%) hue-rotate(332deg) brightness(94%) contrast(95%);
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul li a {
    padding: 0;
    color: #717171;
    line-height: 1.4;
    flex-direction: row-reverse;
    gap: 10px;
    display: flex;
    justify-content: flex-end;
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul li:hover a {
    color: #004AAD;
    background: none;
}
.offcanvas-body ul#main-menu li.menu-item-has-children ul li:hover img {
    filter: none;
}
.offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger {
    display: block;
    margin: 0 auto;
    width: 8px;
    height: 8px;
    border-top: 1px solid var(--secondary);
    border-left: 1px solid var(--secondary);
    transform: rotate(220deg);
    top: -2px;
    position: relative;
    margin-left: 6px;
    margin-right: 6px;
}
.offcanvas-end:not(.show) .offcanvas-body ul#main-menu li.menu-item-has-children:hover span.sub-menu-trigger{
    transform: rotate(45deg);
    top: 2px;
}
.home .offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger{
    border-top: 1px solid #ffffff;
    border-left: 1px solid #ffffff;
}
.offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger::after{
    display: none;
}
.home .sticky .offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger{
    border-top: 1px solid var(--secondary);
    border-left: 1px solid var(--secondary);
}

.hero-scroll-arrow {
    position: absolute;
    left: 50%;
    bottom: 10px;
    transform: translateX(-50%);
    z-index: 90;

    font-size: 1.5rem;
    color: currentColor;
    opacity: 0.8;

    animation: heroArrowBounce 2s infinite;
}

.hero-scroll-arrow:hover {
    opacity: 1;
}

@keyframes heroArrowBounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateX(-50%) translateY(0);
    }
    40% {
        transform: translateX(-50%) translateY(6px);
    }
    60% {
        transform: translateX(-50%) translateY(3px);
    }
}


 .service-content a.btn-primary { display: inline-flex; align-self: flex-start; padding-left: 0px; margin-top: 15px; }

@media only screen and (min-width: 1500px){
    .container{
        max-width: 1460px;
    }
}

@media only screen and (max-width: 1024px){
    .navbar-nav .nav-link {  margin-left:0.3em; margin-right:0.2em; }
}

@media only screen and (max-width: 1500px){ 
    .article-section .left-side{ margin-left: calc((100% - 1320px) / 2 + 12px); flex: 0 0 35%; }
    .blog_selection-my-slider .slick-slide{ margin-right: 30px; }
    .stats-grid .stat-item h3{ font-size: 55px; }
    .stats-grid .stat-item p{
        font-size: 18px;
    }
    .stats-grid{
        margin-top: 60px;
    }
    section.stats-section {
        padding-top: 120px;
    }
    .article-section {
        padding: 150px 0 150px;
    }
    .footer-wrapper-menus .footer-menu{
        gap: 40px;
    }
    section.subscribe {
        padding: 150px 0 100px;
    }
    .site-footer .hero-right h2 {
        font-size: 70px;
    }
    .footer-wrapper-menus{
            padding: 135px 0 100px;
    }
    .newsletter-form .gf_browser_chrome {
        width: 80%;
        padding-right: 30px;
    }
    .newsletter-sec h2{
        font-size: 45px;
        margin-bottom: 30px;
    }
    .num-counter .right-side > h2, .num-counter .right-side > p {
        width: 100%;
    }
    .hero-video-container .hero-content {
        padding-bottom: 100px;
    }
    .scrambling-text {
        bottom: 40px;
        left: 10px;
        font-size: 28px;
        font-weight: 400;
        right: auto;
    }
     .blog_selection-my-slider .swiper-slide.slick-slide picture img{
        height: 400px;
    }
    .content-area .site-main .about-us .bottom-column .img .Image_0 img {
        height: 400px;
    }
    .about-us .right-side .about-content, .about-design .right-side .about-content {
        padding-right: 90px;
    }
}
@media only screen and (max-width: 1400px){
	
	a.menucta.btn-primary { font-size:14px }
	.offcanvas-body ul#main-menu li a.nav-link { font-size: 15px; }
	.navbar-nav .menu-item { margin-left: 0.6em; margin-right: 0.6em; }
    h1, .h1 { font-size: 65px; }
    h1.mainheading { font-size:2.2rem; }
    h2.heroheading, .scrambling-text { font-size: 1.4rem }
    
    .services-tab {
        gap: 20px;
    }
    .services-tab .h1 { font-size:50px; }
    .services-sec ul.nav li.nav-item a{
        margin-bottom: 20px;
    }
    .services-feature-sec{
        height: 380px; padding:60px;
    }
    .article-section .left-side{
        margin-left: calc((100% - 1140px) / 2 + 12px);
        flex: 0 0 35%;
    }
    .article-section .right-side{
        padding-left: 0;
    }
    .case_study.type-case_study .article-section .right-side {
        padding-left: 30px;

    }
    .bottom-column .img .Image_1, .bottom-column .img .Image_0 {
        padding-right: 20px;
    }
    .contact-us .page-title {
        width: 95%;
    }
    .get-in-touch .contact-form{
            padding: 40px 50px;
    }
    .team-info p.h2 {
        font-size: 40px;
    }
    .team-list {
        row-gap: 60px;
    }

}

@media only screen and (max-width: 1199px){
    .article-section .left-side { margin-left: calc((100% - 960px) / 2 + 12px); flex: 0 0 20%; width: 30%; }
    .swiper.logo-slider .swiper-slide.slick-slide {
        padding: 10px;
        margin: 0 10px;
    }
    .blog_selection-my-slider .swiper-slide.slick-slide .slide-content{
        padding-right: 0;
    }
    .article-section .right-side {
        width: 75%;
    }
    .stats-grid {
        gap: 20px;
    }
    .newsletter-sec h2 {
        font-size: 33px;
        margin-bottom: 10px;
    }
    .newsletter-sec p.gform_description {
        margin-bottom: 30px;
    }
    .subscribe .newsletter-sec .newsletter-form .gform_fields input{
        padding: 5px 10px;
        padding-right: 130px;
    }
    #page .subscribe .newsletter-sec .gform-footer.gform_footer input.gform_button[type="submit"]{
        font-size: 14px;
        padding-right: 30px;
        background-position: right 12px center;
    }
    .services-tab .tab-content {
        padding-left: 30px;
    }
    section.case-studies-showcase{
        margin-top: -2px;
        padding: 30px 0 100px;
    }
    .case-studies-card.case-studies-card-1 {
        top: -40px;
    }
    .case-studies-card.case-studies-card-1 img {
        width: 200px;
        height: 200px;
    }
    .case-studies-card.case-studies-card-1 p, .case-studies-card.case-studies-card-4 p, .case-studies-card.case-studies-card-5 p{
        width: 200px;
    }
    .case-studies-card.case-studies-card-2 img {
        width: 260px;
        height: 330px;
    }
    .case-studies-card.case-studies-card-2 p , .case-studies-card.case-studies-card-6 p{
        width: 260px;
    }
    .case-studies-card.case-studies-card-2 {
        right: 0px;
        top: 100px;
    }
    .case-studies-card.case-studies-card-3 img {
        width: 300px;
        height: 280px;
    }
    .case-studies-card.case-studies-card-3 p{
        width: 300px;
    }
    .case-studies-card.case-studies-card-4 img {
        width: 200px;
        height: 220px;
    }
    .case-studies-card.case-studies-card-5 img {
        width: 220px;
        height: 210px;
    }
    .case-studies-card.case-studies-card-6 img {
        width: 270px;
        height: 340px;
    }
    .case-studies-card.case-studies-card-6 {
        bottom: 0;
        right: 180px;
    }
    .navbar-nav .nav-link{
        margin-left: 6px;
        margin-right: 6px;
    }
    .blog_selection-my-slider .slick-slide{
        margin-left: 20px;
        margin-right: 20px;
    }
    .case_study.type-case_study .article-section .left-side{
        flex: 0 0 35%;
    }
    .case_study.type-case_study .article-section .left-side{
        padding-top: 30px;
        padding-bottom: 50px;
    }
    h3.blog-title a{
        min-height: 48px;
        font-size: 20px;
        margin-top: 10px;
    }
    .blog-meta{
        gap: 10px;
    }
    .blog-grid .blog-card a img{
            height: 200px;
    }
    .category-listing-wrapper .category-listing{
        gap: 10px;
    }
    .category-listing-wrapper .category-listing a{
        padding: 0 14px;
    }
    .blog-list div.pagination{
        padding-bottom: 30px;
    }
    .single-post .content-area .site-main article picture img{
        height: 400px;
    }
    .content_sidebar_wrapped #right-sidebar{
        padding-left: 0;
    }
    .about-us .right-side .about-content, .about-design .right-side .about-content {
        padding-right: 20px;
    }
    .get-in-touch .contact-form {
        padding: 30px;
    }
    .contact-us .page-title h2, .contact-us h2#get-in-touch{
        font-size: 42px;
    }
    .contact-details > span, .contact-details >p strong {
        margin-top: 35px;
            margin-bottom: 10px;
    }
    .contact-details ul.slides li:not(:last-child) {
        margin-bottom: 10px;
    }
    .contact-map {
        margin-top: 80px;
    }
    .contact-map iframe{
            height: 400px;
    }
    .casestudy-feature .casestudy-list p:first-child{
            width: 160px;
    }
    .casestudy-thumbnail img{
        height: 500px;
    }
    .casestudy-content .images img.image0 {
        height: 500px;
    }
    .casestudy-row .casestudy-col img.image0{
        height: 450px;
        width: 300px;
    }
    .casestudy-col-content {
        width: 50%;
        padding-right: 10px;
    }
    img.small_image {
        width: 200px;
        height: 260px;
    }
    .casestudy-content .content {
        width: 75%;
        column-gap: 20px;
    }
    .leftImage .ImageContent img.image0 {
        max-width: 350px;
    }
    .team-cta{
        right: 200px;
        bottom: 25px;
    }
    .team-info p.h2 {
        font-size: 34px;
    }
    .team-detail {
        padding: 60px 0;
    }
    .contact-to-team {
        padding: 100px 0 120px;
    }
    .accordion-header button.accordion-button h4{
        width: 41.66666667%;
    }
    .accordion-header button.accordion-button span{
        width: 58.33333333%;
    }
    .career-accordion .accordion-item {
        padding-top: 40px;
        border: 0;
    }
    .newsletter-sec .application-content{
        margin-left: 50px;
        width: 70%;
    }
    .career-section  section.subscribe {
        padding: 100px 0 60px;
    }
    a.menucta.btn-primary {
        font-size: 14px;
        padding: 9px;
        letter-spacing: 1px;
        gap: 5px;
        margin-left: 10px !important;
    }
    .offcanvas-body ul#main-menu li {
        margin: 0;
    }
    .offcanvas-body ul#main-menu li a.nav-link {
        font-size: 14px;
        margin-left: 4px;
        margin-right: 4px;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children a.nav-link {
        padding-right: 0;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children {
        margin-right: 4px;
    }
    a.navbar-brand.custom-logo-link img {
        max-width: 200px;
    }
}


@media only screen and (max-width: 992px){
     .article-section .left-side{
        margin-left: 0;
        flex: none;
        width: 100%;
    }
    .article-section .right-side{
        width: 100%;
    }
    .article-section .latest-article{
        max-width: 720px;
        margin-right: auto;
        margin-left: auto;
        display: block;
        padding: 0 12px;
    }
    h1, .h1, h2.heroheading {
        font-size: 50px;
    }
    h2 , .h2{
        font-size: 44px;
        
    }
    
    h1.mainheading { font-size:2.6rem; }
    h2.heroheading { font-size: 1.6rem }
    
    .services-tab ul#v-tab {
        padding-left: 50px;
    }
    .services-tab .tab-content {
        padding-left: 60px;
    }
    .services-sec {
        padding: 95px 0 170px;
    }
    .section-header {
        margin-bottom: 25px;
        max-width: 500px;
    }
    .case-studies-card.case-studies-card-3{
        left: 30px;
    }
    .case-studies-showcase .container {
        min-height: 1430px;
    }
    .article-section {
        padding: 80px 0 100px;
    }
    section.subscribe {
        padding: 80px 0 30px;
    }
    .newsletter-sec{
        align-items: stretch;
    }
    .subscribe .newsletter-sec .newsletter-form .gform_fields input::placeholder{
        font-size: 14px;
    }
    .newsletter-sec h2 {
        font-size: 28px;
        margin-bottom: 10px;
    }
    .newsletter-sec p.gform_description {
        margin-bottom: 10px;
        font-size: 14px;
    }
    .newsletter-form {
        padding: 50px 0px;
    }
    .site-footer .hero-right h2 {
        font-size: 50px;
        margin-bottom: 30px;
    }
    .footer-wrapper-menus {
        padding: 90px 0 60px;
    }
    .footer-wrapper-menus .footer-menu {
        gap: 20px;
        flex-direction: column;
    }
    button.navbar-toggler {
        order: 3;
        border: 0;
        padding-right: 0;
    }
    .sticky button.navbar-toggler {
        color: var(--secondary);
        background-color: transparent;
    }
    .sticky button.navbar-toggler .navbar-toggler-icon{
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba%28125, 125, 125, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    }

    .sub-menu-trigger:after {
        border-top-color: var(--secondary);
    }
     button.navbar-toggler:focus{
        outline: none;
        box-shadow: none;
    }
    .offcanvas-body a, .offcanvas-body a:hover,.offcanvas-body a:focus{
        color: #191919;
    }
    .sticky nav#main-nav{
        padding: 20px 0;
    }
    nav#main-nav{
        padding: 40px 0;
    }
    .offcanvas-header .btn-close {
        margin-right: 10px;
        margin-top: 10px;
    }
    .offcanvas-body li.menu-item.nav-item {
        border-bottom: 1px solid #f0f0f0;
        font-size: 18px;
        padding: 10px 0;
        width: 100%;
        margin: 0;
        position: relative;
    }
    .offcanvas-body ul#main-menu li a.nav-link{
        padding-top: 0;
        padding-bottom: 0;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger{
        position: absolute;
        top: 20px;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children ul{
        padding: 0 20px;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children ul li:last-child{
        border-bottom: 0;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children ul li:not(:last-child) {
        margin-bottom: 5px;
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: relative;
        top: 0;
        width: 100%;
        border: none;
    }

    .navbar-nav .menu-item {
        margin-left: 0;
        margin-right: 0;
        display: block;
    }

    .service-detail {
        flex-direction: column;   
        align-items: flex-start;
        gap: 20px;
    }
    .service-detail p {
        width: 100%;
    }
    .service-section .service-icon{
        min-height: 300px;
    }
    .service-content{
        padding-left: 30px;
    }
   
    .progress{
        width: 100%;
    }
    .case_study.type-case_study .article-section .right-side {
        padding-left: 0;
        padding-right: 0;
    }
    .case_study.type-case_study .article-section .left-side {
        padding-top: 0px;
        padding-bottom: 30px;
    }
    .case_study.type-case_study .article-section .latest-article img {
        height: calc(100vh - 450px);
    }
    .blog-grid{
        row-gap: 40px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 20px;
    }
    .category-listing-wrapper .category-listing a img {
        width: 15px;
    }
    .content_sidebar_wrapped{
        gap: 20px;
    }
    .content_sidebar_wrapped .entry-content h2{
        margin-top: 60px;
    }
    .content_sidebar_wrapped .entry-content h3 {
        margin-top: 50px;
    }
    .bottom-column .img {
        padding-top: 20px;
        gap: 30px;
        flex-direction: row-reverse;
        justify-content: space-between;
    }
    .about-us .bottom-column .img .Image_1 img, .content-area .about-design .bottom-column .img .Image_0 img{ height: auto; }  
    .content-area .site-main .about-us .bottom-column .img .Image_0 img{ height: 350px; }
    .entry-content .about-us, .entry-content .about-design { margin-bottom: 100px; }
    .about-us .top-column h2, .about-design .top-column h2 { margin-bottom: 20px; }
    .content-area .site-main .about-design-full-width .img:not(.Image_1) .Image_0 { width: 100%; }
    .contact-info { position: relative; top: unset; overflow: unset; } 
    .contact-form .gform_heading { margin-bottom: 20px; }
    .casestudy-thumbnail img { height: 400px; }
    .mb-140 { margin-bottom: 70px !important; }
    .casestudy-section .entry-content > div:not(:last-child) { margin-bottom: 80px; }
    .casestudy-content .content { width: 100%; }
    .casestudy-content .images { margin-top: 0; }
    img.small_image{ width: 190px; height: 230px; }
    .casestudy-content .images img.image0, .casestudy-row .casestudy-col img.image0 {
        height: 400px;
        width: 260px;
    }
    .casestudy-section .content_wrapped h2 {
        margin-bottom: 40px;
    }

    .casestudy-row .casestudy-col {
        gap: 20px;
    }

    .mb-60 {
        margin-bottom: 40px !important;
    }

    .leftImage .row {
        flex-direction: column-reverse;
    }

    .casestudy-btn {
        margin-top: 60px;
    }

    .navbar-nav .menu-item .sub-menu-trigger {
        width: 30px;
        position: absolute;
        right: 0;
        text-align: center;
        top: 14px;
    }

    .navbar-nav .menu-item .sub-menu-trigger.active {
        transform: rotate(180deg) translate(-4px, 4px);
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: relative;
        top: 0;
        width: 100%;
        border: none;
    }
    .team-info p:not(.h2) {
        font-size: 16px;
        margin-bottom: 0;
    }
    .team-cta {
        right: 190px;
        bottom: 15px;
    }
        .contact-to-team {
        padding: 100px 0 60px;
    }
    .team-info h2{
        margin-bottom: 0;
    }
    .team-desc p {
        margin-bottom: 30px;
    }
    .accordion-header button.accordion-button h4 {
        width: auto;
    }
    .career-accordion.accordion-flush .accordion-collapse .accordion-body {
        padding: 20px;
        padding-bottom: 60px;
    }
    .career-accordion .accordion-item .accordion-body a.learn-more.btn-primary
    {
        margin-top: 10px;
    }
    .newsletter-sec .application-content {
        margin-left: 30px;
        width: 80%;
    }
    .newsletter-sec .application-content p {
        font-size: 14px;
    }
    .newsletter-sec .application-content a.learn-more.btn-primary{
        margin-top: 20px;
    }
    .career-section section.subscribe {
        padding: 80px 0 20px;
    }
    .career-accordion .accordion-item{
        padding-top: 0px;
    }
    .career-accordion .accordion-item .accordion-header{
        padding: 0;
    }
    .career-accordion .accordion-item .accordion-header button{
        padding: 60px 0 20px;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children a.nav-link{
        margin-right: 50px;
    }
    .home .offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger{
        border-top: 1px solid var(--secondary);
        border-left: 1px solid var(--secondary);
    }
    .offcanvas-end:not(.show) .offcanvas-body ul#main-menu li.menu-item-has-children:hover span.sub-menu-trigger{
        transform: unset;
        top: unset;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children span.sub-menu-trigger.active {
        transform: rotate(45deg);
    }
}
@media only screen and (min-height: 1025px){
    
    .case_study.type-case_study .article-section .latest-article img {
        height: calc(100vh - 500px);
    }
}
@media only screen and (max-height: 500px){
    
    .case_study.type-case_study .article-section .latest-article img {
        height: 400px;
    }
}

@media only screen and (max-width: 767px){
    .navbar-nav .nav-link:before { bottom: 0px; }
    .hero-scroll-arrow { bottom: 25px; font-size: 2.5rem;}
    .hero-video-container .hero-content  { padding-bottom:225px; }
    .scrambling-text { padding-bottom: 100px; }
    .scrambling-text { font-size: 22px; }
    .hero-overlay { mix-blend-mode:multiply; background-color: rgba( 0,74,173, 0.5);  }
    h1, .h1 {
        font-size: 42px;
    }
    h2 , .h2{
        font-size: 30px;
    }
    
    h1.mainheading { font-size:2rem; padding-right:15px; padding-bottom:15px; }
    h2.heroheading { font-size: 1.6rem }
    
    
    .intro-content {
        width: 100%;
    }
   .case-studies-card.case-studies-card-1 {
        top: 100px;
    }
    .services-sec {
        padding: 60px 0 30px;
    }
    .case-studies-card.case-studies-card-1 img {
        width: 130px;
        height: 130px;
    }
    .case-studies-card.case-studies-card-1 p, .case-studies-card.case-studies-card-4 p, .case-studies-card.case-studies-card-5 p, .case-studies-card.case-studies-card-4 p {
        width: 130px;
    }
    .case-studies-card.case-studies-card-2 img {
        width: 160px;
        height: 200px;
    }
    .case-studies-card.case-studies-card-2 p , .case-studies-card.case-studies-card-6 p{
        width: 160px;
    }
    .case-studies-card.case-studies-card-2 {
        right: 10px;
        top: 150px;
    }
    .case-studies-card.case-studies-card-3 {
        left: 30px;
        top: 475px;
    }
    .case-studies-card.case-studies-card-3 img {
        width: 180px;
        height: 180px;
    }
    .case-studies-card.case-studies-card-3 p{
        width: 180px;
    }
    .case-studies-card.case-studies-card-4 img {
        width: 180px;
        height: 180px;
    }
    .case-studies-card.case-studies-card-5 img {
        width: 120px;
        height: 120px;
    }
    .case-studies-card.case-studies-card-6 img {
        width: 160px;
        height: 200px;
    }
    .case-studies-card.case-studies-card-6 {
        bottom: 0;
        right: 40px;
    }
    .case-studies-card.case-studies-card-5{
        left: 10px;
    }
    .case-studies-card.case-studies-card-4 {
        right: 10px;
    }
    .section-header {
        margin-bottom: 25px;
        max-width: 310px;
    }
    section.case-studies-showcase{
        padding: 100px 0;
    }
    a.btn-primary{
        font-size: 14px;
        padding-bottom: 5px;
    }
    .case-studies-showcase .container {
        min-height: 1250px;
    }
    section.stats-section {
        padding-top: 40px;
    }
    .stats-grid{
        grid-template-columns: repeat(2, 1fr);
    }
    .article-section .latest-article{
        max-width: 540px;
    }
    .blog_selection-my-slider{
        padding-top: 80px;
    }
    button.slick-arrow{
        top: 20px;
    }
    .footer-wrapper-menus{
        grid-template-columns: repeat(2, 1fr);
    }
    .site-footer .hero-right h2{
        font-size: 40px;
    }
    .footer-wrapper-menus {
        padding: 50px 0;
    }
    .newsletter-sec{
        border-radius: 30px;
    }
    .newsletter-img{
        display: none;
    }
     .newsletter-form {
        padding: 40px 40px 50px;
    }
    .newsletter-form .gf_browser_chrome {
        width: 100%;
        padding-right: 0;
    }
    .stats-grid .stat-item h3 {
        font-size: 36px;
    }
    .stats-grid .stat-item p {
        font-size: 16px;
    }
    .services-feature-sec {
        height: 300px;
        padding: 70px;
    }
    .services-tab .tab-content {
        padding-left: 50px;
    }
    .services-sec ul.nav li.nav-item a {
        font-size: 40px;
    }
    .services-sec ul.nav li.nav-item a.active::before{
        width: 25px;
        height: 25px;
        left: -30px;
        bottom: 20px;
        background-size: contain;
    }
    .services-tab ul#v-tab {
        padding-left: 30px;
    }
    .blog_selection-my-slider .swiper-slide.slick-slide picture img {
        height: 240px;
    }
    .article-section {
        padding: 80px 0 60px;
    }
    .progress{
        margin-top: 20px;
    }
    .service-section .service-icon {
        min-height: 240px;
    }
    .service-section .service-icon img {
        max-width: 100px;
    }
    .service-num {
        left: -14px;
        font-size: 16px;
        top: 0px;
    }
    .service-name small{
        font-size: 14px;
        letter-spacing: 0.5px;
    }
    .service-content {
        padding-left: 20px;
    }
    .service-detail {
        gap: 10px;
    }
    .service-detail p {
        font-size: 15px;
    }
    .service-section{
        padding: 45px 0;
    }
    .blog_selection-my-slider .slick-list {
        padding-left: 5px !important;   
        padding-right: 5px;           
    }
    .head-space {
        padding-bottom: 35px;
    }
    .custom_breadcrumb
    {
        padding-top: 100px;
    }
    .page-template-case-studies article.case_study.type-case_study:last-child {
        margin-bottom: 60px;
    } 
    .category-listing-wrapper .category-listing{
               margin-bottom: 0;
        padding-left: 0;
        flex-wrap: wrap;
        row-gap: 20px;
    }  
    .blog-head-title {
        flex-wrap: wrap;
        gap: 20px;
        margin-bottom: 40px;
    }
    .category-listing-wrapper .category-listing {
        margin-bottom: 0;
        padding-left: 0;
    }
    .category-listing-wrapper .category-listing a.active:after, .category-listing-wrapper .category-listing a:hover:after{
        bottom: -10px;
    }
    .blog-list div.pagination {
        padding-top: 40px;
    }
    .content_sidebar_wrapped {
        flex-direction: column-reverse;
    }
    .custom-toc ul {
               border-bottom: 3px solid #f5f5f5;
        padding-bottom: 0px;
        text-align: left;
        margin-bottom: 20px;
        margin-top: 0px;
        padding-top: 0;
    }
    .custom-toc h3 {
        display: block;
        text-align: left;        
        margin-bottom: 0;
        font-size: 20px;
    }
    .custom-toc {
        margin-top: 0;
    }
    .custom-toc-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
                padding-bottom: 10px;
    }
    .accordion-content {
        max-height: 0;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .accordion.active .accordion-content {
        max-height: 200px;
        padding-bottom: 10px;
    }
    .custom-toc .custom-toc-title i.fa-solid{
        transition: 0.5s all;
    }
    .custom-toc.active .custom-toc-title i.fa-solid {
        transform: rotate(180deg);
        color: var(--blue);
    }
    .content_sidebar_wrapped #right-sidebar aside li:not(:last-child) {
        margin-bottom: 0px;
    }
    .content_sidebar_wrapped #right-sidebar aside li a{
        font-size: 16px;
    }
    .content_sidebar_wrapped #right-sidebar aside li a{
        padding-left: 0;
    }
    .bottom-column .img .Image_1, .bottom-column .img .Image_0 {
        padding-right: 12px;
    }
    .bottom-column .img{
        gap: 0;
    }
    .content-area .site-main .about-us .bottom-column .img .Image_0 img {
        height: 300px;
    }
     .top-column .left-side .section-title {
        padding: 10px 0;
    }
    .entry-content .about-us, .entry-content .about-design {
        margin-bottom: 70px;
    }
    .about-design .bottom-column .img .Image_0, .about-design .bottom-column .img .Image_1 {
        padding-right: 12px;
    }
    .about-design-full-width .right-side .about-content{
        grid-template-columns: repeat(1, 1fr);
    }
    .about-design-full-width .right-side .about-content {
        display: block;
        margin-bottom: 20px;
    }
    .about-us .right-side .about-content, .about-design .right-side .about-content {
        padding-right: 0px;
    }
    #page-wrapper.wrapper {
        padding: 0;
    }
    .contact-details > span, .contact-details >p strong {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .contact-us .page-title h2, .contact-us h2#get-in-touch {
        font-size: 30px;
    }
    .contact-us .gform-body.gform_body .gform_fields input{
        margin-bottom: 0;
    }
    .contact-form .gform-body.gform_body .gform_fields {
        row-gap: 30px;
    }
    .contact-form .gform-body.gform_body .gform_fields .gfield--type-radio legend.gfield_label.gform-field-label,
     .contact-form .gform-body.gform_body .gform_fields .gfield--type-checkbox legend.gfield_label.gform-field-label, 
     .contact-form .gform-body.gform_body .gform_fields .gfield--type-textarea .gfield_label.gform-field-label{
        margin-bottom: 10px;
    }
    fieldset.gfield.gfield--type-consent.gfield--type-choice {
        margin-top: 0px;
    }
    .casestudy-main h1 {
        margin-bottom: 40px;
    }
    .casestudy-feature .casestudy-list {
        margin-bottom: 20px;
    }
    .casestudy-thumbnail img {
        height: 300px;
    }
    .mb-140 {
        margin-bottom: 40px !important;
    }
    .casestudy-content .content{
            grid-template-columns: repeat(1, 1fr);
    }
    .casestudy-row {
        align-items: flex-start;
    }
    .casestudy-col-content {
        width: 100%;
        padding-right: 10px;
        margin-top: 20px;
    }
    .casestudy-section .entry-content > div:not(:last-child) {
        margin-bottom: 40px;
    }
    .leftImage .ImageContent {
        flex-direction: column;
        align-items: start;
        gap: 20px;
    }
    .casestudy-row .casestudy-col{
        display: block;
    }
    .casestudy-warpper {
        flex-direction: column;
        gap: 10px;
        margin-bottom: 20px;
    }
    header.casestudy-header .casestudy-placeholder img {
        width: 130px;
    }
    .team-desc p {
        margin-bottom: 15px;
    }
    .team-list {
        row-gap: 30px;
    }
    .team-info p.h2 {
        font-size: 30px;
    }
    .team-cta {
        text-align: center;
        position: relative;
        right: 0;
        bottom: 0;
        margin-top: 20px;
    }
    .contact-to-team .h1 br {
        display: none;
    }
    .contact-to-team .h1 {
        letter-spacing: -1px;
        text-align: center;
    }
    .contact-to-team {
        padding: 60px 0 20px;
    }
    .offcanvas-body ul#main-menu li.menu-item-has-children ul li img {
        width: 16px;
        height: 18px;
    }
}


@media only screen and (max-width: 575px){
    a.btn-primary{
        padding: 11px;
        gap: 10px;
    }
    a.btn-primary:after{
        width: 7px;
        height: 7px;
        background-size: contain;
    }
    .footer-wrapper-menus{
        grid-template-columns: repeat(1, 1fr);
    }
     .newsletter-form {
        padding: 40px 30px 50px;
    }
    #page .subscribe .newsletter-sec .gform-footer.gform_footer input.gform_button[type="submit"] {
        font-size: 12px;
        padding-right: 20px;
        background-position: right 4px center;
    }
    .subscribe .newsletter-sec .newsletter-form .gform_fields input {
        padding-right: 100px;
    }
    .site-footer .hero-left {
        margin-bottom: 34px;
    }
    .site-footer .hero-right h2 {
        font-size: 26px;
        margin-bottom: 10px;
    }
    .copyrigth{
        font-size: 12px !important;
        padding: 10px 20px; 
    }
    .copyrigth a{
        font-size: 12px !important;
    }
    h3 {
        font-size: 24px;
    }
   section.subscribe {
        padding: 30px 0;
    }
    .progress{
            margin-top: 5px;
    }
    section.case-studies-showcase {
        padding: 60px 0;
    }
    .services-acc .tab-pane.fade-in {
        display: block;
        margin-top: 25px;
        opacity: 1;
            max-height: unset;
    overflow: visible;
    }
    .tab-pane .service-content{
        opacity: 1;
    }
    .services-acc .tab-pane {
        display: none;
    }
    .services-tab .tab-content{
        padding: 0;
    }
    .nav-accordion-title a.nav-link {
        text-transform: none;
        font-size: 26px;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .services-sec {
        padding: 60px 0 80px;
    }
    .services-acc {
        padding: 15px 10px;
        border-bottom: 1px dashed #959595;
    }
    .services-acc .services-feature {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .services-feature-sec {
        height: 180px;
        padding: 60px;
    }
    .services-feature-sec img {
        max-width: 110px;
    }
    .services-feature-sec{
        margin-bottom: 20px;
    }
    .service-content{
            font-size: 14px;
    }
    .nav-accordion-title a.nav-link span {
        font-size: 18px;
        line-height: 1.5;
    }
    .nav-accordion-title a.nav-link span i{
        transform: rotate(0deg);
        transition: 0.3s all;
    }
    .services-acc:has(.tab-pane.fade-in) .nav-accordion-title a.nav-link span i {
        transform: rotate(180deg);
    }
    section.stats-section {
        padding-top: 60px;
    }
    .blog_selection-my-slider {
        padding-top: 60px;
    }
    button.slick-arrow {
        top: 10px;
    }
    #wrapper-footer{
        padding-top: 30px;
    }
    .footer-wrapper-menus .footer-menu ul a{
        letter-spacing: 1px;
    }
    .scrambling-text {
        word-wrap: break-word;
        word-break: break-word;
        white-space: break-spaces;
        text-align: start;
        padding-right: 10px;
    }
    .service-content {
        padding-left: 28px;
        padding-top: 20px;
    }
    .service-section:hover .service-icon img {
        bottom: unset;
        top: -30%;
        width: 80%;
    }
    div#popupModal .modal-dialog h2 {
        font-size: 22px;
    }
    div#popupModal .modal-dialog .gform_heading {
        margin-bottom: 20px;
    }
    .gform-body.gform_body .gform_fields input{
        padding: 0px 10px;
        margin-bottom: 10px;
        font-size: 16px;
    }
    .gform-body.gform_body .gform_fields {
        gap: 15px;
    }
    #popupModal .modal-dialog .modal-content .gform-footer.gform_footer.top_label input[type="submit"]{
        min-width: 120px;
    }
    div#popupModal .modal-dialog .modal-content {
        padding: 18px;
    }
    
    .case_study.type-case_study .article-section .latest-article img {
        height: 350px;
    }
    .head-space {
        padding-bottom: 20px;
    }
    .page-template-case-studies article.case_study.type-case_study:last-child {
        margin-bottom: 30px;
    }
    .blog-grid {
        row-gap: 30px;
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    h3.blog-title a{
        min-height: auto;
    }
    .single-post .content-area .site-main article picture img {
        height: 300px;
    }
    .content_sidebar_wrapped .entry-content h2 {
        margin-top: 40px;
    }
    .single-post .type-post h1.entry-title {
        font-size: 34px;
    }
    .custom_breadcrumb nav.breadcrumb, .custom_breadcrumb nav.breadcrumb a{
        font-size: 16px;
    }
    .bottom-column .img {
        gap: 20px;
    }
    .entry-content .about-us, .entry-content .about-design {
        margin-bottom: 40px;
    }
    .about-design-full-width .img:not(.Image_1) .Image_0 {
        padding-right: 12px;
    }
    .content-area .site-main .about-us .bottom-column .img .Image_0 img,
    .about-us .bottom-column .img .Image_1 img, .content-area .about-design .bottom-column .img .Image_0 img, .content-area .about-design .bottom-column .img .Image_1 img { height: 220px; }
    .bottom-column .img { padding-top: 0; }
    .bottom-column .img .row { gap: 20px; }
    .get-in-touch .contact-form {
        padding:  30px 20px;
    }
    .contact-us .page-title h2 {
        padding: 15px 0 15px;
    }
    .contact-details ul.slides li:not(:last-child) {
        margin-bottom: 5px;
    }
    .contact-map {
        margin-top: 50px;
    }
    .contact-map iframe {
        height: 350px;
    }
    .casestudy-feature .casestudy-list{
        flex-direction: column;
    }
    .casestudy-content .images{
                gap: 0px;
        justify-content: unset;
        margin: auto;
        flex-direction: unset;
    }
    img.small_image {
        display: none;
    }
    .casestudy-content .images img.image0, .casestudy-row .casestudy-col img.image0 {
        height: 260px;
        width: 100%;
    }
    .casestudy-thumbnail img {
        height: 240px;
    }
    .leftImage .ImageContent img.image0 {
        max-width: 100%;
    }
    .casestudy-btn {
        margin-top: 20px;
    }
    .casestudy-feature .casestudy-list p, .casestudy-feature .casestudy-list p:first-child{
        font-size: 14px;
    }
    .casestudy-section .content_wrapped h2 {
        margin-bottom: 15px;
    }
    .bottom-column .img{
        flex-direction: column-reverse;
        width: 100%;
    }
    .bottom-column .img img{
        width: 100%;
        object-fit: cover;
    }
    .team-detail {
        padding: 40px 0;
    }
    .team-list {
        row-gap: 20px;
    }
    .team-info p.h2 {
        font-size: 24px;
    }
    .team-info img {
        margin-bottom: 10px;
    }
    .team-info{
        margin-bottom: 10px;
    }
    .contact-to-team {
        padding: 60px 0;
    }
    .career-accordion .accordion-item .accordion-header button.accordion-button h4 {
        font-size: 16px;
                width: auto;
    }
    .accordion-header button.accordion-button span.label {
        padding-left: 10px;
        font-size: 26px;
                width: auto;
    }
    .career-accordion {
        margin-bottom: 50px;
    }
    .newsletter-sec .application-content {
        margin-left: 0;
        width: 100%;
    }
        .career-section section.subscribe {
        padding: 20px 0 40px;
    }
}

