:root {
    --navy: #0A1F4D;
    --navy-2: #0F2A63;
    --navy-3: #071841;
    --primary: #1257E0;
    --primary-rgb: 18,87,224;
    --hover: #0D45B8;
    --sky: #12A8E8;
    --accent: #3BC9F2;
    --accent-d: #1AA9D6;
    --amber: var(--accent);
    --amber-d: var(--accent-d);
    --ink: #0A1F4D;
    --body-color: #55637A;
    --soft: #F4F7FB;
    --tint: #EEF4FF;
    --tint-2: #EEF4FF;
    --line: #E1E7F0;
    --sbec-line: #E1E7F0;
    --c-ocm: #1257E0;
    --c-csat: #1257E0;
    --c-tee: #1257E0;
    --c-xmatrix: #1257E0;
    --c-opex: #1257E0;
    --c-system: #1257E0;
    --shadow-sm: 0 1px 2px rgba(10,31,77,.05),0 12px 28px -18px rgba(10,31,77,.28);
    --shadow-lg: 0 2px 4px rgba(10,31,77,.04),0 44px 80px -48px rgba(10,31,77,.5);
    --r-lg: 22px;
    --r-md: 14px;
}

body {
    color: var(--body-color)
}

h1,h2,h3,h4,h5,h6 {
    letter-spacing: -.015em
}

.bg-light {
    background: var(--soft)!important
}

a {
    transition: color .25s
}

:focus-visible {
    outline: 3px solid rgba(59,201,242,.65);
    outline-offset: 3px;
    border-radius: 6px
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    box-shadow: 0 14px 28px -16px rgba(18,87,224,.8)
}

.btn-primary:hover {
    box-shadow: 0 18px 32px -14px rgba(18,87,224,.85)
}

.btn-primary.sbec-btn-amber,.sbec-btn-amber {
    background: var(--accent)!important;
    border-color: var(--accent)!important;
    color: var(--navy)!important;
    box-shadow: 0 14px 28px -16px rgba(59,201,242,.9)
}

.btn-primary.sbec-btn-amber:hover {
    box-shadow: 0 18px 32px -14px rgba(59,201,242,.9)
}

.btn-outline {
    border-color: var(--primary);
    color: var(--primary)
}

.btn-outline:hover {
    background: var(--primary);
    color: #fff
}

section.promo-sec {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--navy) center/cover;
    color: #fff
}

section.promo-sec .jarallax-img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

section.promo-sec .parallax-overly {
    z-index: -1;
    opacity: 1!important;
    mix-blend-mode: normal!important;
    filter: none;
    background: radial-gradient(520px 320px at 90% 0%,rgba(59,201,242,.28),transparent 70%), linear-gradient(100deg,rgba(7,24,65,.95) 0%,rgba(10,31,77,.82) 55%,rgba(10,31,77,.55) 100%)!important
}

section.promo-sec::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px) 0 0/56px 56px;
    -webkit-mask-image: linear-gradient(180deg,#000 35%,transparent);
    mask-image: linear-gradient(180deg,#000 35%,transparent)
}

section.promo-sec .promo-wrap {
    padding: 92px 0 96px;
    text-align: left
}

section.promo-sec h1 {
    font-size: clamp(36px,4.8vw,62px);
    line-height: 1.08;
    text-align: left!important;
    color: #fff!important;
    margin: 0;
    text-wrap: balance
}

.promo-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--accent);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: .04em;
    margin-bottom: 18px
}

.promo-kicker::before {
    content: "";
    width: 32px;
    height: 2px;
    background: var(--accent)
}

.promo-sub {
    margin: 18px 0 0;
    max-width: 620px;
    font-size: 19px;
    line-height: 1.6;
    color: rgba(255,255,255,.82)
}

section.promo-sec .breadcrumb-wrap {
    position: static!important;
    display: inline-block;
    margin-top: 30px;
    background: rgba(255,255,255,.08)!important;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px)
}

