@import url("./root.css");
body {
  font-family: "Archivo", sans-serif;
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6, span, ul li, ol li,input {
  font-family: "Archivo", sans-serif;
}
.contain-width{
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 15px;
}

/* .common-btn, */
.common-btn-two,
.contact-us-btn {
    border-radius:15px !important;
    gap: 15px !important;
    width: fit-content;
    font-size: 20px;
    font-weight: 500;
    display: flex;
    align-items:center;
    padding:15px 20px !important;
    position: relative;
    letter-spacing: .03em
}
/* .common-btn, */
.linear-border,
.rippleAnim {
    position: relative
}
a.common-btn:focus,
a.common-btn:focus i,
a.common-btn:focus-within,
a.common-btn:focus-within i,
a.common-btn:hover,
a.common-btn:hover i {
    color: white !important
}
@keyframes ripple {
    0% {
        opacity: 1;
        transform: scale3d(.5, .75, 1)
    }
    100% {
        opacity: 0;
        transform: scale3d(1.5, 1.5, 1)
    }
}
@keyframes glowingeffect {
    0%,
    100% {
        box-shadow: 0 0 0 rgb(251, 75, 98, .6)
    }
    40%,
    60% {
        box-shadow: 0 0 20px rgb(251, 75, 98, .6)
    }
}


a {
    text-decoration: none !important;
}
.linear-text{
    background: linear-gradient(270.32deg, #DF2771 -0.11%, #FD4E32 97.52%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

h2 span,
h3 span {
   color: #E2462D;

}
li,
ul {
    list-style: none
}
.flex-1,.flex-2,.flex-3,.flex-4,.flex-5,.flex-6,.flex-7{
  display: flex;
}
.flex-1 {
    justify-content: center;
    flex-wrap: wrap
}
.flex-3,
.flex-4 {
    align-items: center
}
.flex-3 {
    justify-content: space-around
}
.flex-4 {
    justify-content: space-between
}
.flex-5 {
    align-items: center;
    justify-content: center
}
.flex-6 {
    justify-content: center
}
.flex-7 {
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center
}

h2,
h3.title-text {
    margin-top: 0;
 line-height: 1.2;
    font-size: 40px;
    margin-bottom: 20px;
    font-weight:500;
}
h4,h5 {
    font-size: 30px !important
}
h6 {
    font-size: 20px !important
}
p {
    font-size: 18px ;
    line-height: 1.5
}
.p-mt{
  margin-top: 15px;
}
p.gray-text{
  color: #666666;
}
p.dark-gray-text{
  color: #A39E9D;
}
.section-head{
  margin: 0 auto 40px;
  text-align: center;
}
.head-text{
  margin-bottom: 40px;
}
.section-head h2{
  margin: 0 auto 20px;
}

.banner-part{
  color: white;
}
.banner-left h1 span {
    color:#DA432B;
}
.linear-text{
   background: linear-gradient(91.42deg, #E2462D 1.91%, #631E13 23.65%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.section-py{
  padding: 80px 0;
}
.section-pt{
  padding-top: 70px;
}
.section-pb{
padding-bottom: 70px;
}
.section-mt{
  margin-top: 70px;
}

.bg-white{
  background: #fff;
}
/* sevices card */
.sevices-card{
  background: #101010;
  padding: clamp(15px,5vw,20px);
  border-radius: 10px;
  height: 90%;
  margin-bottom: 20px;
}
.sevices-card h3{
  font-size: 24px !important;
  margin-bottom: 15px !important;
  color: white;
  font-weight: 600;
  margin-top: 0 !important;
}
.sevices-card p{
  color: #FFFFFF99 !important;
}
.next-gen-text{
  font-size:clamp(28px,5vw,35px) !important;
  margin-bottom:clamp(28px,5vw,35px) !important;
  font-weight: 600;
}

    /* Accordion Styling */
    section.faq-section .accordion-item {
      border: none;
      margin-bottom: 12px;
      border-radius: 6px;
      overflow: hidden;
       background: #F4F4F4;
    }
   section.faq-section .accordion-button {
      background: #F4F4F4;
      border-radius: 6px !important;
      box-shadow: none !important;
      font-weight: 500;
      color: #000;
      font-size: 18px !important;
    }
   section.faq-section .accordion-button:focus {
      box-shadow: none;
    }
section.faq-section .accordion-button::after {
  content: "+";
  font-size: 25px;
  font-weight: normal;
  color: #007bff;
  background-image: none !important;
  transform: rotate(0deg);
  transition: transform 0.3s ease;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
section.faq-section .accordion-header{
  margin-bottom:  0px !important;
}
section.faq-section .accordion-button:not(.collapsed)::after {
  transform: rotate(135deg); 
}
section.faq-section  .accordion-body {
    padding: 1rem 1.25rem;
    font-size: 16px;
}

.awards-section-custom {
      text-align: center;
    }
    .awards-section-custom h2 {
      margin-bottom: 40px;
    }

    .award-badge-custom img {
      max-width: 150px;
      margin: 15px auto;
      display: block;
      transition: transform 0.3s;
    }
    .award-badge-custom img:hover {
      transform: scale(1.1);
    }

    /* Contact Section */
    .contact-section-custom {
      background: url("../image/cta-bg.webp") no-repeat  ;
      background-position: left;
      background-size: cover;
      color: #fff;
    }
    .contact-section-custom h3 {
      font-weight: bold;
    }
    .contact-section-custom p {
      margin: 10px 0 40px;
      color:#A39E9D;

    }

    .contact-image-custom img {
      max-width: 100%;
      border-radius: 12px;
    }
body::-webkit-scrollbar {
    width: 6px;
    border-radius:8px;
}
body::-webkit-scrollbar-thumb {
    background: linear-gradient(270.32deg, #6d2115 -.11%, #fd4e32 97.52%)
}
body::-webkit-scrollbar-track {
    background: #888
}
.banner-btn {
    margin-top: 40px
}
.common-banner-btn ,.common-btn {
  /* background: #000000; */
  color: white !important;
  border-radius: 10px;
  padding: 12px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: fit-content;
  font-size: 16px;
  font-weight: 500;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease;
}
.common-banner-btn{
  background: #000 !important;
}
.common-btn {
  background: #E2462D;
}

/* shiny light sweep */
.common-banner-btn::after,.common-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.6),
    transparent
  );
  transform: skewX(-25deg);
  transition: left 1.5s ease; /* slower shine */
}

/* hover state */
.common-banner-btn:hover,.common-btn:hover  {
  transform: scale(1.05);
}

.common-banner-btn:hover::after,.common-btn:hover::after  {
  left: 125%;
}

/* features-section */
 .features-section .feature-card {
      background: #101010;
      border-radius: 10px;
      padding: 25px;
      margin-bottom: 30px;
      border: 1px solid #FFFFFF4A;
    }
    .custom-label{
      display: flex;
      gap: 10px;
      color: #E2462D;
      align-items: center;
      margin-bottom: 20px;
    }
    .feature-card h3 {
      font-size: 24px !important;
      font-weight: 600;
      margin-bottom: 15px !important;
      margin-top: 0 !important;
    }
    .feature-card p {
      font-size:18px;
      color: #FFFFFF99;
    }
    .feature-tags {
      margin-top: 15px;
    }
    .feature-tags span {
      display: inline-block;
      background: #262626;
      color: #fff;
      padding: 6px 14px;
      border-radius: 20px;
      margin: 5px 5px 0 0;
      font-size: 16px;
      font-weight: 300;
    }
    /* devleopment process */
    .development-process-left, .features-label{
          position: sticky;
      top: 100px;
    }
    .development-process-left .process-img{
      margin-bottom: 20px ;
      margin-top: 40px;
    } 
    .process-card{
      background: #F9F9F9;
      border: 1px solid #FFFFFF4A;
      margin-bottom: 20px;
      padding: 20px ;
      border-radius: 12px;

    }
       .process-card p{
        font-size: 16px;
        color: #00000099;
       }
       .process-card h3{
        font-size: 24px !important;
        margin-bottom: 10px !important;
       }

       /* blockchain network */
.blockchain-network{
    background: url("../image/blockchain-network-bg.webp") no-repeat;
    background-size: cover;
    background-position: left;
    
}

       /* project card */
     .project-card {
      background: #F7F7F7;
      border-radius: 10px;
      transition: transform 0.3s ease;
      padding: 20px;
      margin-bottom: 20px !important;
      height: 96%;
      border: none;
    }
      .project-card:hover {
      transform: translateY(-5px);
    }
    .project-content h3 {
      font-size: 24px !important;
      margin-bottom: 12px;
    }

       .best-works-content{
        margin-bottom: 40px ;
       }
       .sevices-card h3 a {
    color: #fff;
}
.project-content h3 a,.step-card  h3 a{
  color: #000;
}
.inner-link{
  color:#fff
}
.inner-link:hover{
  color: #E2462D !important
}
