@import url(custom.css);
.service-card-main-wrapper{
    display: flex;
    flex-direction: column;
    gap:var(--gap-md);
    margin-top: 60px;
}
.services-card-wrapper{
    display: flex;
    flex-direction: row;
    gap:var(--gap-md);
}
.service-card{
    display: flex;
padding: 40px;
width:600px;
flex-direction: column;
align-items: flex-start;
gap: 20px;
border-radius: 20px;
border: 1px solid var(--Linear-Border, #FFF);
background: var(--Bg-card, #FFF);

/* Main Card */
box-shadow: 0px 14px 74px 0px rgba(0, 0, 0, 0.10);
}
.service-card-text{
    display: flex;
    flex-direction: column;
    gap: var(--gap-xs);
}

.service-card-text h5{
    margin: 0px;
    width: 207px;
    color: var(--Text-Black, #000);
font-family: var(--font-family-primary);
font-size: var(--Sizes-h5, 25px);
font-style: normal;
font-weight: 600;
line-height: 32px; /* 128% */
}
.service-card-text p{
    margin: 0px;
    color: var(--gray-900);

/* 1440/Regullar/rg */
font-family: var(--font-family-primary);
font-size: var(--Sizes-rg, 16px);
font-style: normal;
font-weight: var(--Weights-medium, 500);
line-height: 24px; /* 150% */
}

.service-card-btn a{
display: flex;
flex-direction: row;
align-items: center;
gap: var(--gap-xs);
text-decoration: none;
transition: color 0.3s ease;
}
.service-card-btn a:hover{
text-decoration: underline;
}
.service-card-btn a span{
color: var(--Bg-bg---footer, #0D2D44);
text-align: center;
font-family: var(--font-family-primary);
font-size: var(--md);
font-style: normal;
font-weight: 500;
line-height: normal;
}
.services-choose-us{
    background: var(--primary-200);
    padding-top: 80px;
}
.service-choose-wrapper{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 80px;
    margin-top: 80px;
}
/*  */
.overlly{
    position: relative;
    width: 100%;
    height: 0px;
   

}
.overlly::before{
    position: absolute;
    content: "";
    width: 100%;
    background: var(--primary-200);
    filter: blur(35px);
    height: 200px;
    top: -100px;
   

}

.service-point-main-wrapper{
    display: flex;
    flex-direction: column;
    gap:var(--gap-heading-content);
    
}
.service-margin{
    margin-top: -450px !important;
    position: relative;
}

.service-choose-heading{
    display: flex;
    flex-direction: column;
    gap: var(--gap-xs);
}
.heading-badge{
    display: flex;
padding: 8px 16px;
align-items: center;
gap: 7px;
width: 170px;
border-radius: 100px;
border: 2px solid rgb(255, 255, 255);
}
.heading-badge span{
color: var(--Text-Black, #fff);
text-align: center;

/* 1440/Regullar/xs */
font-family: var(--font-family-primary);
font-size: var(--Sizes-xxs, 14px);
font-style: normal;
font-weight: var(--Weights-semibold, 550);
line-height: normal;
}
.service-choose-heading h3{
    color: var(--Text-Black, #fff);
margin: 0px;
text-shadow: 1px 1px 2px #00000021;
/* 1440/Title/H3 */
font-family: var(--font-family-secondry-53);
font-size: var(--Sizes-h3, 50px);
font-style: normal;
font-weight: 500;
line-height: var(--Line-Height-h3, 55px); /* 110% */
}
.service-point{
  display: flex;
padding-bottom: 26px;
align-items: center;
gap: 17px;
align-self: stretch;
}
.service-point-icon{
    display: flex;
width: 80px;
height: 80px;
padding: 25px;
justify-content: center;
align-items: center;
gap: 10px;
aspect-ratio: 1/1;
border-radius: 10px;
background: var(--Text-white, #FFF);
}
.service-point-text{
    display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8.889px;
flex: 1 0 0;
}
.service-point-text h6{
    margin: 0px;
    color: var(--Text-Black, #fff);
font-family: var(--font-family-primary);
font-size: 22px;
font-style: normal;
font-weight: 600;
line-height: 24.889px; /* 113.131% */
}
.service-point-text p{
    margin: 0px;
    color: var(--Text-secondary, #fff);
font-family: var(--font-family-primary);
font-size: 16px;
font-style: normal;
font-weight: var(--Weights-medium, 500);
line-height: 21.333px; /* 133.333% */
}



/* service details page  */
.service-detail-col{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 50px;
}
.service-detail-col-content{
    display: flex;
    flex-direction: column;
    gap: var(--gap-md);
}
.service-detail-col-content h5{
    margin: 0px;
    color: var(--Text-Black, #000);

/* 1440/Title/H4 */
font-family: var(--font-family-primary);
font-size: var(--Sizes-h4, 35px);
font-style: normal;
font-weight: var(--Weights-bold, 600);
line-height: var(--Line-Height-h4, 40px); /* 114.286% */
}
.service-detail-col-content p{
    color: var(--gray-900);

/* 1440/Regullar/md */
font-family: var(--font-family-primary);
font-size: var(--Sizes-md, 18px);
font-style: normal;
font-weight: var(--Weights-bold, 600);
line-height: var(--Line-Height-md, 28px); /* 155.556% */
}
.service-detail-points{
    display: flex;
    flex-direction: column;
    gap: var(--gap-xs);
}
.points{
    display: flex;
    flex-direction:row;
    align-items: center;
    gap: var(--gap-xxs);
}
.points span{
    color: var(--Text-Black, #000);
font-family: var(--font-family-primary);
font-size: 20px;
font-style: normal;
font-weight: var(--Weights-medium, 500);
line-height: 32px; /* 145.455% */
}

/* responsive */
@media (max-width: 1025px){
.service-margin{
    margin-top: 0px;
}
.service-choose-heading h3{
    font-size: 40px;
}
.service-choose-wrapper{
    flex-direction: column;
}
}

@media (max-width: 965px){
.service-choose-wrapper{
    flex-direction: column;
    margin-top: 60px;
}
.service-detail-col{
    flex-direction: column;
}
}
@media (max-width: 600px){
.services-card-wrapper{
    flex-direction: column;
}
.service-card{
    width: 100%;
}
.service-detailcol-img img{
    width: 100%;
}
.service-detail-col-content h5{
    font-size: 25px;
    line-height: 35px;
}
.points span{
    font-size: 16px;
    line-height: 25px;
}
.service-choose-wrapper{
    margin-top: 40px;
    gap: 40px;
}
.service-img{
    width: 100%;
}
.service-img img{
    width: 100%;
    max-width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 20px;
}
}
@media (max-width: 480px){
    .service-img{
        display: none;
    }
    .service-point-icon{
        width: 65px;
        height: 65px;
        padding: 15px;
    }
    .service-choose-wrapper{
        margin-top: 30px;
    }
    .service-point{
        align-items: start;
    }
.service-card-main-wrapper
    {
        margin-top: 0px !important;
    }
    .service-margin
    {
        margin-top: -100px !important; 
        gap:10px !important;
    }
    .service-img
    {
        width: 100% !important;
        display: block !important;
    }
    .service-img img
    {
        width: 100% !important;
        height: 300px;
        object-fit: cover !important;
        border-radius: 20px !important;
    }
}
@media (max-width: 480px){
    .service-choose-heading h3{
        font-size: 30px;
        line-height: 40px;
    }

}

@media (max-width: 430px) {
    .service-choose-wrapper{
        
        margin-top: 20px;
        gap: 30px;
    }
  .service-card
    {
        padding: 20px;
    }
    .service-card-text h5
    {
        font-size: 22px;
    }
    .service-card-text p
    {
        font-size: 16px;
    }
    .service-margin
    {
        margin-top: -120px;
    }
    .service-card-btn a span
    {
        font-size: 16px;
    }
    .service-point-text h6
    {
        font-size: 22px;
    }
   .footer-container {
        padding: 50px 10px 20px 10px;
    }
    .custom-secondry-btn button span
    {
        font-size: 18px;
    }
    .contact-footer-number {
        padding: 14px 30px !important;
        width: 100% !important;
        min-width: 100%;
    }
    
    .footer-inner-col span
    {
        width: 100%;
        font-size: 16px;
    }
  .service-img img
  {
    height: 250px;
  }
  .service-point-text p
  {
    font-size: 14px;
  }
  .service-detailcol-img img
  {
    object-fit: cover;
    border-radius: 20px;
  }
}