section.promo-sec ol.breadcrumb {
    padding: 9px 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

section.promo-sec ol.breadcrumb .breadcrumb-item {
    font-size: 14px;
    text-transform: none
}

section.promo-sec ol.breadcrumb .breadcrumb-item a {
    color: #fff
}

section.promo-sec ol.breadcrumb .breadcrumb-item a:hover {
    color: var(--accent)
}

section.promo-sec ol.breadcrumb .breadcrumb-item.active {
    color: var(--accent)
}

section.promo-sec ol.breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: rgba(255,255,255,.55);
    font-size: 12px;
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    content: "\f054";
    padding-right: 10px
}

.sbec-banner .container::after {
    background: linear-gradient(90deg,var(--accent),rgba(255,255,255,.12) 40%,transparent)
}

.service-details-sec {
    padding-top: 72px!important;
    background: #fff
}

.service-details-sec>.container>.row>h2 {
    font-size: clamp(30px,3.5vw,46px);
    line-height: 1.15;
    color: var(--ink);
    max-width: 880px;
    margin: 0
}

.service-details-sec .service-thumb {
    margin: 34px 0 56px;
    border-radius: var(--r-lg);
    overflow: hidden;
    position: relative;
    aspect-ratio: 21/8;
    box-shadow: var(--shadow-lg);
    transform: none!important
}

.service-details-sec .service-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,transparent 55%,rgba(10,31,77,.35));
    pointer-events: none
}

.service-details-sec .service-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;

    transform: none!important
}

@media (max-width: 767px) {
    .service-details-sec .service-thumb {
        aspect-ratio:4/3;
        margin-bottom: 36px
    }
}

.service-details-sec .serv-article h3 {
    font-size: 25px;
    line-height: 1.22;
    margin: 30px 0 20px;
    color: var(--ink);
    text-wrap: balance
}

.service-details-sec .serv-article h3:first-child {
    margin-top: 0
}

.service-details-sec .serv-article p {
    font-size: 17px;
    line-height: 1.85;
    margin: 0 0 20px;
    max-width: 70ch;
}

.service-details-sec .serv-article p.sbec-lead-p {
    font-size: 20px;
    line-height: 1.7;
    color: var(--ink);
    font-weight: 500
}

.service-details-sec .serv-article strong {
    color: #ffffff;
}

.service-details-sec .sbec-callout {
    margin: 30px 0 0;
    border-radius: 0 var(--r-md) var(--r-md) 0;
    max-width: 70ch
}

.sbec-fl {
    list-style: none;
    margin: 6px 0 30px;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px
}

.sbec-fl li {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px 24px 24px 82px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: #fff;
    transition: border-color .3s,box-shadow .3s
}

.sbec-fl li:hover {
    border-color: rgba(18,87,224,.45);
    box-shadow: var(--shadow-sm)
}

.sbec-fl li>i {
    position: absolute;
    left: 24px;
    top: 24px;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--tint);
    color: var(--primary);
    font-size: 15px
}

.sbec-fl b {
    font-family: var(--font-family-headings);
    font-size: 17px;
    line-height: 1.3;
    color: var(--ink);
    font-weight: 600
}

.sbec-fl span {
    font-size: 15px;
    line-height: 1.65
}

@media (max-width: 767px) {
    .sbec-fl {
        grid-template-columns:1fr
    }
}

.service-details-sec .serv-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 48px 0 0!important
}

.service-details-sec .serv-gallery img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm)
}

@media (max-width: 575px) {
    .service-details-sec .serv-gallery {
        grid-template-columns:1fr
    }

    .service-details-sec .serv-gallery img {
        height: 220px
    }
}

.service-details-sec .serv-tabs {
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    background: #fff;
    box-shadow: var(--shadow-sm)
}

.service-details-sec .serv-tabs .nav-tabs {
    display: flex!important;
    background: var(--soft);
    border-bottom: 1px solid var(--line)
}

.service-details-sec .serv-tabs .nav-tabs li {
    flex: 1 1 0;
    width: auto!important;
    display: block
}

.service-details-sec .serv-tabs .nav-tabs button {
    padding: 18px 12px;
    font-family: var(--font-family-headings);
    font-weight: 600;
    font-size: 15px;
    text-transform: none;
    color: var(--body-color);
    border: 0!important;
    border-bottom: 3px solid transparent!important;
    margin: 0;
    transition: color .25s,background .25s
}

