/* 🌐 Modern CSS Reset */

:root {
	--width:1320px;
	--e-global-color-primary: #1248B5;
	--e-global-color-secondary: #0B2B6B;
	--e-global-color-text: #0D131B;
	--e-global-color-accent: #1248B5;
	--e-global-color-light: #E8F0FF;
}
*, *::before, *::after {box-sizing: border-box; margin: 0; padding: 0;}
html {font-size: 14px; /* 1rem = 16px */ scroll-behavior: smooth;height: 100%;}
html, body { width: 100%; font-family: system-ui, sans-serif; line-height: 1.5; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
body {min-height: 100%;font-family: 'DM Sans', 'Helvetica Neue', sans-serif; font-weight: 400; font-size: clamp(1rem, 1vw + 0.5rem, 1.05rem); /* ~16px–18px */  line-height: 1.6; color:#2E2E2E; margin: 0;overflow-x: hidden;}
img, picture, video, canvas, svg { max-width: 100%; height: auto;}
input, button, textarea, select {font: inherit; border: none; background: none; outline: none;}
a {color:var(--e-global-color-accent); text-decoration: none;outline:0 none;}
ul, ol {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
body.font1{ font-family: "Space Mono", monospace;}
/* Headings */
h1 {font-size: clamp(2.6rem, 5vw, 4.5rem); line-height: 1.3;font-weight: 700;margin-bottom: 1em;}
h2 {font-size: clamp(2rem, 3vw, 2.5rem); line-height: 1.25;font-weight: 700;margin-bottom: 0.5em;}
h3 {font-size: clamp(1.75rem, 3vw, 2rem);line-height: 1.3;font-weight: 700;margin-bottom: 0.5em;}
h4 {font-size: clamp(1.25rem, 2.25vw, 1.85rem);line-height: 1.35;font-weight: 500;margin-bottom: 0.5em;}
h5 {font-size: clamp(1.25rem, 2vw, 1.5rem);line-height: 1.4;font-weight: 600;margin-bottom: 0.5em;}
h6 {font-size: clamp(1rem, 1.5vw, 1.25rem);line-height: 1.5;font-weight: 600;margin-bottom: 0.5em;}
input::-webkit-input-placeholder {
  color: #999;
}

input::-moz-placeholder {
  color: #999;
}

input:-ms-input-placeholder {
  color: #999;
}

input::placeholder {
  color: #999;
}


/* Paragraphs */
p {margin-bottom: 1.25em;}
.fal, .fa{font-family: 'FontAwesome';   font-style: normal;}
.container{max-width:var(--width); margin:0 auto; width:100%;}
.d-flex{display:flex;}
.align-center{align-items:center;}
.justify-center{justify-content:center;}
.d-grid{display:grid;}
.gap{gap:clamp(1rem, 5vw, 5rem)}
.gap-1{gap:clamp(3rem, 6vw, 2rem)}
.gap-2{gap:clamp(1rem, 5vw, 1rem)}
.right-section .icon{width:50px; height:50px; padding:.75rem; background:#f5f5f5; border-radius:100%;margin-bottom: 1rem;}
.py-1{padding-top:clamp(1rem, 5vw, 1.5rem); padding-bottom:clamp(1rem, 5vw, 1.5rem)}
.py-3{padding-top:clamp(1.5rem, 5vw, 3rem); padding-bottom:clamp(1.5rem, 5vw, 3rem)}
.pt-3{padding-top:clamp(1.5rem, 5vw, 3rem); }
.pb-3{padding-bottom:clamp(1.5rem, 5vw, 3rem); }
.mb-3{margin-bottom:clamp(1.5rem, 5vw, 3rem); }
.pt-4{padding-top:clamp(2rem, 7vw, 7rem); }
.more-btn{padding-right:1.5rem; background:url(images/more-btn.svg) no-repeat; background-position:center right; background-size:14px auto; width:20px; height:20px; transition:all .3s ease;}
.more-btn:hover{opacity:.8}
.text-center{text-align:center;}
.insights-section .post{position:relative; transition:all .3s ease;}
.insights-section .post-content:before {position: absolute;content: "";right: -83px;bottom: -35px;width: 100%;height: 100%;background: url(https://ittech.ditsolution.net/wp-content/uploads/2025/02/shape-1.png);z-index: -1;
background-size: auto 100%;background-repeat: no-repeat;background-position: center;transition: .5s;}
.insights-section .icon{width:50px; height:50px;}
.slanted-image {position: relative;width: 100%;overflow: hidden;}
.slanted-image img {clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%); border-radius:10px;aspect-ratio: 1 / 1; object-fit:cover; object-position:center right; width:100%;}
.insights-section .post-content{filter: drop-shadow(0px 20px 50px rgba(221, 221, 221, 0.3));background-color: #ffffff;
padding:2rem 1.5rem 2rem;border-radius: 10px 0 10px 10px;width: 85%;transition: .5s;overflow: hidden;}
.insights-section .link{width: 42px;height: 42px;border-radius: 21px;background-image: linear-gradient(-45deg, #1a90ff 0%, #3513f9 100%);display: flex;align-items: center; justify-content:center;color: #fff;line-height: 42px;
transition: .5s;transform: rotate(-45deg);}
.link img{filter: invert(100%) brightness(200%); width:60%;}
/*header css*/
.header-container{ width:100%; background:#ffffff01; z-index:1; border-bottom:1px solid #E4E9F1}
.logo{font-size: clamp(1rem, 3vw, 1.25rem); font-weight:400;font-family: 'Michroma', sans-serif;}
.nav-section{display:flex; gap: clamp(1rem, 3vw, 3rem); justify-content:space-between; align-items:center;font-size: clamp(1rem, 3vw, 1.15rem);}
.nav-section .menu{display:flex; justify-content:space-between; gap:0 1rem; list-style:none; padding:0; margin:0;}
.nav-section .menu a{padding:clamp(.25rem, 1vw, .5rem);color:#1D2840; font-weight:500;}
.nav-section .menu a:hover{padding:clamp(.25rem, 1vw, .5rem);color:var(--e-global-color-accent);}
.menu-toggle {flex: unset;z-index:2;color:#FF0266; width: 36px; height: 36px; padding: 0;margin: 0;outline: none; position: relative; border: none;   background: none;cursor: pointer;-webkit-appearence: none; -webkit-tap-highlight-color: transparent;}
.menu-toggle svg {width: 64px;height: 48px;top: -6px; left: 0px; stroke:#000; stroke-width: 3px;stroke-linecap: round; stroke-linejoin: round;fill: none;display: block;position: absolute;}
.menu-toggle svg path {transition: stroke-dasharray var(--duration, 0.85s) var(--easing, ease) var(--delay, 0s), stroke-dashoffset var(--duration, 0.85s) var(--easing, ease) var(--delay, 0s); stroke-dasharray: var(--array-1, 26px) var(--array-2, 100px); stroke-dashoffset: var(--offset, 126px); transform: translateZ(0);}
.menu-toggle svg path:nth-child(2) {--duration: .7s;--easing: ease-in;--offset: 100px;--array-2: 74px;}
.menu-toggle svg path:nth-child(3) {--offset: 133px;--array-2: 107px;}
.menu-toggle.active svg path { --offset: 57px;}
.menu.active svg path:nth-child(1), 
.menu.active svg path:nth-child(3) { --delay: .15s;--easing: cubic-bezier(.2, .4, .2, 1.1);}
.menu-toggle.active svg path:nth-child(2) {--duration: .4s; --offset: 2px; --array-1: 1px;}
.menu-toggle.active svg path:nth-child(3) { --offset: 58px;}
.nav-section .submenu{display:none;}
.header-container .right-section a{ margin-right:0;background:transparent;padding: clamp(.25rem, .5vw, .35rem);
}
/*header css*/
.lqd-particles {filter: brightness( 100% ) contrast( 100% ) saturate( 120% ) blur( 150px ) hue-rotate( 0deg );position: absolute;left: 0;top: 0;width: 100%;height: 100vh; z-index:0; opacity:.3;}
.elementor-element-a419186 {position: absolute;left: 0;top: 0;width: 100%;height: 100vh; pointer-events:none;}
.lqd-particles *, .elementor-element-a419186  *{width:100%;height:100%}
/*banner css*/
.banner{position:relative;background: url(https://joule.keydesign.xyz/ai-converter-tool/wp-content/uploads/sites/5/2024/11/ai-converter-tool-bg.svg) repeat-y center center;
}
/* .banner:before {filter: brightness( 100% ) contrast( 100% ) saturate( 120% ) blur( 150px ) hue-rotate( 0deg );background: url(https://wp.ditsolution.net/ittech-preview/assets/images/section-images/feature-bg.png) no-repeat;background: url(https://ittech.ditsolution.net/wp-content/uploads/2024/10/banner-1.jpg) no-repeat; background-size: cover; background-position: center center; width:100%; height:100%; position:absolute; left:0; top:0; content:""; opacity:.6} */
.banner .container{position:relative; font-size:clamp(1rem, 5vw, 1.5rem)}
.banner h1{color:var(--e-global-color-text); margin-bottom:3rem; max-width:80%; margin-left: auto; margin-right:auto;}
.banner h1 span span{/* background: linear-gradient(90deg, #7e06dc 0%, #673898 45.714285714285715%, #43BADF 100%);  */ /* background: linear-gradient(90deg, #A75BE2  10%,#8b1656  30.714285714285715%,#43BADF  100%); */
-webkit-background-clip: text; background-clip: text;color: transparent; color:var(--e-global-color-primary);}
.chat-section{background:#E8F0FF66;border:1px solid #e5d7f1; border-radius:1em; margin-top:clamp(1rem, 5vw, 3rem); padding:clamp(1.25rem, 3vw, 2rem); box-shadow: rgba(0, 0, 0, 0.07) 0px 8px 60px 0px;}
.chat-section h5{font-weight:500; margin-left:2rem;}
.chat-form{display:flex;padding: .25rem .25rem .25rem 2rem; background: #FFFFFF; border-radius: 11px 11px 11px 11px; box-shadow: 0px 4px 59px 0px rgba(38, 49.999999999999986, 95, 0.058823529411764705); justify-content:space-between;align-items: center;}
.chat-form input{flex:1;font-size:clamp(1rem, 0.5vw + 0.3rem, 1rem); padding-right:1rem}
.lqd-btn, .lqd-btn *{ transition:all .5s ease-in-out}
.chat-form .lqd-btn:hover{background:#f5f5f5;}
.chat-form .lqd-btn:hover svg{transform:scale(1.2); transform-origin:center center;}
.chat-form button{color:#272657;padding:clamp(.75rem, 0.5vw + 0.3rem, 1rem) clamp(.5rem, 0.5vw + 0.3rem, .75rem); margin-left:.5rem;}
#chatbot-icon {
      position: fixed;
      bottom: 10px;
      right: 10px; padding:0;
      border: none;
      border-radius: 50%;
      font-size: 24px;
      cursor: pointer;
      z-index: 1000; transition:all .5s ease;
    }
 #chat-popup {
      display: none;
      flex-direction: column;
      position: fixed;
      bottom: 90px;
      right: 20px;
      width: 350px;
      height: 500px;
      background: white;
      border: 1px solid #ccc;
      border-radius: 8px;
      overflow: hidden;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
      z-index: 999;
    }
#chat-header {
      background-color: #007bff;
      color: white;
      padding: 12px;
      font-weight: bold;
      text-align: center;position:relative;
    }
#chat-header .chat-close{
    position: absolute; cursor:pointer;
    right: 16px;
    top: 14px;
    width: 16px;
    height: 16px;
    }
#chat-header .chat-close:after, #chat-header .chat-close:before{content:""; position:absolute; left:0; top:0; background:#fff; width:1.5px; height:100%;}
#chat-header .chat-close:after{transform:rotate(45deg);}
#chat-header .chat-close:before{transform:rotate(-45deg);}
#popchat-results {
      flex: 1;
      padding: 10px;
      overflow-y: auto;
      font-size: 14px;
    }
#popchat-input {
      display: flex;
      border-top: 1px solid #ccc;
    }
#popsend-button {
  padding: 10px 15px;
  background-color: #007bff;
  color: white;
  border: none;
  cursor: pointer;
}
#pop-message {
      flex: 1;
      padding: 10px;
      border: none;
      outline: none;
      font-size: 14px;
}
#send-button {
      padding: 10px 15px;
      background-color: #007bff;
      color: white;
      border: none;
      cursor: pointer;
    }.chat-message:not(.reply) {align-self: end;}
.marquee {width: 100%;overflow: hidden; }
.chat-section .marquee{margin-top:1.5rem;}

.marquee .inner {width: 100%;display: flex; gap:1rem; justify-content:center; align-items:center;}
.marquee .inner > * {transition:all 0.3s ease;font-size:80%; padding:.25rem 1rem; white-space:nowrap; background:#fff}
.marquee .inner > *:hover {}
.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block;
}
.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function,initial);
    box-sizing: content-box;
}
.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper {
    transform: translate3d(0px, 0, 0);
}
.swiper.marquee-swiper {
  margin-top: 4rem; margin-bottom:3rem;
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    white 10%,
    white 90%,
    transparent 100%
  );
}

.swiper-wrapper.marquee-swiper {
  transition-timing-function: linear;
  align-items: center;
}
.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display: block;
}
.swiper-slide.marquee-swiper {
	width:8em;
  display: flex;
  align-items: center;
  justify-content: center;transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/*banner css end */

/*about-section css*/
.about-section{position:relative;}
.about-section:before{position:absolute; left:0; bottom:-20px; width:100%; height:330px;content:"";/* background:url(https://ittech.ditsolution.net/wp-content/uploads/2024/10/about-bg.png) no-repeat center bottom; background-size:contain; */
clip-path: polygon(100% 0%, 0% 0% , 0.00% 83.13%, 4.00% 87.40%, 8.00% 91.18%, 12.00% 94.28%, 16.00% 96.55%, 20.00% 97.86%, 24.00% 98.16%, 28.00% 97.42%, 32.00% 95.69%, 36.00% 93.05%, 40.00% 89.64%, 44.00% 85.63%, 48.00% 81.22%, 52.00% 76.65%, 56.00% 72.13%, 60.00% 67.91%, 64.00% 64.20%, 68.00% 61.18%, 72.00% 59.02%, 76.00% 57.81%, 80.00% 57.63%, 84.00% 58.48%, 88.00% 60.32%, 92.00% 63.05%, 96.00% 66.54%, 100.00% 70.60%);
    background:#f7f8fa;
    z-index: -1;
}
.about-section:after{position:absolute; left:0; top:0px; width:100%; height:100%;content:""; background:linear-gradient(180deg, #f7f8fa 50%, #fff 100%);
    z-index: -2;
}
.bio-section{position:sticky; top:0; z-index:2;}
.bio-section .details{width: 80%;background: #000C60; color: #fff; padding: clamp(.5rem, 1vw, 1rem);font-size:clamp(1rem, 1vw, 1.05rem)}
.details h2{font-size:clamp(1.25rem, 4vw, 1.5rem); color:#fff;}
.about-section h2{margin-bottom:0;}
.about-section .designation{color:var(--e-global-color-primary); margin-bottom:1.5rem;}
/*about-section css end*/

/*usecase-section css*/
.usecase-section .left-section{padding-top:1rem;}
.usecase-section .item{padding:1rem; border-radius:8px;/*  display:flex; flex-direction:column; */}
.usecase-section .item:hover{background:#fff; box-shadow: 0px 4px 59px 0px rgba(38, 49.999999999999986, 95, 0.058823529411764705);}
.usecase-section .item .more-btn{margin-top:auto;}
/*usecase-section css end*/

/*leadership-section css*/
.leadership-section .post {background:#f7f8fa;box-shadow: 0px 5px 33px 0px rgba(64, 92.00000000000006, 146, 0.25);    padding-right: 2rem;}
.leadership-section .post-img{aspect-ratio: .8;align-self: stretch;display: flex;}
.leadership-section .post-img img{height:100%; width:auto; object-fit:cover; object-position:center center; border-radius:0 0 60px 0}
.leadership-section h4 a{color:#2e2e2e}
.leadership-section .link{font-size:90%;
    display: inline-flex; align-items:center; gap:.5rem;
    text-transform: uppercase;
    color: rgb(4, 20, 36);
    position: relative;
    z-index: 2;
    border-radius: 30px;
    background: rgb(255, 255, 255);
    padding: 7px 24px;
    transition: 0.5s;
    overflow: hidden; fill:#010002}
.leadership-section .link:hover{color:#fff; fill:#fff}
.leadership-section .link svg{width:15px; height:15px;transform: rotate(-45deg);}

.leadership-section .link:after {
    position: absolute;
    content: "";
    right: 0px;
    top: 0px;
    background-image: linear-gradient(-45deg, rgb(26, 144, 255) 0%, rgb(53, 19, 249) 100%);
    height: 100%;
    width: 0px;
    z-index: -1;
    border-radius: 30px;
    transition: 0.5s;
}
.leadership-section .link:hover:after {
    width: 100%;
    right: inherit;
    left: 0px;
}
.tab-content{padding:2rem; position:relative;}
.tab-content:before{width:100%; height:70%; content:""; border:1px solid #f5f5f5; background:#fff;position:absolute; left:0; bottom:0; z-index:-1; border-radius:10px;}
.tab-content .top-section{align-items:flex-end; margin-bottom:2rem;}
.tab-content .top-section h5{margin-bottom:rem;}
.events-section{background:#f7f8fa}
.events-section .event-item-inner{background:#fff;box-shadow:0px 12px 12px -9px rgba(64, 92.00000000000006, 146, 0.15);}
.events-section .event-item-inner .event-image {
    position: relative;
}
.event-content{padding:1.5rem;}
.event-meta{color:#696969}

.zoom-image {
    color: #fff;
    font-size: 0;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    z-index: 2;
}

.entry-thumbnail-overlay:after, .zoom-image {
    position: absolute;
    bottom: 0;
    right: 0;
    display: block;
    opacity: 0;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.placeholder-image {position: relative;
    display: block;
    --g5-image-ratio: 56.25%;
    background-color: var(--g5-background-color-contrast-06);
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.placeholder-image:before {
    content: "";
    display: block;
    width: 100%;
    padding-top: var(--g5-image-ratio);
}
.events-section .event-item-inner .event-image .btn {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    z-index: 5;
}
.events-section h3 a{color:var(--e-global-color-text);font-weight:500;}
.tribe-events-list-event-title span {
    font-size: 1.2rem; font-weight:600px;
    display: inline-block;
    vertical-align: middle;
}
@media(min-width:1025px){
	.menu-toggle{display:none;}
	.banner p{width:80%; margin:0 auto;}
	.insights-section .post-content:before {opacity: 0;}
	.insights-section .post:hover .post-content:before{opacity:1;}
	.insights-section .link{position: absolute;bottom: -60px;}
	.insights-section .post:hover .link {bottom: 2rem;}
	.insights-section .post-content{position: absolute;right: 0; bottom:-50px;}
	.insights-section .post:hover .post-content{padding-bottom:6rem}
}
@media (max-width: 1024px) {
    .nav-container {
    flex-direction: column;
    z-index: 1;
    position: fixed !important;
    width: 100% !important;
    height: 101vh !important;
    max-height: unset !important;
    top: 0px !important;
    left: -100%;
    display: flex !important;
    max-width: inherit !important;
    margin: auto;
    padding: calc(20vw) 2rem 2rem;
    transition: 0.3s !important;
	background: rgb(12, 35, 64) !important;
    }
	.nav-section .menu{flex-direction:column; gap:1.5rem;}
	.nav-container.active{left: 0;}
	.nav-section .menu a{color:#fff; font-size:4vw;}
	.banner > *, .header-container, .main-content > *{padding-left:1.5rem;padding-right:1.5rem; }
	.swiper-slide.marquee-swiper{width: 6em;}
	.insights-section > div > *, .leadership-section  >div > *,.events-section  >div > *{width:100%!important;}
	.insights-section .post-content{margin-left:auto; margin-top:-40%;}
	.usecase-section .item{background:#fff; box-shadow: 0px 4px 59px 0px rgba(38, 49.999999999999986, 95, 0.058823529411764705);}

}
@media(min-width:768px){
	.three-six-col{grid-template-columns: 3fr 7fr}
	.two-col{grid-template-columns: 6fr 3fr;}
	.three-col{grid-template-columns: repeat(3, 3fr);}
	.half-col{grid-template-columns: 5fr 5fr}
}