@import url('https://api.fontshare.com/v2/css?f[]=switzer@100,200,300,400,500,600,700,800&display=swap');
:root {
    /*--white: #ffffff;
    --black: #101010;*/
    --peach: #FF663D;
    --bs-peach-rgb: 255, 102, 61;
    --maroon: #773929;
    --dark: #1E1A18;
    --text-yellow: #F3EC25;
    --peachdark: #080401;
    --darkgradient: linear-gradient(180deg, #1E1E1E 0%, #080401 100%);
    --grey: #F2F2F2;
    --grey1: #F1F1F1;
    --step-box-width: 100%;
    --step-line-width: 2px;
    --text-line-1: 1;
    --text-line-2: 2;
    --text-line-3: 3;
    --text-line-4: 4;
}
.fs-1{
  font-size: clamp(30px, 2.5vw, 48px) !important;
}
.display-6 {font-size: clamp(30px, 3.33vw, 64px); }
.display-5 {font-size: clamp(48px, 5vw, 50px); }
.display-4 { font-size: clamp(48px, 5vw, 96px); }
.line-clamp{
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: var(--text-line-1);
    -webkit-box-orient: vertical;
}
.twoline{
    -webkit-line-clamp: var(--text-line-2);
}
.threeline{ -webkit-line-clamp: var(--text-line-3); }
.fourline{ -webkit-line-clamp: var(--text-line-4); }
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
sup {
    top: -1.5em;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
body {
  font-family: 'Switzer', sans-serif;
  font-weight: normal;
    font-size: 14px;
  line-height: 1.3rem;
}
.border-peach{ border-color: var(--peach); }
.text-yellow{ color: var(--text-yellow); }
.text-peach{ color: var(--peach); }
.boxshadow{ box-shadow: 0px -2px 1px #ffffff2b; }
.bg-peachdark{ background-color: var(--peachdark); }
.bg-dark-gradient{ background: var(--darkgradient); }
.bg-peach{ background-color: rgba(var(--bs-peach-rgb), var(--bs-bg-opacity)); }
.bg-grey{ background: var(--grey1);}
.fs-14{ font-size: 14px; }
.fs-13{ font-size: 13px; }
a {
  text-decoration: none;
}
.form-control:focus{ box-shadow: none;  }
select.form-control{
    background: url(../images/down-arrow.svg) no-repeat center right 15px;
    background-size: 14px;
}
.line-clamp-title1{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
}
.line-clamp-text4{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}
.shadow1{ box-shadow: 0 4px 62.3px 0 #E9E9E9; }
.shadow2{ box-shadow: 0 15px 46.2px 0 rgba(0, 0, 0, 0.05); }
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0px;
  line-height: 1.2;
}
ul {
  margin: 0px;
  padding: 0px;
}

p {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a:focus,
a:hover {
  color: inherit;
  text-decoration: none;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
    -webkit-transition: color 0.3s 0s ease-out;
  -moz-transition: color 0.3s 0s ease-out;
  -ms-transition: color 0.3s 0s ease-out;
  -o-transition: color 0.3s 0s ease-out;
  transition: color 0.3s 0s ease-out;
}
button:focus {
  outline: 0;
}
*::-moz-selection {
  background: #C5E3FE;
  color: #000;
  text-shadow: none;
}

*::-webkit-selection {
  background: #C5E3FE;
  color: #000;
  text-shadow: none;
}
*::selection {
  background: #C5E3FE;
  color: #000;
  text-shadow: none;
}
.zoom-img{overflow: hidden;}
.zoom-img img{
    object-fit: cover; transform: scale(1.01);
    -moz-transform: scale(1.01);
    -ms-transform: scale(1.01);
    -o-transform: scale(1.01);
    transition: all 700ms ease;
}
.zoom-img:hover img{
    transform: scale(1.2) rotate(2deg);
    -moz-transform: scale(1.2) rotate(2deg);
    -ms-transform: scale(1.2) rotate(2deg);
    -o-transform: scale(1.2) rotate(2deg);
}
.title-gradient{
    background: linear-gradient(180deg, var(--bs-white) 81.96%, var(--peach) 92.75%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.title-gradient-dark{
    background: linear-gradient(90deg, var(--bs-black) -9.35%, var(--peach) 92.75%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: fit-content;
}
.title-gradient-left{
    background: linear-gradient(90deg,var(--bs-black) -9.35%, var(--peach) 52.76%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: fit-content;
}
.title-gradient-center{
  background: linear-gradient(180deg,var(--bs-white) 0 62%, var(--peach));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* .title-gradient-right-dark {
    background: linear-gradient(90deg,#17171a -9.35%,#8858f9 52.76%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: fit-content;
} */
/* Theme Button start */
.themebtn{
    padding: .8rem 1.5rem;
    background-color: var(--peach);
    border: 1px solid var(--bs-white);
    border-radius: var(--bs-border-radius-pill);
    text-align: center;
    color: var(--bs-white);
    text-decoration: none;
    transition: all 0.35s;
    box-sizing: border-box;
}
.themebtn:hover {
  color: var(--peach);
  transition-delay: 0.2s;
  animation: anidotted 0.6s forwards;
  background: radial-gradient(circle, var(--bs-white) 0.2em, transparent 0.3em) 6em 6em/1em 1em, radial-gradient(circle, var(--bs-white) 0.2em, transparent 0.3em) 0 0/1em 1em;
}
@keyframes anidotted {
  100% {
    background-size: 2.375em 2.375em, 0.1em 0.1em;
  }
}
.textarrow{ text-decoration: underline; }
.textarrow:after {
  font-size : 26px;
  color: var(--peach);
  position : relative;
  content : "\2192";
  margin-left : -1.2rem;
  bottom : -.2rem;
  display : inline-block;
  -webkit-transition: all .4s ease-in-out;
    opacity: 0;
}
.textarrow:hover:after {
  transform : translateX(30px);
  opacity: 1;
}
.textarrow:hover{ color: var(--peach) !important; }
/*.btntext {
  display: inline-block;
  text-decoration: none;
  padding: .6rem 1.5rem;
  color: var(--bs-white);
}
.btntext .arrow-icon {
  position: relative;
  top: -1px;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  vertical-align: middle;
}
.btntext .arrow-icon--circle {
  transition: stroke-dashoffset 0.3s ease;
  stroke-dasharray: 95;
  stroke-dashoffset: 95;
}
.btntext:hover{ color: var(--peach); }
.btntext:hover .arrow-icon {
  transform: translate3d(5px, 0, 0);
    fill: var(--peach);
}
.btntext:hover .arrow-icon g{ stroke: var(--peach); }
.btntext:hover .arrow-icon--circle {
  stroke-dashoffset: 0;
    
}*/

/* Theme Button End */

/******Header Start******/
.navbar{ --bs-navbar-padding-y: 0.9rem; }
header{ background: var(--bs-white); height: 5rem; }
.dropdown-toggle::after{ vertical-align: 0.115em; }
.navigation {
    position: relative;
    justify-content: center;
}
.navigation>ul>li {
  position: relative;
  list-style: none;
  display: inline-block;
  transition: none;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}
.navigation>ul>li>a {
    display: inline-block;
    padding: .5rem 1.3rem;
    position: relative;
    border: solid 1px transparent;
    border-radius: var(--bs-border-radius-pill);
    transition: all 0.35s ease-in-out;
    font-size: 1rem;
}
/*.dropdown-toggle::after{
    width: 6px;
    height: 6px;
    margin-left: 0.6em;
    border: solid var(--black);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
    position: absolute;
    top: 42%;
}*/
.navigation>ul>li>a:hover, .navigation>ul>li>a.active{
    color: var(--peach);
    border: solid 1px var(--peach);
}
.header-logo{
    width: 10.625rem;
}
.header-logo img, .footer-logo img{ width: 100%; }
/*Header end*/

/*Slider*/
.slider-area{ position: relative; overflow: hidden; z-index: 1; }

.owlshapebg{ 
    background: radial-gradient(0.67% 50% at 50.03% 50%, rgba(252, 97, 1, 0.27) 100%);
    filter: blur(274.3999938964844px);
    display: inline-block;
    width: 100%;
    /*left: 100px;*/
    position: absolute;
    height: 75%;
    z-index: -1;
    /*opacity: .7;*/
}
.animtedlines svg{ 
    width: 100%;
    margin: -15rem auto -3rem;
    background-size: cover;
}
.homebannerlogo, .homebannerlogo1, .homebannerlogo2{
    position: absolute;
    margin: 0 auto;
    transform: translate(-50%, -100%);
    top: 50%;
    left: 50%;
    border-radius: 10px;
    background: #17171A;
    box-shadow: 0 0 16.7px 1px rgba(252, 97, 1, 0.59);
    width: 5rem;
    padding: .7rem;
}
.slider-area h1.display-4{ line-height: 1.04; }
/*.sm-circle{
   background:  linear-gradient(180deg, #FFF 40.96%, #FF8260 88.75%); 
   stroke:#f00; 
}*/
#grad1{ background: linear-gradient(180deg, #FFF 40.96%, #FF8260 88.75%); }

/*.g-short-line {
  --offset: 500;
  --offsetEnd: -650;
  stroke-dasharray: 100, 1050;
  -webkit-animation: move 5.4s infinite linear;
          animation: move 5.4s infinite linear;
  stroke: #FF663D;
    background: #ccc;
}
.g-shadow {
  --offset: -30;
  --offsetEnd: -350;
  stroke-dasharray: 10, 320;
  stroke-dashoffset: var(--offset);
  -webkit-animation: move 2.4s infinite linear;
          animation: move 2.4s infinite linear;
  filter: drop-shadow(0 0 5px #ff3d00);
  stroke: white;
}*/
@-webkit-keyframes move {
  0% {
    stroke-dashoffset: var(--offset);
  }
  100% {
    stroke-dashoffset: var(--offsetEnd);
  }
}

@keyframes move {
  0% {
    stroke-dashoffset: var(--offset);
  }
  100% {
    stroke-dashoffset: var(--offsetEnd);
  }
}

#svg-stage {
  width:60%;
  max-width:750px;
  overflow:visible;
}
.shrinkanimation{
    -webkit-animation: shrink 1s linear 0s infinite alternate;
    -moz-animation: shrink 1s linear 0s infinite alternate;
    -ms-animation: shrink 1s linear 0s infinite alternate;
    -o-animation: shrink 1s linear 0s infinite alternate;
    animation: shrink 1s linear 0s infinite alternate;
}
@-webkit-keyframes shrink {
  0% {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}
@-moz-keyframes shrink {
  0% {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}
@-ms-keyframes shrink {
  0% {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}
@-o-keyframes shrink {
  0% {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}
@keyframes shrink {
  0% {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

.networksbox p, .aboutbox p{
    line-height: 2rem;
    color: rgba(0, 0, 0, .75) !important;
    font-size: 1.25rem;
}
.animtedlines1 svg{ 
    width: 100%;
    margin: -15rem auto -8rem;
    background-size: cover;
}
.homebannerlogo1{
    top: -90%;
    left: 47.5%;
}
.aboutbox p{
    font-size: 1.5rem!important;
    line-height: 2.5rem;
}
.servicebox{ background: var(--grey); transition: .5s all ease; }
.servicebox:hover{ box-shadow: 0 4px 62.3px 0 #E9E9E9; background: var(--bs-white);  }

.icon1{
    height: 3rem;
    width: 3rem;
}
.icon2{
    height: 5rem;
    width: 5rem;
}
.rotate1{ rotate: -45deg; }
.text-justify {
  text-align: justify;
}
.servicesvgpath svg{ width: 100%; object-fit: cover; }
/* .servicerow div:nth-child(2) .servicebox{
    margin-top: 5rem;
} */
.servicebox p{ font-size: clamp(16px, 1.04vw, 20px); line-height: 1.5rem; color: rgba(0, 0, 0, .6) !important; margin-bottom: 0; }
/********** Solutions Start ***********/
.solutiontabtitle div{ width: 30%; }
.solutiontabtitle div:nth-child(1){ padding-left: 5rem; width: 25%; }
.solutiontab{
    cursor: pointer;
    padding: .5rem 1.3rem;
    color: rgba(0, 0, 0, .7);
        /*transition: all 0.35s ease-in-out;*/
}
.solutiontab div:first-child{ 
    font-size: 1.4rem;
    padding-left: 3.5rem;
    width: 25%;
    line-height: 1.8rem;
    opacity: 1;
}
.solutionmain{
    
}
.solutiontab:nth-child(1){ margin-top: 1.5rem; }
.solutiontab.active{
    max-width: 100%;
    height: 9.3rem;
    background: linear-gradient(90deg, var(--dark) 25%, var(--maroon) 73.56%, var(--peach) 100%);
    /*border: 2px var(--peach) dashed;
    filter: drop-shadow(0 4px 21.1px rgba(238, 99, 63, 0.13));*/
    color: var(--bs-white);
    font-weight: 300;
    /*border-radius: var(--bs-border-radius-2xl);*/
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1222 154' fill='none'%3E%3Cpath d='M289.252 83.4607H42.2304C19.4595 83.4607 1 65.0013 1 42.2304C1 19.4595 19.4594 1 42.2303 1H1170.99C1198.61 1 1221 23.3916 1220.99 51.0095L1220.98 102.51C1220.98 130.12 1198.59 152.5 1170.98 152.5H360.743C341.475 152.5 325.669 137.237 324.998 117.98C324.326 98.724 308.521 83.4607 289.252 83.4607Z' fill='url(%23paint0_linear_241_1548)' stroke='%23FF663D' stroke-width='2' stroke-dasharray='5 5'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_241_1548' x1='1' y1='76.75' x2='1221' y2='76.75' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0.25' stop-color='%231E1A18'/%3E%3Cstop offset='0.735577' stop-color='%23773929'/%3E%3Cstop offset='1' stop-color='%23EE633F'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
    background-size: cover;
    background-repeat: no-repeat;
    padding: 2rem 1.2rem 5.6rem;
    margin-bottom: -3.5rem;
}
.solutiontab.active div{ opacity: 1; }
.solutiontab div{
    width: 30%;
    opacity: 0;
}
.solutiontab p{ font-weight: 300; }
.solutiontab.active div:first-child{ color: var(--peach); font-weight: 500; position: relative; }
.solution-area {
    counter-reset: chapter;
}
.solutiontab .lefttitle::before{
    counter-increment: chapter;
    content: counter(chapter) ".";
    font-size: 1.3rem;
    position: absolute;
    display: flex;
    height: 2rem;
    width: 2rem;
    background: rgba(255, 102, 61, 0.12);
    color: var(--peach);
    border: solid 1px var(--peach);
    border-radius: var(--bs-border-radius-pill);
    justify-content: center;
    align-items: center;
    opacity: 0;
    left: 0.5rem;
    top: -.2rem;
}
.solutiontab.active .lefttitle::before{ opacity: 1; }
/********** Solutions End ***********/

/********** Counter start ***********/
.countermain{ /*grid-template-columns: repeat(3, 1fr);*/
    display: flex;
    /*flex-flow: wrap;*/
    align-items: center;
}
.countermain div{ /*flex-basis: 30%;*/ flex-basis: 60%; transition: all 0.35s ease-in-out; }
.countermain div:nth-child(4), .countermain div:nth-child(5) {
    /*flex-basis: 47%;*/
    flex-basis: 100%;
}
.countermain div:hover{ box-shadow: 0 4px 18.3px 0 rgba(255, 102, 61, 0.22); }
.box-shadow-peach{ box-shadow: 0 4px 18.3px 0 rgba(255, 102, 61, 0.22); }
/********** Counter end ***********
/********** Newsletter Start ***********/
.newsletterbox { box-shadow: 0 4px 71.3px 0 rgba(255, 102, 61, 0.33); }
.owlshape2::before, .owlshape3::before{
    content: '';
    height: 100%;
    width: 50%;
    border-radius: 871px;
    background: rgba(255, 102, 61, 0.35);
    filter: blur(201.64999389648438px);
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
}
.hexagon{ 
    position: absolute;
    width: 6rem;
    height: 6.5rem;
    background-color: var(--peach);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display: inline-block;
    color: var(--bs-white);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
    border-radius: 50% / 25%;
    corner-shape: bevel;
    aspect-ratio: cos(30deg);
    border: 1px solid var(--peach);
    background-clip: content-box;
    padding: 10px;
    top: 0%;
    transform: translate(-50%, -50%);
}

/********** Newsletter End ***********/

/*********** Footer start ***********/
.footeraddress i{
    vertical-align: middle;
    width: 2rem;
    margin-right: .5rem;
    font-size: 1.5rem;
}
ul.sociallist, ul.contactsociallist  {
    margin: 0;
    padding: 0;
}
ul.sociallist li, ul.contactsociallist li{ 
    border-radius: 50%;
    display: inline-flex;
    margin-right: 5px;
}
ul.sociallist li a, ul.contactsociallist li a {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    transition: all 0.35s ease-in-out;
    color: var(--bs-black);
    --bs-bg-opacity: .1;
    border: solid 1px rgba(var(--bs-black-rgb), var(--bs-bg-opacity));
}
ul.sociallist li:hover a, ul.contactsociallist li:hover a{
    color: var(--bs-white) !important;
    background: var(--peach) !important;
}
.footer-logo a{ width: 9rem; display: inline-block; }

.footerli li a{ position: relative;}
.footerli li a:hover{ color: var(--peach); }
.footerli li a::before {
    content: "";
    border-bottom: solid 1px var(--peach);
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.25s;
}
.footerli li a:hover::before {
    transform-origin: left;
    transform: scaleX(1);
}
.subscribebox{ width: 40%; }
.subscribebox .btn{
    padding: .8rem 1.8rem;
    font-size: 1rem;
    background: var(--bs-white);
}
.subscribebox .btn:hover{ background: var(--peach); }
.subscribebox input, .subscribebox input::placeholder{ font-size: 14px; color: var(--bs-white); font-weight: 400; }
.opacity-10{ opacity: .10; }

/*********** Footer Close ***********/

/*********** Service Pgae start ***********/
.servicehero-area::before, .servicehero-area::after{
    content: '';
    background: url(../images/service-dotsimg.png) no-repeat right center;
    width: 30rem;
    right: 0;
    height: 100%;
    background-size: cover;
    position: absolute;
}
.servicehero-area::before{
    height: 80%;
    width: 45%;
    border-radius: 419px;
    background: rgba(255, 102, 61, 0.38);
    filter: blur(129.39999389648438px);
    right: -25%;
}
.getintouch::before, .getintouch::after{
    content: '';
    height: 30%;
    width: 25%;
    border-radius: 419px;
    background: rgba(255, 102, 61, 0.70);
    filter: blur(129.39999389648438px);
    position: absolute;
    z-index: 1;
}
.getintouch::before{
    left: -10%;
}
.getintouch::after{
    right: -10%;
}
.getintouch{
    background: var(--peachdark) url(../images/getintouchdoted.png) no-repeat center center;
}
.getintouch img{ width: 35%; }
.rotate-180 {
  transform: rotate(180deg);
}
/*********** Service Pgae end ***********/

/*********** Service View Pgae Start ***********/
.scrolline {
    display: flex;
    align-items: center;
    justify-content: center;
    width: .3rem;
    height: 8rem;
    position: relative;
    z-index: 1;
    left: .1rem;
    transform-origin: top right;
    transform: scaley(0);
    transition: transform 1s ease 0.25s;
}
.stepboxmain::before {
    position: absolute;
    top: 50%;
    bottom: -100px;
    width: var(--step-line-width);
    content: '';
    height: 100%;
    transform: translate(0, -50%);
    background: #eee;
    left: 50%;
}
.stepboxmain::after{
    content: '';
    background: var(--peach);
    width: .6rem;
    height: .6rem;
    position: absolute;
    bottom: 0;
    border-radius: var(--bs-border-radius-pill);
    transform: translate(-35%, 0%);
    left: 50%;
}
.stepitem, .stepcontentbox {
    flex-basis: var(--step-box-width);
}
.stepbox.scrollline-active .scrolline {
    background: linear-gradient(180deg, rgba(var(--bs-white-rgb), .1) 0, rgba(var(--bs-peach-rgb), 1));
    border-radius: var(--bs-border-radius-xxl);
    top: 0;
    will-change: height;
    transform: scaley(1);
}
.stepbox.scrollline-active h5{ color: var(--peach) !important; }
.stepbox.scrollline-active .stepcontentbox::before{
    --bg-opacity: 1 !important; color: var(--bs-white) !important;
}
.stepboxmain{ counter-reset: chapter; }
.stepboxmain .stepbox .stepcontentbox::before {
    counter-increment: chapter;
    content: counter(chapter);
    font-size: 1rem;
    font-weight: 500;
    line-height: inherit;
    color: var(--peach);
    background-color: rgba(var(--bs-peach-rgb), var(--bg-opacity));
    --bg-opacity: .1;
    height: 2rem;
    display: inline-flex;
    width: 2rem;
    justify-content: center;
    align-items: center;
    border-radius: var(--bs-border-radius-pill);
    transition: all 0.35s ease-in-out;
}
.stepbox:nth-child(odd) .stepitemimg{ text-align: end; }
.stepbox:nth-child(even){
    flex-direction: row-reverse;
}
.stepbox:nth-child(even) .stepcontentbox{
    text-align: end;
}
.stepbox .stepitemimg img{ width: 6rem; filter: grayscale(1) brightness(1.5); transition: filter 0.3s ease-in-out; }
.stepbox.scrollline-active .stepitemimg img{ filter: grayscale(0) brightness(1); }
.stepbox h5{
    transition: all 0.35s ease-in-out;
}
.choosenetwork::before{
    content: '';
    background: var(--grey);
    height: 120%;
    width: 25%;
    left: 0;
    position: absolute;
    top: -10%;
    border-radius: var(--bs-border-radius-xl);
    z-index: -1;
    left: -5%;
}
.icon3{
    height: 4rem;
    width: 4rem;
}

.swiper-container {
  position: relative;
  height: 20rem;
  overflow: hidden;
}

.swiper-slide {
  transition: all 200ms linear;
  transform: scale(0.7);
  opacity: .5;
}
.swiper-slide.swiper-slide-active {
  transform: scale(1);
  opacity: 1;
}
.serviceviewbox, .serviceviewbox .icon2{
    transition: .5s all ease;
}
.serviceviewbox:hover{
    box-shadow: 0 15px 46.2px 0 #f7efef;
}
.serviceviewbox .icon2{
    box-shadow: 0 0 0 6px #FAFAFA;
    transform: scale(1);
}
.serviceviewbox:hover .icon2{
    --bg-opacity: .5;
    box-shadow: 0 0 0 9px rgba(var(--bs-peach-rgb), var(--bg-opacity));
    transform: scale(1.1);
}
/*********** Service View Pgae End ***********/

/*********** Blog page Start ***********/
.innerpagehero-area::before, .innerpagehero-area::after{
    content: '';
    height: 100%;
    width: 25%;
    background: url(../images/wire-shape.png) no-repeat;
    position: absolute;
    z-index: 1;
    opacity: .15;
}
.innerpagehero-area::after{
    right: 0;
    transform: scaleX(-1);
}
.owlshape3::before{
    filter: blur(163.39999389648438px);
    z-index: 1;
    width: 20%;
    height: 100%;
    transform: translate(-50%, 0);
}


.blogtabs button { background: var(--bs-white); padding: .6rem 1rem; border: solid 1px #e8e8e8; }
.blogtabs button.active{ background: var(--peach); color: var(--bs-white); border-color: solid 1px var(--peach); }
.blogtabs button:hover{ border: solid 1px var(--peach); }

.blogdetailmain{
    max-height: 30rem;
}
.breadcrumb-item+.breadcrumb-item::before{
    color: inherit !important;
}
.blogthumnail{
    width: 30%;
    height: 4rem;
}
.blogviewtext{
  width: 70%;
}
.blog-detail-content p{ color: var(--bs-secondary-color);}
.blog-detail-content h2 {
    font-size: 1.6rem;
    margin-bottom: 1rem;
    margin-top: .5rem;
}
.blog-detail-content h3{
  font-size: 1.1rem;
}
.blog-detail-content ul{
    padding-left: 1rem;
    margin-bottom: 1.2rem;
}
.blog-detail-content ul li{ margin-bottom: .4rem; }
.blog-detail-content ul li p{ margin: 0;}
.stickysidebar{
  top:7rem;
}
.blogbox .blogtext{
  height: 4rem;
}
/*********** Blog page End ***********/

/*********** Gallery Page Start ***********/

.playicon a{
    display: inline-block;
    width: 6.5rem;
    height: 6.5rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3.5rem;
    color: var(--bs-black);
    background-color: var(--bs-white);
    transition: 0.5s;
}
.playicon a{
    -webkit-animation: ripple-white 1s linear infinite;
    animation: ripple-white 1s linear infinite;
}
.playicon a:hover{ color: var(--peach);}
/* animation ripple  */
@-webkit-keyframes ripple-white {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3),
      0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3),
      0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3);
  }
  100% {
    -webkit-box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3),
      0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3),
      0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
  }
}


.effect {
    /*max-height: 240px;
    max-width: 350px;*/
    cursor: pointer;
    margin: auto;
}
.effect img {
	transition: all .3s ease-in-out;
	transform: translate3d(0, 0, 0) scale(1, 1);
	-webkit-transition: all .3s ease-in-out;
	-webkit-transform: translate3d(0, 0, 0) scale(1, 1)
}

.effect:hover img {
	opacity: .6;
	transform: translate3d(-20px, 0, 0) scale(1.1, 1.1);
	-webkit-transform: translate3d(-20px, 0, 0) scale(1.1, 1.1)
}
.effect .tab-text {
    padding: 2em;
    color: #fff;
    font-size: 1.25rem;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.effect .tab-text:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: calc(100% - 0px);
	height: inherit;
	border-top: 10px solid transparent;
	border-left: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-right: 10px solid transparent;
	transition: all .6s ease-in-out;
	-webkit-transition: all .6s ease-in-out
}
.effect:hover .tab-text:after {
	opacity: 1;
	top: 0;
	left: 0;
	border-top: 192px solid rgba(0, 0, 0, .5);
    border-left: 192px solid rgba(0, 0, 0, .5);
    border-bottom: 192px solid rgba(0, 0, 0, .5);
    border-right: 192px solid rgba(0, 0, 0, .5);
}
.effect .tab-text h2 {
	transform: scale3d(.9, .9, 1);
	transition: all .5s ease-in-out;
	-webkit-transform: scale3d(.9, .9, 1);
	-webkit-transition: all .5s ease-in-out;
	z-index: 2;
    opacity: 0;
	position: relative;
}

.effect:hover h2 {
    opacity: 1;
	transform: scale3d(1, 1, 1);
	transition: all .5s ease-in-out;
	-webkit-transform: scale3d(1, 1, 1);
	-webkit-transition: all .5s ease-in-out
}
.effect .zoomicon {
	font-size: .8rem;
	padding: 10px 5px;
	transform: scale3d(.8, .8, 1);
	-webkit-transform: scale3d(.8, .8, 1);
	opacity: 0;
	-webkit-transition: all .35s;
	transition: all .35s;
	z-index: 2;
	position: relative;
}

.effect:hover .zoomicon {
	transform: scale3d(1, 1, 1);
	-webkit-transform: scale3d(1, 1, 1);
	opacity: 1
}

/*********** Gallery Page End ***********/

/*********** Career Page End ***********/
.contactform input, .contactform select{ height: 2.5rem; }
.contactform input, .contactform textarea, .contactform select{ 
    font-size: 13px;
}
.contactform input::placeholder, .contactform textarea::placeholder{
    color: var(--bs-gray-500);
    font-weight: 300;
}
.contactform select.form-control{
    padding: .375rem 2rem .375rem .75rem;
    width:6rem;
}

/*********** Career Page End ***********/

/* About us page Start */

/* new css */

/* Text Gradient */
.text-gradient {
  background: linear-gradient(135deg, #ff663d 0%, #ff8c6b 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Button Styles */
.btn-primary {
  background: linear-gradient(135deg, #ff663d 0%, #ff8c6b 100%);
  border: none;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(255, 102, 61, 0.3);
}

.btn-outline-light {
  border: 2px solid #fff;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.btn-outline-light:hover {
  background-color: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

/* Line Animations */
.animated-line {
  animation: glowPulse 2s ease-in-out infinite;
  opacity: 0.7;
}

.line-2 {
  animation-delay: 1s;
}

@keyframes glowPulse {
  0% {
    filter: drop-shadow(2px #ff663d);
    opacity: 0.4;
  }
  50% {
    filter: drop-shadow(8px #ff663d) drop-shadow(0 0 12px #ff663d);
    opacity: 1;
  }
  100% {
    filter: drop-shadow(2px #ff663d);
    opacity: 0.4;
  }
}

/* Text Animation */
.btn-group {
  animation: fadeInUp 1s ease-out 0.6s both;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.year-carousel {
  display: flex;
  justify-content: center;
  align-items: center;
}

.year-list-wrapper,
#yearListContainer {
  height: 200px; /* fixed height to show some years */
  overflow-y: auto !important; /* enable vertical scroll */
  scroll-behavior: smooth; /* smooth scroll for buttons */

  scrollbar-width: none;
}

#prevYear,
#nextYear {
  border-color: rgb(161, 161, 161) !important;
  color: rgb(161, 161, 161) !important;
  background-color: transparent !important;
  padding: 0.25rem 0.35rem !important;
  font-size: 0.85rem !important;
  width: 50px !important;
  height: 50px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

#prevYear:hover,
#prevYear:focus,
#nextYear:hover,
#nextYear:focus {
  border-color: darkgray !important;
  color: darkgray !important;
  background-color: transparent !important;
}

.year-item {
  font-size: 2.2rem;
  padding: 15px 0;
  width: 100%;
  text-align: center;
  color: #bdbdbd !important;
  cursor: pointer;
  transition: all 0.25s ease;
}

.year-item.active {
  color: #000 !important;
  font-weight: 700;
  font-size: 2.6rem;
}

.box {
  background: radial-gradient(circle at bottom left, var(--peach) -90%, var(--peachdark) 70%);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/*=== Slider Container ===*/

.contentbtn {
  padding: 0.8rem 1.5rem;
  background-color: #7f4434;
  border: 1px solid #996253;
  border-radius: var(--bs-border-radius-pill);
  text-align: center;

  text-decoration: none;
  color: rgb(224, 224, 224);
  box-sizing: border-box;
}
.container-custom {
  max-width: 1200px;
  margin: 0 auto;
}

.header-section h1 {
  font-weight: 700;
  margin-bottom: 20px;
  font-size: 2.5rem;
}

.content-section {
  padding: 40px 0;
}

.circle-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.main-circle {
    width: 15rem;
    height: 15rem;
  border-radius: 50%;
  background-color: rgba(var(--bs-peach-rgb), var(--bs-bg-opacity));
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 40px;
  padding: .5rem;
  --bs-bg-opacity: .15;
}

.small-circles {
  display: flex;
  flex-shrink: 0;
}

.small-circle {
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: black;
  font-weight: bold;
  border: 4px solid #ff663d;
  background-color: white;
  box-shadow: 0 4px 20px rgba(78, 76, 75, 0.3);
  text-align: center;
}

.text-content p {
  margin: 0; /* remove extra spacing */
}

.section-title {
  font-weight: 700;
  margin-bottom: 20px;
}

.text-content {
  padding: 20px 40px;
}

.section-title {
  font-weight: 700;
  margin-bottom: 20px;
}

.slider {
  width: 100%;
  overflow: hidden;
  padding: 20px 0;
}

.slider__container {
  display: flex;
  gap: 1rem;
  transition: all 0.3s ease;
  height: 25rem; /* fix height of the slider */
}

.slider__item {
  flex: 0 0 20%; /* initial width */
  height: 100%; /* fix height */
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
  filter: grayscale(100%);
}

.slider__item img {
  width: 100%;
  height: 100%; /* make image fill slide */
  object-fit: cover; /* prevent image stretching */
  display: block;
  border-radius: 10px;
  transition: all 0.3s ease;
}

.caption {
  position: absolute;
  bottom: 10px;
  left: 10px;
  right: 10px;
  text-align: left;
  color: #ffffff;
  text-shadow: 0 0 5px black;
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Hover: expand hovered slide in width only, color it, show caption */
.slider__item:hover {
  flex: 0 0 25%; /* expand width */
  filter: grayscale(0%) !important; /* colorful */
}

.slider__item:hover .caption {
  opacity: 4; /* show caption */
}

/* Shrink all other slides in width only, keep height */
.slider__container:hover .slider__item:not(:hover) {
  flex: 0 0 20%; /* shrink width */
  filter: grayscale(100%); /* keep grayscale */
}
.homebannerlogo2{
    width: 4rem;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}
.animtedlines2 svg {
    width: 100%;
    margin: 2rem auto 2rem;
    background-size: cover;
}

/* Contact us start */
.contactform input, .contactform select{ height: 2.5rem; }
.contactform input, .contactform textarea, .contactform select{ 
    font-size: 13px;
    resize: none;
}
.contactform input::placeholder, .contactform textarea::placeholder{
    --opacity: .3;
    color: rgba(var(--bs-black-rgb), var(--opacity)) !important;
}
.contactform select.form-control{
    padding: .375rem 2rem .375rem .75rem;
    width:6rem;
}
.mt-25{margin-top: 2.5rem;}
ul.contactsociallist li a{
    --opacity: .10;
    background: rgba(var(--bs-white-rgb), var(--opacity));
    color: var(--bs-white);
}
.contactbox::before, .contactbox::after{
    content: '';
    position: absolute;
    width: 40%;
    height: 70%;
    transform: rotate(-30deg);
    border-radius: 594.662px;
    --opacity: 0.50;
    background: rgba(var(--bs-peach-rgb), var(--opacity));
    filter: blur(184.85000610351562px);
    z-index: -1;
    top: -15%;
    left: 0%;
}
.contactbox::after{
    width: 120.699px;
    height: 309.724px;
    border-radius: 309.724px;
    top: auto;
    left: auto;
    bottom: -10%;
    right: 0;
}
.rotate-flip{
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}
.menuproduct{ height: 12rem; }
.menuproduct::before{
    content: "";
    position: absolute;
    width: 100%;
    aspect-ratio: 1;
    left: 0;
    top: 0;
    transform: translateY(-50%);
    z-index: 1;
    border-radius: 100%;
    background: rgba(var(--bs-peach-rgb), var(--bg-opacity));
    --bg-opacity: .7;
    filter: blur(50px);
}
.menuproduct img {
    filter: grayscale(1);
}
.megamenuproduct .megamenuproductsub{
    flex-basis: 20%;
}
.megamenuproduct .megamenuservicesub{
    flex-basis: 100%;
}
.icon4{
    height: 7rem;
    width: 7rem;
}
.bg-opacity-5 {
    --bs-bg-opacity: 0.05;
}
.servicebox .bg-peach{
  --bs-bg-opacity: 1;
}
.lh-md{ line-height: 1.4rem; }
.animtedlines3 svg{
  margin: -19.5rem auto 0rem;
}
.statics-text h6{
  color: var(--bs-black);
}
.statics-text ul{ padding-left: 2rem; margin: 1rem 0; }
.statics-text ul li{
  color: var(--bs-black);
  margin-bottom: .5rem;
}
.statics-text ul li strong{
  font-weight: 500;
  color: rgba(0, 0, 0, 1) !important;
}
.statics-text ul li{
  color: rgba(0, 0, 0, .7) !important;
}
.letter-spacing{
  letter-spacing: -3px;
}