.service-details-sec .serv-tabs .nav-tabs .nav-item .nav-link:hover {
    background: transparent;
    color: var(--primary)
}

.service-details-sec .serv-tabs .nav-tabs .nav-item .nav-link.active {
    background: #fff;
    color: var(--primary);
    border-bottom: 3px solid var(--primary)!important
}

.service-details-sec .serv-tabs .tab-content {
    padding: 34px 36px
}

.service-details-sec .serv-tabs .tab-content p {
    margin-bottom: 18px
}

.service-details-sec .serv-tabs .tab-content p:last-child {
    margin-bottom: 0
}

.service-details-sec .serv-tabs .tab-content h4 {
    font-size: 20px;
    color: var(--ink);
    margin: 0 0 14px
}

@media (max-width: 575px) {
    .service-details-sec .serv-tabs .tab-content {
        padding:24px 20px
    }

    .service-details-sec .serv-tabs .nav-tabs button {
        font-size: 13px;
        padding: 14px 6px
    }
}

.service-details-sec ul.ct-list {
    margin: 6px 0 0
}

.service-details-sec ul.ct-list li {
    position: relative;
    padding-left: 40px;
    font-size: 16px;
    line-height: 1.6;
    color: var(--ink);
    font-weight: 500;
    margin: 0 0 14px
}

.service-details-sec ul.ct-list li:last-child {
    margin-bottom: 0
}

.service-details-sec ul.ct-list li::before {
    content: "\f00c";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    background: var(--tint);
    color: var(--primary);
    position: absolute;
    left: 0;
    top: -1px;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px
}

.service-details-sec ul.ct-list.two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 28px
}

@media (max-width: 767px) {
    .service-details-sec ul.ct-list.two {
        grid-template-columns:1fr
    }
}

.sbec-quote {
    margin: 24px 0 0;
    padding: 6px 0 6px 22px;
    border-left: 3px solid var(--accent);
    font-size: 19px;
    line-height: 1.6;
    color: var(--ink);
    font-weight: 500
}

.sbec-steps-mini {
    list-style: none;
    counter-reset: s;
    margin: 0 0 24px;
    padding: 0
}

.sbec-steps-mini li {
    counter-increment: s;
    position: relative;
    padding: 0 0 18px 54px
}

.sbec-steps-mini li::before {
    content: counter(s);
    position: absolute;
    left: 0;
    top: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-family-headings);
    font-weight: 700;
    font-size: 14px
}

.sbec-steps-mini li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 40px;
    bottom: 2px;
    width: 2px;
    background: var(--line)
}

.sbec-steps-mini b {
    display: block;
    color: var(--ink);
    font-family: var(--font-family-headings);
    font-size: 16px
}

.service-details-sec .faq-accordion {
    margin-top: 8px!important
}

.service-details-sec .faq-accordion .accordion-item {
    border: 1px solid var(--line);
    border-radius: var(--r-md)!important;
    margin: 0 0 14px;
    padding: 0;
    background: #fff;
    overflow: hidden;
    transition: border-color .3s,box-shadow .3s
}

.service-details-sec .faq-accordion .accordion-item:has(.accordion-button:not(.collapsed)) {
    border-color: rgba(18,87,224,.4);
    box-shadow: var(--shadow-sm)
}

.service-details-sec .faq-accordion .accordion-item:not(:last-child) {
    padding-bottom: 0;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--line)
}

.service-details-sec .faq-accordion .accordion-button {
    font-size: 17px;
    padding: 20px 56px 20px 24px;
    color: var(--ink);
    border-radius: 0!important;
    background: transparent!important;
    position: relative
}

.service-details-sec .faq-accordion .accordion-button:not(.collapsed) {
    color: var(--primary)
}

.service-details-sec .faq-accordion .accordion-button::after {
    right: 22px;
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    content: "\f067";
    font-size: 13px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--tint);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center
}

.service-details-sec .faq-accordion .accordion-button:not(.collapsed)::after {
    content: "\f068";
    background: var(--primary);
    color: #fff
}

