/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

 theme blue color: #144cb1
 theme purple color: #a766d9

*/
.logo-dark img,
.logo-default img {
    max-height: 35px;
}

.heading-text.heading-section h2 {
    text-transform: uppercase;
}

.max-height-150 {
    max-height: 150px;
}

.icon-box.process-1 {
    border: 1px solid #e0e0e0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    padding: 30px 10px;
    border-radius: 4px;
}

.icon-box.process-1:hover {
    cursor: pointer;
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
    transform: translateY(-6px);
}

span.lead {
    position: relative;
}

.bg-overlay[data-style="3"] {
    background: -webkit-linear-gradient(310deg, var(--bs-blue) 0%, var(--bs-purple) 100%);
    background: linear-gradient(140deg, var(--bs-blue) 0%, var(--bs-purple) 100%);
    opacity: .9;
}

.heading-text.text-light.heading-section h2:before {
    background-color: #fff;
}

button.btn.btn-primary,
.btn:not(.close):not(.mfp-close).btn-primary,
.btn:not(.close):not(.mfp-close),
a.btn:not([href]):not([tabindex]).btn-primary {
    background: -webkit-linear-gradient(310deg, var(--bs-blue) 0%, var(--bs-purple) 100%);
    background: linear-gradient(310deg, var(--bs-blue) 0%, var(--bs-purple) 100%);
    background-size: 200% 200%;
    background-position: left center;
    border: none;
    transition: transform all 0.3s ease;
}

button.btn.btn-primary:hover,
.btn:not(.close):not(.mfp-close).btn-primary:hover,
a.btn:not([href]):not([tabindex]).btn-primary:hover {

    background-position: right center;
    transform: scale(1.05);
}

.heading-text.heading-section.text-white h2:before {
    background-color: #fff;
}

.btn-light.btn-outline {
    background: transparent !important;
}

.icon-boxx a {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
}

.icon-boxx a:hover {
    color: var(--bs-blue) !important;
}

a {
    color: var(--bs-blue);
}

.list-icon li {
    margin-bottom: 0;
}

.grid li a img {
    max-height: 35px;
    width: auto;
    max-width: 100%;
}
.client-icons li {
    text-align: center;
}
.client-icons .icon-box.center {
    margin-bottom: 0;
}
.client-icons .icon-box.center h3 {
    margin: auto;
}

.client-icons .icon-box .icon i {
    line-height: 40px;
}

.client-icons .icon-box .icon {
    height: 40px;
    width: 40px;
}

.max-w-200 {
    max-width: 200px;
}

.timeline .timeline-item .timeline-icon {
    background-color: var(--bs-blue);
}

.text-left {
    text-align: left !important;
}