@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.main-container {

    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

@keyframes fadeInUp {
    from {
        transform: translateY(50px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.fade-in-up {
    animation: 0.75s both fadeInUp;
}


body {
    overflow: scroll;
    height:100%;
    min-height:100%;
}

a, .btn-link {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

app {
    position: relative;
    display: flex;
    flex-direction: column;
}

.top-row {
    height: 3.5rem;
    display: flex;
    align-items: center;
}

.main {
    flex: 1;
}

    .main .top-row {
        background-color: #f7f7f7;
        border-bottom: 1px solid #d6d5d5;
        justify-content: flex-end;
    }

        .main .top-row > a, .main .top-row .btn-link {
            white-space: nowrap;
            margin-left: 1.5rem;
        }

        .main .top-row a:first-child {
            overflow: hidden;
            text-overflow: ellipsis;
        }

.sidebar {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

    .sidebar .top-row {
        background-color: rgba(0,0,0,0.4);
    }

    .sidebar .navbar-brand {
        font-size: 1.1rem;
    }

    .sidebar .oi {
        width: 2rem;
        font-size: 1.1rem;
        vertical-align: text-top;
        top: -2px;
    }

    .sidebar .nav-item {
        font-size: 0.9rem;
        padding-bottom: 0.5rem;
    }

        .sidebar .nav-item:first-of-type {
            padding-top: 1rem;
        }

        .sidebar .nav-item:last-of-type {
            padding-bottom: 1rem;
        }

        .sidebar .nav-item a {
            color: #d7d7d7;
            border-radius: 4px;
            height: 3rem;
            /*display: flex;*/
            align-items: center;
            line-height: 3rem;
        }

            .sidebar .nav-item a.active {
                background-color: rgba(255,255,255,0.25);
                color: white;
            }

            .sidebar .nav-item a:hover {
                background-color: rgba(255,255,255,0.1);
                color: white;
            }

.content {
    padding-top: 1.1rem;
}

.navbar-toggler {
    background-color: rgba(255, 255, 255, 0.1);
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.green-color {
    color: rgb(166, 223, 134)
}

.blue-color {
    color: #2E445C;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}


.main-heading {
    max-width: 800px;
    text-align: center;
    margin: auto;
}


    .main-heading h1 {
        font-size: 50px;
    }


    .main-heading p {
        font-size: 18px;
        line-height: 26px;
    }

.navigationWrapper {
    position: relative;
    display: flex;
    justify-content: space-between;
    background-color: #2E445C;
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.25);
    margin: 0;
    padding: 0;
    color: white;
    overflow: hidden;
    .logoWrapper

{
    display: flex;
    height: 76px;
    width: 251px;
    font-size: 24px;
    font-family: "Arial Black";
    list-style-type: none;
    justify-content: center;
    align-items: center;
    background-color: white;
    .stylish

{
    font-weight: bold;
    a

{
    opacity: 1;
    list-style-type: none;
    color: #2E445C;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

}

.logo {
    color: #2E445C;
    font-size: 50%;
}

}

.navigation {
    display: flex;
    list-style-type: none;
    justify-content: center;
    align-items: center;
    margin-top: 16px;
    li

{
    opacity: 1;
    list-style-type: none;
    color: white;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

.parent {
    padding: 0 20px;
    cursor: pointer;
    .link

{
    position: relative;
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
    color: white;
    &:hover

{
    color: rgb(166, 223, 134);
}


.fas {
    color: rgb(166, 223, 134);
    margin: -2px 4px 0;
    font-size: 10px;
    transition: all 0.3s ease-in-out;
}

}
}
}
}

.active.parent {
    transform: translate(-40px, -25px);
    .link

{
    font-size: 12px;
    .fa-minus

{
    opacity: 1 !important;
    font-size: 8px;
}


}

.subnavigation {
    display: flex;
}

}

.active#clients {
    .subnavigation

{
    transform: translate(-150px, 17px);
}

}

.active#services {
    .subnavigation

{
    transform: translate(-290px, 17px);
}

}

.invisible {
    opacity: 0 !important;
    transform: translate(50px, 0);
}

/* Flat overrides for the nav logo emphasis. The SCSS-style nested rules
   inside .navigationWrapper above don't reliably apply in older browsers,
   so the bolder/larger logo is set here as a flat rule. */
.navigationWrapper .logoWrapper .stylish a {
    font-weight: 900;
    font-size: 28px;
}


.ESPProductBlock_Light_TwoColumn {
    display: flex;
    justify-content: center;    
    margin: 20px;
    h5
{
    color: #2E445C;
    min-width: 100px;
    font-size: 30px;
    font-weight: bold;
}
p {
    color: #2E445C;
    min-width: 100px;
    font-size: 18px;
}
ul {
    color: #2E445C;
    min-width: 100px;
    font-size: 18px;
}
a {
    display: inline-block;
    height: 50px;
    color: #2E445C;
    font-weight: bold;
    width: 231px;
    border-radius: 30px;
    background-color: white;
    border: 6px solid #2E445C;
    text-align: center;
    cursor: pointer;
}

    a:hover, a:active {
        border: 6px solid grey;
    }

}
.ColumnSup {

    top: -.7em;
    font-size: 52%;

    }
.ESPProductBlock_ColumnWidth {
    min-width: 60vh;
    max-width: 500px;
    height:700px;
    margin-right: 200px;
}
.ESPProductBlock_ColumnCustom {
    width:500px;
    opacity:1;
}
.ColumnSpacer {
    height: 600px;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ColumnSpacer {
    height: 600px;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;

}
.ColumnSpacerImage {
    height: 600px;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("/images/New/Stock/desktop2.png");
    background: linear-gradient( rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7) ), url("/images/New/Stock/desktop2.png");
    background-color: white;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.ESPProductBlock_Image {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 10px;
    margin: 10px;
    height: 80vh;
    max-width: 50vh;
    text-align: center;
}
.ESPProductBlock_ImageText {
    display:flex;
    align-content:center;
    justify-items:center;
    align-items:center;
    padding: 10px;
    margin: 10px;
    height:100%;
    text-align: center;

}
ESPProductBlock_CustomerImage {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 10px;
    margin: 10px;
    height: 80vh;
    max-width: 50vh;
    text-align: center;
}
.ESPProductBlock_Spacer {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 10px;
    margin: 10px;
    max-width: 50vh;
    text-align: center;
}
.img {
    object-fit: contain;
}


/* Customer-quote rotator (CSS-only — replaces the old SfCarousel) */
.QuoteRotator_Container {
    background: linear-gradient(90deg, #2E445C, rgb(166, 223, 134));
    height: 462px;
    margin: 0 auto;
    width: 100%;
    color: white;
    display: flex;
    flex-direction: column;
}
.QuoteRotator_Header {
    padding-top: 75px;
    width: 100%;
    text-align: center;
}
.QuoteRotator_Header h5 {
    font-weight: bold;
    font-size: 24px;
    color: white;
    margin: 0;
}
.QuoteRotator_Header hr {
    width: 5%;
    border: 1px solid white;
    margin: 12px auto 0 auto;
}
.QuoteRotator_Stage {
    position: relative;
    flex: 1;
    width: 600px;
    max-width: 90%;
    margin: 30px auto 30px;
}
.QuoteRotator_Quote {
    position: absolute;
    inset: 0;
    text-align: center;
    font-size: 2rem;
    font-weight: bold;
    line-height: 1.3;
    color: white;
    opacity: 0;
    animation: quote-fade 25s infinite;
    display: flex;
    align-items: center;
    justify-content: center;
}
.QuoteRotator_Quote:nth-child(1) { animation-delay: 0s; }
.QuoteRotator_Quote:nth-child(2) { animation-delay: 5s; }
.QuoteRotator_Quote:nth-child(3) { animation-delay: 10s; }
.QuoteRotator_Quote:nth-child(4) { animation-delay: 15s; }
.QuoteRotator_Quote:nth-child(5) { animation-delay: 20s; }
@keyframes quote-fade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    18%  { opacity: 1; }
    20%  { opacity: 0; }
    100% { opacity: 0; }
}

.ESPProducts_Compliance {
    text-align: center;
    color: rgb(80, 110, 130);
    font-size: 15px;
    margin: 8px auto 0 auto;
}
.ESP_TextBanner {
    background: #2E445C;
    height: 462px;
    margin: 0 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
    .ESP_TextBanner span{
        color:white;
        width:700px;
        text-align:center;
        font-weight:bold;
        font-size: 45px;
    }

.ESPProductBlock_Logos {
    display: flex;
    margin-left:200px;
    margin-right:200px;
    justify-content: space-between;
}
    .ESPProductBlock_Logos div {
        background: white;
        min-width: 200px;
        max-width: 200px;
        padding: 1rem;
        display: grid;
        place-items: center;
        &::before

{
    display: block;
    padding-bottom: 100%;
    grid-area: 1 / 1 / 2 / 2;
}

}

.ESPProductBlock_Logos div img {
    width: 100%;
    grid-area: 1 / 1 / 2 / 2;
}

.ESPProductBlock_LogosCustomerPage {
    display: flex;
    flex-wrap:wrap;
    justify-content:flex-start;
}

    .ESPProductBlock_LogosCustomerPage div {
        background: white;
        min-width: 200px;
        max-width: 200px;
        padding: 1rem;
        margin-left:5rem;
        margin-right :5rem;
        display: grid;
        width: calc(100% * (1/5) - 10px - 1px);
        place-items: center;
        &::before

{
    display: block;
    padding-bottom: 100%;
    grid-area: 1 / 1 / 2 / 2;
}

}

.ESPProductBlock_LogosCustomerPage div img {
    width: 100%;
    grid-area: 1 / 1 / 2 / 2;
}
.ESPProductBlock_Light_SingleColumn {
    display: flex;
    justify-content: flex-start;
    margin: 20px;
}

.ESPProductBlock_OurProductsHeader {
    display: flex;

    align-items: center;
    padding-left:325px;
    padding-bottom:45px;
    min-width: 50vh;
    max-width: 400px;
   
    height: 70px;
}
.OurProductsHeader_WhiteBackground {
    color: #2E445C;
    font-size: 60px;
    padding: 0px 10px 0px 0px;
    align-items: center;
    font-weight: bold;
    text-shadow: 4px 4px 5px #999;
}
.OurProductsHeader_BlueBackground {
    color: white;
    background-color: #2E445C;
    font-size: 60px;
    padding: 0 30px 0 10px;
    align-items: center;
    font-weight: bold;
    text-shadow: 0px 3px 5px black;
    box-shadow: 5px 5px 5px #999;
}
.ESPProductBlock_Light_ThreeColumn {
    display: flex;
    min-width: 90vh;
    justify-content: center;
    align-items: stretch;
    border: 4px solid #2E445C;
    min-height: 559px;
    margin-top: 20px;
}
.ESPProductBlock_ColumnBorder {
    display: flex;
    justify-content: center;
    min-width: 300px;
    margin: 50px auto 25px auto;
}
.ESPProductBlock_ColumnSpacer {
    color: #2E445C;
    background-color: #2E445C;
    width: 2px;
}
.ESPProductBlock_FooterSpacer {
    color: #2E445C;
    background-color: rgb(166, 223, 134);
    width: 2px;
    margin-left: 10px;
    margin-right: 10px;
}
.ESPProductBlock_ColumnContent {
    color: green;
    min-width: 300px;
    max-width: 300px;
    h5

{
    color: #2E445C;
    min-width: 200px;
    max-width: 300px;
    font-size: 30px;
    font-weight: bold;
}
img{
    height: 50px;
    width: 50px;
    margin-bottom: 25px;
    object-fit:contain;
}

p {
    color: #2E445C;
    min-width: 200px;
    font-size: 18px;
}

ul {
    color: #2E445C;
    min-width: 100px;
    font-size: 18px;
}

a {
    display: inline-block;
    height: 50px;
    font-weight: bold;
    color: #2E445C;
    width: 231px;
    border-radius: 30px;
    background-color: white;
    border: 6px solid #2E445C;
    text-align: center;
    cursor: pointer;
}

    a:hover, a:active {
        border: 6px solid grey;
    }

}

.ESPProductBlock_DarkFooter {
    display:flex;
    justify-content:center;
    justify-items: center;
    align-content:center;
    align-items:center;
    padding-top: 100px;
    padding-bottom: 0px;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
    font-size: 3rem;
}

.ESPProductBlock_ContactUs {
    display: flex;
    flex-direction: column;
    justify-content: center;
    justify-items: center;
    align-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 0px;
    font-size: small;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
}

    .ESPProductBlock_ContactUs h1 {
        color: #2E445C;
        font-size:56px;
        font-weight:bold;
    }

    .ESPProductBlock_ContactUs span {
        color: #2E445C;
        font-size:16px;
        margin-bottom:20px;
    }

.ContactUs_Div {
    padding-bottom: 30px;
}

.ContactUs_Link {
    color: rgb(166, 223, 134);
    border-bottom: 2px solid rgb(166, 223, 134);
    font-weight: bold;
    margin-left: 25px;
    padding-bottom: 10px;
    font-size: 20px;
    margin-bottom: 10px;
    text-decoration: none;
}
.ContactUs_Div a.ContactUs_Link:hover {
    color: white;
    border-bottom: 3px solid rgb(166, 223, 134);
    text-decoration: none;
}

.HomeFooter_ContactRow {
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 0;
    padding: 12px 16px;
    text-align: center;
}
.HomeFooter_ContactItem {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 16px;
}
.HomeFooter_ContactLabel {
    font-weight: bold;
    font-size: 14px;
    line-height: 1.2;
}
.HomeFooter_ContactValue {
    font-size: 16px;
    line-height: 1.3;
    margin-top: 2px;
}
.HomeFooter_ContactValue a {
    color: white;
    text-decoration: none;
}
.HomeFooter_ContactValue a:hover {
    color: rgb(166, 223, 134);
}
.ESPFooter {
    margin-top: -64px;
    display: flex;
    z-index:900;
    justify-items: center;
    justify-content: center;
    align-content: center;
    align-items: center;
    font-size: 12px;
    width: 100%;
    font-size: medium;
    text-align: center;
    height: 64px;
    min-height: 64px;
    color: rgb(166, 223, 134);
    background-color: #2E445C;
}
.ESPFooter_Inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.3;
}
.ESPFooter_Compliance {
    font-size: 12px;
    opacity: 0.8;
}

.ESPFloatingButton {
    position: fixed;
    z-index:999;
    bottom: 0;
    left: 0;
    margin-left:20px;
    margin-bottom:20px;
}
    .ESPFloatingButton a {
        display: inline-block;
        height: 50px;
        color: #2E445C;
        font-weight: bold;
        width: 231px;
        border-radius: 30px;
        background-color: rgb(166, 223, 134);
        border: 6px solid rgb(166, 223, 134);
        text-align: center;
        cursor: pointer;
    }


.ESPProductBlock_ProductTop {
    display: flex;
    min-height: 698px;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    background-color: #2E445C;
    background: rgb(46,68,95, .2);
    color: white;
    background-image: url("/images/New/Stock/handtouchingcloud2.webp");
    background-color: white;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}



.ESPProductBlock_ProductCentered {
    width: 678px;
    height: 341px;
    text-align: center;
    background-color: rgb(46,68,95, .9);
    color: white;
    padding:25px;

}

    .ESPProductBlock_ProductCentered h1 {
        font-size: 56px;

    }
ESPProductBlock_ProductCentered span {
    font-size: 12px;
}

.ESPProductBlock_ColumnWidth_ProductPage {
    min-width: 60vh;
    max-width: 500px;
    margin-right: 200px;
    margin-top:50px;
}
    .ESPProductBlock_ColumnWidth_ProductPage h5{
        font-size:56px;
    }
    .ESPProductBlock_ColumnWidth_ProductPage p {
        color:black;
        font-size:28px;
    }
    .ESPProductBlock_ColumnWidth_ProductPage li {
        font-size: 20px;
    }

    .ESPProductBlock_ColumnWidth_ProductPage a {
        display: inline-block;
        height: 50px;
        color: #2E445C;
        font-weight: bold;
        width: 231px;
        border-radius: 30px;
        background-color: rgb(166, 223, 134);
        border: 6px solid rgb(166, 223, 134);
        text-align: center;
        cursor: pointer;
    }

.ESPProductBlock_ColumnWidth_ProductPageRight {
    min-width: 60vh;
    max-width: 500px;
    margin-left: 350px;
    margin-top: 50px;
}

    .ESPProductBlock_ColumnWidth_ProductPageRight h5 {
        font-size: 56px;
    }

    .ESPProductBlock_ColumnWidth_ProductPageRight p {
        color: black;
        font-size: 28px;
    }

    .ESPProductBlock_ColumnWidth_ProductPageRight li {
        font-size: 20px;
    }

    .ESPProductBlock_ColumnWidth_ProductPageRight a {
        display: inline-block;
        height: 50px;
        color: #2E445C;
        font-weight: bold;
        width: 231px;
        border-radius: 30px;
        background-color: rgb(166, 223, 134);
        border: 6px solid rgb(166, 223, 134);
        text-align: center;
        cursor: pointer;
    }

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

@media (max-width: 767.98px) {
    .main .top-row:not(.auth) {
        display: none;
    }

    .main .top-row.auth {
        justify-content: space-between;
    }

    .main .top-row a, .main .top-row .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 768px) {
    app {
        flex-direction: column;
    }

    .sidebar {
        /*width: 250px;*/
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .main .top-row {
        position: sticky;
        top: 0;
    }

    .main > div {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }

    .navbar-toggler {
        display: none;
    }

    .sidebar .collapse {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }


    /**************** ESP Stuff *****************/

    .ESPMain, .ESPProductBlock_Dark, .ESPProductBlock_Light, .ESPNav, .ESPProductBlock_DarkHome {
        font: 12px arial, verdana;
        color: white;
        font-size: 1.5rem;
        font-weight: 400;
        line-height: 1.5;
    }

    .ESPMain {
        flex: 1;
        font: 12px arial, verdana;
        color: white;
        font-size: 1.5rem;
        font-weight: 400;
        line-height: 1.5;
    }

    .ESPProduct {
        font-family: "arial black";
        font-weight: bolder;
    }

    .ESPNav {
        font-size: medium
    }

    .ESPProductBlock_Dark, .ESPProductBlock_Light {
        padding-right: 20%;
        padding-left: 20%;
        padding-top: 50px;
        padding-bottom: 50px;
        margin-right: auto;
        margin-left: auto;
        text-align: center;
        font-size: 3rem;
    }

    .ESPProductBlock_DarkHome {
        padding-right: 45%;
        padding-left: 15%;
        padding-top: 200px;
        padding-bottom: 200px;
        margin-right: auto;
        margin-left: auto;
        text-align: left;
        font-size: 3rem;
    }

    .ESPProductBlock_Light {
        background-color: white;
        color: black;
    }

    .custom, .nav_flex-container > li > a:hover {
        color: yellow;
    }

    .nav_flex-container {
        display: flex;
        flex-direction: row;
        justify-content: center;
        text-align: center;
        background: black;
        color: white;
    }

    .bullet_list {
        display: table;
        margin: 0 auto;
        text-align: left;
        font-style: italic;
        padding-bottom: 20px;
        max-width: 550px;
    }


}


/* =========================================================================
   Content Refresh v5
   -------------------------------------------------------------------------
   Classes promoted from the inline <style> blocks in Reports/mockups/*.html
   so the Razor pages can reference them directly. Image URLs rewritten from
   the mockups' relative paths to web-relative /Images/... paths.

   Sources:
     homepage-v2.html       -> .LaunchBanner_*, .Hero_CTA_*, .About_Strip,
                               .TwoWays_*
     customsolutions-v1.html -> .CS_*
     products-v1.html       -> .Custom_Invite
     aboutus-v1.html        -> .About_CustomNote
     contactus-v1.html      -> .CU_*
   ========================================================================= */

/* --- Launch banner (homepage, time-bounded) --- */
.LaunchBanner {
    background-color: rgb(166, 223, 134);
    color: #2E445C;
    padding: 12px 16px 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 16px;
    border-bottom: 2px solid #2E445C;
}
.LaunchBanner_Inner {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1 1 auto;
    justify-content: center;
    flex-wrap: wrap;
}
.LaunchBanner_Inner span { color: #2E445C; }
.LaunchBanner_Inner strong { color: #2E445C; font-weight: bold; }
.LaunchBanner_CTA {
    color: #2E445C;
    font-weight: bold;
    text-decoration: none;
    border-bottom: 2px solid #2E445C;
    padding-bottom: 1px;
    white-space: nowrap;
}
.LaunchBanner_CTA:hover { color: #1a2a3c; }
.LaunchBanner_Dismiss {
    background: transparent;
    border: none;
    color: #2E445C;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
    padding: 0 8px;
    line-height: 1;
}
.LaunchBanner_Dismiss:hover { color: #1a2a3c; }

/* --- Hero CTA pair (homepage) --- */
.Hero_CTAs {
    display: flex;
    gap: 24px;
    margin-top: 24px;
    flex-wrap: wrap;
}
.Hero_CTAs a {
    display: inline-block;
    height: 50px;
    line-height: 38px;
    padding: 0 24px;
    border-radius: 30px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    min-width: 220px;
}
.Hero_CTA_Products {
    color: #2E445C;
    background-color: white;
    border: 6px solid white;
}
.Hero_CTA_Custom {
    color: #2E445C;
    background-color: rgb(166, 223, 134);
    border: 6px solid rgb(166, 223, 134);
}
.Hero_CTAs a:hover { border-color: #cccccc; }

/* --- Hero trust strip (homepage, sits below hero overlay) --- */
.Hero_TrustStrip {
    background-color: #2E445C;
    color: white;
    padding: 22px 8% 22px 8%;
    text-align: center;
    border-bottom: 4px solid rgb(166, 223, 134);
}
.Hero_TrustRow {
    font-size: 17px;
    line-height: 1.5;
}
.Hero_TrustRow + .Hero_TrustRow {
    margin-top: 6px;
}
.Hero_TrustProduct {
    color: rgb(166, 223, 134);
    font-weight: bold;
    margin-right: 8px;
}
.Hero_TrustArrow {
    color: rgb(166, 223, 134);
    margin-right: 8px;
}
.Hero_TrustCustomers {
    color: white;
}

/* --- About strip (homepage) --- */
.About_Strip {
    background-color: white;
    padding: 56px 12% 56px 12%;
    text-align: center;
    color: #2E445C;
    border-bottom: 4px solid rgb(166, 223, 134);
}
.About_Strip h2 {
    color: #2E445C;
    font-size: 28px;
    font-weight: bold;
    margin: 0 0 14px 0;
}
.About_Strip p {
    color: #2E445C;
    font-size: 18px;
    line-height: 1.5;
    max-width: 880px;
    margin: 0 auto 14px auto;
}
.About_Strip a {
    color: #2E445C;
    font-weight: bold;
    border-bottom: 2px solid rgb(166, 223, 134);
    text-decoration: none;
    padding-bottom: 1px;
}
.About_Strip a:hover { color: rgb(80, 110, 130); }

/* --- "Two ways to work with us" (homepage, load-bearing) --- */
.TwoWays_Header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 60px;
    padding-bottom: 12px;
}
.TwoWays_Header_White {
    color: #2E445C;
    font-size: 60px;
    font-weight: bold;
    padding: 0 10px 0 0;
    text-shadow: 4px 4px 5px #999;
}
.TwoWays_Header_Blue {
    color: white;
    background-color: #2E445C;
    font-size: 60px;
    font-weight: bold;
    padding: 0 30px 0 10px;
    text-shadow: 0 3px 5px black;
    box-shadow: 5px 5px 5px #999;
}
.TwoWays_Sub {
    text-align: center;
    color: rgb(80, 110, 130);
    font-size: 17px;
    max-width: 720px;
    margin: 0 auto 28px auto;
    line-height: 1.5;
}
.TwoWays_Compliance {
    text-align: center;
    color: rgb(80, 110, 130);
    font-size: 15px;
    max-width: 720px;
    margin: 22px auto 0 auto;
}
.TwoWays_Row {
    display: flex;
    gap: 32px;
    justify-content: center;
    align-items: stretch;
    padding: 12px 80px 70px 80px;
    flex-wrap: wrap;
}
.TwoWays_Card {
    flex: 1 1 460px;
    max-width: 580px;
    background-color: white;
    border: 4px solid #2E445C;
    padding: 36px;
    display: flex;
    flex-direction: column;
    color: #2E445C;
    position: relative;
}
.TwoWays_Card.Custom {
    border-color: rgb(166, 223, 134);
    box-shadow: 0 6px 20px rgba(46,68,92,0.10);
}
.TwoWays_Card .TwoWays_Eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 12px;
    color: rgb(80, 110, 130);
    margin-bottom: 8px;
}
.TwoWays_Card.Custom .TwoWays_Eyebrow { color: #2E445C; font-weight: bold; }
.TwoWays_Card h5 {
    color: #2E445C;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 8px;
}
.TwoWays_Card p {
    color: #2E445C;
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 12px;
}
.TwoWays_ProductIcons {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 16px;
    padding: 12px 0;
    border-top: 1px solid #cdd6df;
    border-bottom: 1px solid #cdd6df;
}
.TwoWays_ProductIcons .item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: bold;
    color: #2E445C;
}
.TwoWays_ProductIcons .item img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}
.TwoWays_ProductIcons .item .sup {
    font-size: 9px;
    vertical-align: top;
}
.TwoWays_Card ul {
    color: #2E445C;
    font-size: 15px;
    margin-top: 4px;
    margin-bottom: 20px;
    padding-left: 18px;
}
.TwoWays_Steps {
    display: flex;
    gap: 6px;
    justify-content: space-between;
    margin: 16px 0 20px 0;
}
.TwoWays_Steps .step {
    flex: 1;
    text-align: center;
    background: #f5f7fa;
    border-radius: 6px;
    padding: 8px 4px;
    font-size: 11px;
    color: #2E445C;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    position: relative;
}
.TwoWays_Steps .step.highlighted {
    background: rgb(166, 223, 134);
    color: #2E445C;
}
.TwoWays_Steps .step .num {
    display: block;
    font-size: 9px;
    color: rgb(80, 110, 130);
    margin-bottom: 2px;
    font-weight: normal;
}
.TwoWays_Steps .step.highlighted .num { color: #2E445C; }
.TwoWays_Steps .step .price {
    display: block;
    font-size: 10px;
    color: #2E445C;
    font-weight: bold;
    margin-top: 2px;
}
.TwoWays_Card a.TwoWays_CTA {
    display: inline-block;
    margin-top: auto;
    height: 50px;
    line-height: 38px;
    color: #2E445C;
    font-weight: bold;
    width: 100%;
    border-radius: 30px;
    background-color: white;
    border: 6px solid #2E445C;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
}
.TwoWays_Card.Custom a.TwoWays_CTA {
    background-color: rgb(166, 223, 134);
    border: 6px solid rgb(166, 223, 134);
}
.TwoWays_Card a.TwoWays_CTA:hover { border-color: grey; }

/* --- Quick Builds page (/quick-builds) --- */
.CS_Hero {
    background-image: linear-gradient( rgba(46,68,92, 0.7), rgba(46,68,92, 0.85) ), url("/Images/New/Stock/handtouchingcloud2.webp");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: white;
    padding: 140px 8% 120px 8%;
    text-align: center;
    min-height: 540px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.CS_Hero h1 {
    font-size: 56px;
    font-weight: bold;
    color: white;
    line-height: 1.1;
    margin-bottom: 16px;
}
.CS_Hero .CS_Hero_Sub {
    font-size: 26px;
    color: rgb(166, 223, 134);
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 16px;
}
.CS_Hero .CS_Hero_AntiTradeoff {
    font-size: 22px;
    color: white;
    font-style: italic;
    margin-bottom: 36px;
}
.CS_Hero a.CS_CTA {
    display: inline-block;
    margin-top: 8px;
    height: 60px;
    line-height: 48px;
    padding: 0 36px;
    border-radius: 30px;
    font-weight: bold;
    background-color: rgb(166, 223, 134);
    color: #2E445C;
    border: 6px solid rgb(166, 223, 134);
    cursor: pointer;
    text-decoration: none;
    font-size: 18px;
}
.CS_Hero a.CS_CTA:hover { border-color: white; }

.CS_WhoWeAre {
    padding: 80px 12%;
    text-align: center;
    color: #2E445C;
}
.CS_WhoWeAre p {
    font-size: 22px;
    line-height: 1.45;
    color: #2E445C;
    max-width: 920px;
    margin: 0 auto;
}

.CS_Process {
    padding: 60px 8% 80px 8%;
    background-color: #f5f7fa;
}
.CS_Process_Header {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 50px;
}
.CS_Process_Header_White {
    color: #2E445C;
    font-size: 56px;
    font-weight: bold;
    padding: 0 10px 0 0;
    text-shadow: 4px 4px 5px #999;
}
.CS_Process_Header_Blue {
    color: white;
    background-color: #2E445C;
    font-size: 56px;
    font-weight: bold;
    padding: 0 30px 0 10px;
    text-shadow: 0 3px 5px black;
    box-shadow: 5px 5px 5px #999;
}
.CS_Steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: stretch; max-width: 1180px; margin: 0 auto; }
@media (max-width: 1100px) { .CS_Steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.CS_Steps .CS_Step { max-width: none; }
.CS_Step {
    flex: 1 1 240px;
    max-width: 280px;
    background-color: white;
    color: #2E445C;
    border: 4px solid #2E445C;
    border-radius: 8px;
    padding: 28px 22px;
    display: flex;
    flex-direction: column;
    position: relative;
}
.CS_Step.Highlighted {
    border-color: rgb(166, 223, 134);
    background-color: rgb(243, 252, 233);
    box-shadow: 0 6px 20px rgba(46,68,92,0.15);
}
.CS_Step_Number {
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgb(80, 110, 130);
    margin-bottom: 6px;
}
.CS_Step_Name {
    font-size: 28px;
    font-weight: bold;
    color: #2E445C;
    margin-bottom: 10px;
}
.CS_Step_Price {
    display: inline-block;
    background-color: #2E445C;
    color: white;
    font-weight: bold;
    font-size: 14px;
    padding: 4px 10px;
    border-radius: 12px;
    margin-bottom: 12px;
    align-self: flex-start;
}
.CS_Step_Price_Free {
    background-color: white;
    color: #2E445C;
    border: 2px solid #2E445C;
}
.CS_Step_Body {
    font-size: 16px;
    line-height: 1.45;
    color: #2E445C;
}
.CS_Step_Outcome {
    margin-top: auto;
    padding-top: 14px;
    font-size: 14px;
    font-style: italic;
    color: rgb(80, 110, 130);
}

.CS_Ladder {
    background-color: #2E445C;
    color: white;
    padding: 70px 8%;
    text-align: center;
}
.CS_Ladder h2 {
    color: white;
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 32px;
}
.CS_Ladder_Rungs {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 760px;
    margin: 0 auto;
}
.CS_Ladder_Rung {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(255,255,255,0.08);
    padding: 18px 24px;
    border-left: 6px solid rgb(166, 223, 134);
    font-size: 20px;
    text-align: left;
}
.CS_Ladder_Rung .price {
    color: rgb(166, 223, 134);
    font-weight: bold;
    font-size: 26px;
    min-width: 200px;
}
.CS_Ladder_Closer {
    margin-top: 36px;
    font-size: 22px;
    color: rgb(166, 223, 134);
    font-weight: 600;
}
.CS_Ladder_Compliance {
    margin-top: 18px;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.7);
}

.CS_Why {
    padding: 80px 8%;
    background-color: white;
}
.CS_Why_Header {
    text-align: center;
    color: #2E445C;
    font-size: 38px;
    font-weight: bold;
    margin-bottom: 40px;
}
.CS_Why_Sub {
    text-align: center;
    color: rgb(80, 110, 130);
    font-size: 18px;
    margin-bottom: 50px;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.45;
}
.CS_Why_Grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
    max-width: 1100px;
    margin: 0 auto;
}
.CS_Why_Item {
    border-left: 6px solid rgb(166, 223, 134);
    padding: 8px 22px;
    color: #2E445C;
}
.CS_Why_Item h5 {
    font-weight: bold;
    font-size: 22px;
    color: #2E445C;
    margin-bottom: 6px;
}
.CS_Why_Item p {
    font-size: 16px;
    line-height: 1.45;
    color: #2E445C;
}

.CS_WhatWeBuild {
    background-color: #f5f7fa;
    padding: 80px 8%;
}
.CS_WhatWeBuild h2 {
    text-align: center;
    color: #2E445C;
    font-size: 38px;
    font-weight: bold;
    margin-bottom: 12px;
}
.CS_WhatWeBuild .CS_WhatWeBuild_Sub {
    text-align: center;
    color: rgb(80, 110, 130);
    font-size: 16px;
    margin-bottom: 40px;
    font-style: italic;
}
.CS_WhatWeBuild_List {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    max-width: 1100px;
    margin: 0 auto;
}
@media (max-width: 1100px) { .CS_WhatWeBuild_List { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.CS_WhatWeBuild_Item {
    background: white;
    padding: 20px 22px;
    border-top: 4px solid #2E445C;
    color: #2E445C;
    font-size: 16px;
    line-height: 1.45;
}
.CS_WhatWeBuild_Item strong {
    color: #2E445C;
    display: block;
    margin-bottom: 6px;
    font-size: 17px;
}

.CS_WhyChoose {
    padding: 80px 8%;
    background-color: white;
}
.CS_WhyChoose h2 {
    text-align: center;
    color: #2E445C;
    font-size: 38px;
    font-weight: bold;
    margin-bottom: 40px;
}
.CS_WhyChoose ul {
    max-width: 860px;
    margin: 0 auto 40px auto;
    font-size: 18px;
    color: #2E445C;
    line-height: 1.6;
}
.CS_WhyChoose ul li {
    padding: 6px 0;
}
.CS_WhyChoose ul li strong { color: #2E445C; }

.CS_Keep {
    background-color: #2E445C;
    color: white;
    padding: 60px 8%;
}
.CS_Keep h2 {
    color: white;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 18px;
    text-align: center;
}
.CS_Keep p {
    font-size: 18px;
    line-height: 1.5;
    color: white;
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
}

.CS_Close {
    background-image: url("/Images/New/Stock/handlaptopstock2.webp");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding: 110px 8%;
    text-align: center;
    position: relative;
}
.CS_Close::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(46,68,92, 0.8);
}
.CS_Close_Inner {
    position: relative;
    z-index: 1;
}
.CS_Close h2 {
    color: white;
    font-size: 42px;
    font-weight: bold;
    margin-bottom: 16px;
    line-height: 1.15;
}
.CS_Close p {
    color: rgb(166, 223, 134);
    font-size: 22px;
    margin-bottom: 32px;
}
.CS_Close a.CS_Close_CTA {
    display: inline-block;
    height: 60px;
    line-height: 48px;
    padding: 0 36px;
    border-radius: 30px;
    font-weight: bold;
    background-color: rgb(166, 223, 134);
    color: #2E445C;
    border: 6px solid rgb(166, 223, 134);
    cursor: pointer;
    text-decoration: none;
    font-size: 18px;
}
.CS_Close a.CS_Close_CTA:hover { border-color: white; }

/* --- Quick Builds invitation strip (products page) --- */
.Custom_Invite {
    background-color: white;
    color: #2E445C;
    border-top: 4px solid rgb(166, 223, 134);
    border-bottom: 4px solid rgb(166, 223, 134);
    text-align: center;
    padding: 24px 8%;
    font-size: 18px;
    line-height: 1.5;
}
.Custom_Invite strong { color: #2E445C; }
.Custom_Invite a {
    color: #2E445C;
    font-weight: bold;
    border-bottom: 2px solid rgb(166, 223, 134);
    text-decoration: none;
    padding-bottom: 2px;
    margin-left: 6px;
}
.Custom_Invite a:hover { color: rgb(80, 110, 130); }

/* --- About page closing custom-build note --- */
.About_CustomNote {
    background-color: #2E445C;
    color: white;
    padding: 60px 8%;
    text-align: center;
}
.About_CustomNote h3 {
    color: white;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 14px;
}
.About_CustomNote p {
    color: white;
    font-size: 19px;
    line-height: 1.5;
    max-width: 880px;
    margin: 0 auto 18px auto;
}
.About_CustomNote a {
    display: inline-block;
    margin-top: 10px;
    height: 50px;
    line-height: 38px;
    padding: 0 28px;
    color: #2E445C;
    font-weight: bold;
    border-radius: 30px;
    background-color: rgb(166, 223, 134);
    border: 6px solid rgb(166, 223, 134);
    cursor: pointer;
    text-decoration: none;
}
.About_CustomNote a:hover { border-color: white; }

/* --- Contact page (/contactus) --- */
.Contact_Hero {
    background: #2E445C;
    color: white;
    text-align: center;
    padding: 70px 24px 90px;
}
.Contact_Hero h1 {
    color: white;
    font-size: 56px;
    font-weight: bold;
    margin: 0 0 14px 0;
    line-height: 1.1;
}
.Contact_Hero_Sub {
    max-width: 720px;
    margin: 0 auto;
    font-size: 18px;
    line-height: 1.5;
    color: rgba(255,255,255,0.92);
}

.Contact_Layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 32px;
    max-width: 1080px;
    margin: -50px auto 60px auto;
    padding: 0 24px;
    align-items: start;
}
@media (max-width: 900px) {
    .Contact_Layout {
        grid-template-columns: 1fr;
    }
}

.Contact_Form_Card {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(46,68,92,0.12);
    padding: 32px;
}
.Contact_Form_Lead {
    display: block;
    font-size: 16px;
    color: #2E445C;
    margin-bottom: 18px;
    padding: 10px 14px;
    background: rgb(243, 252, 233);
    border-radius: 8px;
}
.Contact_Form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.Contact_Field input,
.Contact_Field textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 2px solid #cdd6df;
    border-radius: 8px;
    font-size: 15px;
    color: #2E445C;
    background: white;
    font-family: inherit;
    transition: border-color 0.15s;
}
.Contact_Field input:focus,
.Contact_Field textarea:focus {
    outline: none;
    border-color: #2E445C;
}
.Contact_Field textarea {
    resize: vertical;
    min-height: 140px;
}
.Contact_Field_Row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
@media (max-width: 540px) {
    .Contact_Field_Row {
        grid-template-columns: 1fr;
    }
}

.Contact_Submit_Row {
    margin-top: 8px;
}
.Contact_Submit {
    background: #2E445C;
    color: white;
    border: none;
    padding: 12px 28px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.Contact_Submit:hover:not(:disabled) {
    background: rgb(166, 223, 134);
    color: #2E445C;
}
.Contact_Submit:disabled {
    background: #94a3b8;
    cursor: not-allowed;
}

.Contact_Validation {
    margin-top: 4px;
    font-size: 13px;
    color: #b91c1c;
}
.Contact_Validation ul {
    margin: 0;
    padding-left: 18px;
}

.Contact_Aside {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(46,68,92,0.12);
    padding: 24px 24px 28px;
    color: #2E445C;
}
.Contact_Aside h3 {
    font-size: 18px;
    font-weight: bold;
    margin: 0 0 18px 0;
    color: #2E445C;
}
.Contact_Aside_Item {
    margin-bottom: 16px;
}
.Contact_Aside_Item:last-child {
    margin-bottom: 0;
}
.Contact_Aside_Label {
    font-weight: bold;
    color: #2E445C;
    font-size: 14px;
    margin-bottom: 2px;
}
.Contact_Aside_Value {
    font-size: 15px;
}
.Contact_Aside_Value a {
    color: #2E445C;
    text-decoration: none;
    border-bottom: 1px solid rgba(46,68,92,0.25);
}
.Contact_Aside_Value a:hover {
    border-bottom-color: rgb(166, 223, 134);
}

.CU_HelpWith {
    width: 600px;
    max-width: 90%;
    margin: 0 auto 18px auto;
    color: #2E445C;
}
.CU_HelpWith_Label {
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 10px;
    color: #2E445C;
}
.CU_HelpWith_Options {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.CU_HelpWith_Options label {
    background: white;
    border: 2px solid #cdd6df;
    border-radius: 8px;
    padding: 10px 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    transition: border-color 0.15s;
}
.CU_HelpWith_Options label:hover {
    border-color: rgb(166, 223, 134);
}
.CU_HelpWith_Options input[type="radio"] {
    accent-color: #2E445C;
    transform: scale(1.2);
}
.CU_HelpWith_Options input[type="radio"]:checked + .CU_HelpWith_OptionText {
    font-weight: bold;
}
.CU_HelpWith_Options label:has(input:checked) {
    border-color: #2E445C;
    background: rgb(243, 252, 233);
}

/* Long-time customers band (homepage, below About_Strip) */
.LongTermCustomers {
    padding: 64px 24px;
    background: #f4f6fa;
}
.LongTermCustomers_Inner {
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
}
.LongTermCustomers_Title {
    font-size: 30px;
    font-weight: 600;
    color: #1c2741;
    margin: 0 0 40px 0;
    letter-spacing: -0.01em;
}
.LongTermCustomers_Logos {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 32px;
    flex-wrap: wrap;
}
.LongTermCustomers_Logos img {
    height: 64px;
    max-width: 200px;
    object-fit: contain;
}

/* Quick Builds trust strip (replaces text intro on /quick-builds) */
.QB_TrustStrip {
    padding: 56px 24px;
    background: #ffffff;
}
.QB_TrustStrip_Inner {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
}
.QB_TrustStrip_Label {
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 12px;
    font-weight: 600;
    color: #7a8597;
    margin-bottom: 32px;
}
.QB_TrustStrip_Logos {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 40px;
    flex-wrap: wrap;
}
.QB_TrustStrip_Logos img {
    height: 60px;
    max-width: 170px;
    object-fit: contain;
}

.ESPMain .ESPProductBlock_Light_TwoColumn + .ESPProductBlock_Light_TwoColumn {
    border-top: 3px solid rgb(166, 223, 134);
    margin-top: 50px;
    padding-top: 40px;
}

.CS_Value { background-color: rgb(243, 252, 233); color: #2E445C; padding: 80px 8%; border-top: 4px solid rgb(166, 223, 134); border-bottom: 4px solid rgb(166, 223, 134); }
.CS_Value h2 { color: #2E445C; font-size: 38px; font-weight: bold; text-align: center; margin-bottom: 26px; }
.CS_Value_Lead { max-width: 900px; margin: 0 auto 30px auto; font-size: 19px; line-height: 1.55; color: #2E445C; text-align: center; }
.CS_Value_List { max-width: 760px; margin: 0 auto; list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 32px; }
.CS_Value_List li { position: relative; padding-left: 32px; font-size: 18px; line-height: 1.4; color: #2E445C; }
.CS_Value_List li::before { content: "\2713"; position: absolute; left: 0; top: -1px; color: #2E445C; font-weight: bold; font-size: 20px; }
.CS_Value_Closer { max-width: 900px; margin: 34px auto 0 auto; font-size: 18px; line-height: 1.5; color: #2E445C; text-align: center; font-weight: 600; }
@media (max-width: 700px) { .CS_Value_List { grid-template-columns: 1fr; } }