.service-details-sec .faq-accordion .accordion-body {
    padding: 0 56px 22px 24px
}

.service-details-sec .faq-accordion .accordion-body p {
    margin: 0!important;
    font-size: 16px;
    line-height: 1.75
}

.service-details-sec .col-lg-4 {
    align-self: stretch
}

@media (min-width: 992px) {
    .service-details-sec .sidebar {
        position:sticky;
        top: 112px
    }
}

.sidebar .widget {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 30px 28px;
    margin-bottom: 24px;
    box-shadow: var(--shadow-sm)
}

.sidebar .widget-title {
    position: relative;
    font-size: 20px;
    margin: 0 0 26px;
    padding-bottom: 16px;
    color: var(--ink)
}

.sidebar .widget-title::before {
    content: "";
    position: absolute;
    left: 0;
    right: auto;
    top: auto;
    bottom: 0;
    width: 36px;
    height: 3px;
    border-radius: 3px;
    background: var(--primary)
}

.sidebar .category-widget ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    text-align: left
}

.sidebar .category-widget ul li:last-child {
    border-bottom: 0
}

.sidebar .category-widget ul li:hover {
    background: transparent
}

.sidebar .category-widget ul li a {
    float: none;
    flex: 1;
    padding: 15px 0;
    font-family: var(--font-family-headings);
    font-weight: 600;
    font-size: 15px;
    line-height: 1.35;
    color: var(--ink)
}

.sidebar .category-widget ul li:hover a,.sidebar .category-widget ul li.active a {
    color: var(--primary)
}

.sidebar .category-widget ul li i {
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--tint);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: background .25s,color .25s,transform .25s
}

.sidebar .category-widget ul li:hover i,.sidebar .category-widget ul li.active i {
    background: var(--primary);
    color: #fff
}

.sidebar .contact-widget {
    background: linear-gradient(155deg,var(--navy-3) 0%,var(--navy-2) 60%,#12489F 100%);
    border-color: transparent;
    box-shadow: var(--shadow-lg);
    position: relative;
    overflow: hidden
}

.sidebar .contact-widget::after {
    content: "";
    position: absolute;
    right: -60px;
    top: -60px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(59,201,242,.35),transparent 70%)
}

.sidebar .contact-widget .widget-title {
    color: #fff
}

.sidebar .contact-widget .widget-title::before {
    background: var(--accent)
}

.sidebar .contact-widget ul {
    position: relative;
    z-index: 1
}

.sidebar .contact-widget ul li {
    align-items: flex-start;
    gap: 14px;
    color: rgba(255,255,255,.88);
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 18px
}

.sidebar .contact-widget ul li:last-child {
    margin-bottom: 0
}

.sidebar .contact-widget ul li i {
    flex: none;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: rgba(255,255,255,.1);
    color: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px
}

.sidebar .contact-widget ul li small {
    display: block;
    font-size: 12px;
    color: rgba(255,255,255,.6);
    margin-bottom: 2px
}

.sidebar .contact-widget ul li a {
    float: none;
    color: #fff;
    word-break: break-word
}

.sidebar .contact-widget ul li a:hover {
    color: var(--accent)
}

.sidebar .serv-widget .form-group {
    margin-bottom: 14px
}

.sidebar .serv-widget input,.sidebar .serv-widget textarea {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #FAFBFD;
    padding: 0 16px;
    height: 50px;
    font-size: 15px;
    color: var(--ink);
    outline: 0;
    transition: border-color .25s,box-shadow .25s,background .25s
}

.sidebar .serv-widget textarea {
    height: auto;
    padding: 13px 16px;
    min-height: 112px;
    resize: vertical
}

.sidebar .serv-widget input:focus,.sidebar .serv-widget textarea:focus {
    border-color: var(--primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(18,87,224,.12)
}

.sidebar .serv-widget .btn {
    width: 100%;
    justify-content: center
}

.sidebar .serv-widget p.note {
    font-size: 13px;
    margin: 12px 0 0;
    color: var(--mute)
}

.signup-sec {
    position: relative;
    background: linear-gradient(180deg,var(--soft) 0%,#fff 100%);
    padding-top: 76px!important
}

.signup-sec::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .7;
    background: linear-gradient(var(--line) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/64px 64px;
    -webkit-mask-image: linear-gradient(180deg,#000,transparent 70%);
    mask-image: linear-gradient(180deg,#000,transparent 70%)
}

.signup-sec .container {
    position: relative
}

.signup-sec .contact-form2 {
    position: relative;
    overflow: hidden;
    background: #fff!important;
    border: 1px solid var(--line);
    border-radius: 28px;
    box-shadow: var(--shadow-lg)
}

.signup-sec .contact-form2::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 5px;
    background: linear-gradient(90deg,var(--primary),var(--sky),var(--accent))
}

.signup-sec .contact-form2 h2 {
    font-size: clamp(26px,3vw,34px);
    margin: 0 0 10px!important;
    color: var(--ink)
}

.signup-sec .form-lead {
    margin: 0 0 32px;
    font-size: 16px;
    line-height: 1.7
}

.signup-sec .form-group {
    margin-bottom: 18px
}

.signup-sec .form-control,.signup-sec .form-select {
    height: 56px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #FAFBFD;
    padding: 0 18px;
    font-size: 15px;
    color: var(--ink);
    box-shadow: none;
    transition: border-color .25s,background .25s,box-shadow .25s
}

.signup-sec textarea.form-control {
    height: auto;
    padding: 15px 18px
}

.signup-sec .form-control:focus,.signup-sec .form-select:focus {
    border-color: var(--primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(18,87,224,.12)
}

.signup-sec .form-control::placeholder {
    color: #8A97AD
}

.signup-sec .btn {
    padding: 17px 34px
}

.signup-sec .form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 8px
}

.signup-sec .form-actions small {
    color: var(--mute);
    font-size: 13px;
    max-width: 300px;
    line-height: 1.5
}

.signup-sec .login-bottom {
    margin-top: 30px!important;
    padding-top: 24px;
    border-top: 1px solid var(--line);
    text-align: center
}

.signup-sec .login-bottom label {
    font-size: 15px;
    margin: 0
}

.signup-sec .login-bottom a {
    color: var(--primary);
    font-weight: 700
}

.signup-sec .login-bottom i {
    color: var(--primary)
}

.sbec-trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 30px;
    margin: 30px 0 0;
    padding: 0;
    list-style: none
}

.sbec-trust li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--ink)
}

.sbec-trust i {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--tint);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px
}

.sub-title {
    background: var(--tint);
    color: var(--primary)
}

.sbec-focus-card {
    border-top: 3px solid var(--primary)
}

.sbec-focus-card:hover {
    box-shadow: var(--shadow-sm),0 34px 60px -34px rgba(18,87,224,.55)
}

.sbec-focus-no {
    background: var(--tint)!important;
    color: var(--primary)!important
}

.process-card2 span {
    background: var(--primary)!important
}

.process-sec2 .col-lg-4:nth-child(n) .process-card2 span {
    background: var(--primary)!important
}

.sbec-band {
    background: linear-gradient(120deg,var(--navy-3) 0%,var(--navy-2) 60%,#12489F 100%)
}

.sbec-info-card:nth-child(n) .ico {
    background: var(--primary);
    color: #fff
}

.sbec-tag {
    color: var(--accent);
    border-color: rgba(59,201,242,.4)
}

.service-entry3:hover {
    border-color: rgba(59,201,242,.6);
    background: rgba(18,87,224,.14)!important
}

.header-nav-wrapper {
    box-shadow: 0 1px 0 rgba(10,31,77,.06),0 14px 30px -22px rgba(10,31,77,.25)
}

.sbec-premium-footer .sbec-premium-eyebrow {
    color: var(--accent)
}

.sbec-premium-footer .sbec-premium-cta h2 span {
    color: var(--accent)
}

@media (prefers-reduced-motion:reduce) {
    * {
        scroll-behavior: auto!important
    }
}

.sbec-portfolio .portfolio-card .project-category {
    color: var(--accent)
}

.sbec-portfolio .portfolio-card .btn:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--navy)
}

.sidebar .widget-title {
    font-family: var(--font-family-headings);
    font-weight: 600;
    line-height: 1.3
}

.sidebar .sol-widget {
    padding: 26px 14px 14px
}

.sidebar .sol-widget .widget-title {
    margin: 0 14px 18px
}

.sidebar .sol-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 4px
}

.sidebar .sol-list li,.sidebar .sol-list li:hover {
    margin: 0;
    padding: 10px 10px;
    border: 0;
    background: #8e0e0e00;
    color: inherit;
    text-align: left;
    overflow: visible;
    display: block
}

.sidebar .sol-list li a {
    float: none;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 11px 14px 11px 11px;
    border-radius: 16px;
    color: var(--ink);
    font-family: var(--font-family-headings);
    font-weight: 600;
    font-size: 14.5px;
    line-height: 1.3;
    transition: background .25s,color .25s,box-shadow .25s
}

.sidebar .sol-list .ic {
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: var(--tint);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: background .25s,color .25s
}

.sidebar .sol-list .tx {
    flex: 1;
    min-width: 0
}

.sidebar .sol-list .go {
    flex: none;
    font-size: 11px;
    color: var(--primary);
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity .25s,transform .25s
}

.sidebar .sol-list li a:hover {
    background: var(--soft);
    color: var(--primary)
}

.sidebar .sol-list li a:hover .go {
    opacity: 1;
    transform: none
}

.sidebar .sol-list li a.active,.sidebar .sol-list li a.active:hover {
    background: linear-gradient(135deg,var(--navy-2) 0%,var(--primary) 100%);
    color: #fff;
    box-shadow: 0 18px 30px -18px rgba(18,87,224,.85);
    padding: 12px 10px;
}

.sidebar .sol-list li a.active .ic {
    background: rgba(255,255,255,.16);
    color: var(--accent)
}

.sidebar .sol-list .here {
    flex: none;
    font-family: var(--font-family-base);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--navy);
    background: var(--accent);
    padding: 3px 10px;
    border-radius: 999px
}

.sidebar .contact-widget {
    padding: 30px 28px
}

.sidebar .serv-widget {
    padding: 30px 28px
}

.sidebar .serv-widget .btn {
    padding: 16px 24px
}

.service-details-sec .sbec-cta {
    position: relative;
    overflow: hidden;
    margin: 64px 0 0;
    padding: 44px 44px 40px;
    border-radius: var(--r-lg);
    color: rgba(255,255,255,.86);
    background: linear-gradient(125deg,var(--navy-3) 0%,var(--navy-2) 58%,#12489F 100%);
    box-shadow: var(--shadow-lg);
    isolation: isolate
}

.service-details-sec .sbec-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .55;
    background: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px) 0 0/44px 44px,linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px) 0 0/44px 44px;
    -webkit-mask-image: linear-gradient(135deg,#000,transparent 75%);
    mask-image: linear-gradient(135deg,#000,transparent 75%)
}

.service-details-sec .sbec-cta::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -90px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    z-index: -1;
    background: radial-gradient(circle,rgba(59,201,242,.35),transparent 68%)
}

.service-details-sec .serv-article .sbec-cta h3 {
    margin: 0 0 16px;
    color: #fff;
    font-size: clamp(24px,2.5vw,30px)
}

.service-details-sec .serv-article .sbec-cta p {
    color: rgba(255,255,255,.82);
    font-size: 16.5px;
    max-width: 60ch;
    margin: 0 0 16px
}

.service-details-sec .serv-article .sbec-cta p.sbec-cta-q {
    margin: 22px 0 0;
    padding-left: 20px;
    border-left: 3px solid var(--accent);
    color: #fff;
    font-weight: 500;
    font-size: 17.5px;
    line-height: 1.65
}

.service-details-sec .sbec-cta-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px 28px;
    margin-top: 30px
}

.service-details-sec .sbec-cta-call {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-weight: 600;
    font-family: var(--font-family-headings);
    font-size: 15px
}

.service-details-sec .sbec-cta-call i {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255,255,255,.1);
    color: var(--accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px
}

.service-details-sec .sbec-cta-call:hover {
    color: var(--accent)
}

@media (max-width: 575px) {
    .service-details-sec .sbec-cta {
        padding:32px 24px
    }
}

.service-details-sec,.service-details-sec .container,.service-details-sec .row {
    overflow: visible
}

.service-details-sec .col-lg-4 {
    align-self: stretch
}

@media (min-width: 992px) {
    .service-details-sec .sidebar {
        position:sticky;
        top: 104px;

        overflow-y: auto;
        overflow-x: hidden;
        margin: 0;
        padding: 0 4px 4px 0;
        scrollbar-width: none;
        -ms-overflow-style: none
    }

    .service-details-sec .sidebar::-webkit-scrollbar {
        display: none
    }

    .sidebar .widget {
        padding: 22px 20px;
        margin-bottom: 16px;
        border-radius: 20px
    }

    .sidebar .widget-title {
        font-size: 18px;
        margin: 0 0 14px;
        padding-bottom: 12px
    }

    .sidebar .sol-widget {
        padding: 20px 10px 10px
    }

    .sidebar .sol-widget .widget-title {
        margin: 0 12px 10px
    }

    .sidebar .sol-list {
        gap: 2px
    }

    .sidebar .sol-list li a {
        padding: 7px 12px 7px 8px;
        font-size: 14px;
        border-radius: 14px;
        gap: 12px
    }

    .sidebar .sol-list .ic {
        width: 34px;
        height: 34px;
        border-radius: 10px;
        font-size: 14px
    }

    .sidebar .contact-widget {
        padding: 22px 20px
    }

    .sidebar .contact-widget ul li {
        margin-bottom: 12px;
        font-size: 14px;
        gap: 12px
    }

    .sidebar .contact-widget ul li i {
        width: 34px;
        height: 34px;
        border-radius: 10px;
        font-size: 13px
    }

    .sidebar .serv-widget {
        padding: 22px 20px;
        margin-bottom: 0
    }

    .sidebar .serv-widget .form-group {
        margin-bottom: 10px
    }

    .sidebar .serv-widget input {
        height: 44px;
        font-size: 14px
    }

    .sidebar .serv-widget textarea {
        min-height: 70px;
        height: 70px;
        padding: 10px 16px;
        font-size: 14px
    }

    .sidebar .serv-widget .btn {
        padding: 13px 20px
    }
}

@media (min-width: 992px) {
    .sidebar .widget {
        padding:18px 18px;

    }

    .sidebar .widget-title {
        font-size: 17px;
        margin: 0 0 12px;
        padding-bottom: 10px
    }

    .sidebar .sol-widget {
        padding: 18px 8px 8px
    }

    .sidebar .sol-widget .widget-title {
        margin: 0 12px 8px
    }

    .sidebar .sol-list {
        gap: 0
    }

    .sidebar .sol-list li a {
        padding: 5px 10px 5px 6px;
        font-size: 13.5px
    }

    .sidebar .sol-list .ic {
        width: 30px;
        height: 30px;
        border-radius: 9px;
        font-size: 13px
    }

    .sidebar .contact-widget {
        padding: 18px
    }

    .sidebar .contact-widget .widget-title {
        margin-bottom: 12px
    }

    .sidebar .contact-widget ul li {
        margin-bottom: 10px;
        font-size: 13.5px
    }

    .sidebar .contact-widget ul li i {
        width: 32px;
        height: 32px
    }

    .sidebar .serv-widget {
        padding: 18px
    }

    .sidebar .serv-widget .form-group {
        margin-bottom: 8px
    }

    .sidebar .serv-widget input {
        height: 60px;
    }

    .sidebar .serv-widget textarea {

        height: 150px;
        padding: 8px 16px
    }

    .sidebar .serv-widget .btn {
        padding: 11px 20px
    }
}

/* CTA box: keep emphasised lines readable on dark background */
.sbec-cta .sbec-cta-q,.sbec-cta .sbec-cta-q strong,.sbec-cta .sbec-cta-q em,.sbec-cta .sbec-signoff,.sbec-cta .sbec-signoff strong{color:#fff!important}