.elementor-30245 .elementor-element.elementor-element-699bb9d4{--display:flex;}.elementor-30245 .elementor-element.elementor-element-182cde66{--display:flex;}.elementor-30245 .elementor-element.elementor-element-367a5b5e{--display:flex;}.elementor-30245 .elementor-element.elementor-element-3c7f876b{--display:flex;}.elementor-30245 .elementor-element.elementor-element-10c06185{--n-menu-dropdown-content-max-width:initial;--n-menu-heading-wrap:wrap;--n-menu-heading-overflow-x:initial;--n-menu-toggle-icon-wrapper-animation-duration:500ms;--n-menu-title-font-size:var(--font-sm);--n-menu-title-color-normal:var( --e-global-color-text );--n-menu-title-transition:300ms;--n-menu-title-padding:0px 0px 0px 0px;--n-menu-icon-size:16px;--n-menu-toggle-icon-size:20px;--n-menu-toggle-icon-hover-duration:500ms;--n-menu-toggle-icon-distance-from-dropdown:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for mega-menu, class: .elementor-element-10c06185 */.elementor-30245 .elementor-element.elementor-element-10c06185 .e-n-menu-title-text {
    color: var(--body-grey) !important;
}/* End custom CSS */
/* Start custom CSS *//* =====================================================
   RESET
   ===================================================== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

/* Root element */
:where(body){
    /* https://fluidtypography.com/ */
    /* Base sizing */
    --min-vi: 460;
    --max-vi: 1600;
    --min-root-font-size: 16;
    --max-root-font-size: 20;

    /* m = (y2 - y1) / (x2 - x1) */
    --rise: calc(var(--max-root-font-size) - var(--min-root-font-size));
    --run: calc(var(--max-vi) - var(--min-vi));
    --slope: calc(var(--rise) / var(--run));
    
    /* Due to the way addition and subtraction works in calc(),
    we need to "type cast" --min-vi and --min-root-font-size to appropriate units */
    --min-vi-px: calc(var(--min-vi) * 1px);
    --min-root-font-size-px: calc(var(--min-root-font-size) * 1px);

    /* y - y1 = m(x - x1) */
    --fluid-root-font-size-px:
    calc(
      var(--slope) * (100vi - var(--min-vi-px)) + var(--min-root-font-size-px)
    );

    /* "Type cast" --max-vi to px */
    --max-root-font-size-px: calc(var(--max-root-font-size) * 1px);

    --root-font-size:
        clamp(
            var(--min-root-font-size-px),
            var(--fluid-root-font-size-px),
            var(--max-root-font-size-px)
        );
        

    font-size: var(--root-font-size);
    /* Temp workaround for Chrone bug */
    --e-global-typography-text-font-size: var(--root-font-size);
}

body{
    font-family: var(--font);
    line-height: 1.5;
    color: var(--dark);
    background: var(--white);
    -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}


.elementor {
    /* Typography scale per brand spec */
    h1 {
        font-size:clamp(2em,5vw,2.875em);
        font-weight:700;
        line-height:1.08;
        color:var(--dark);
    }
    h2 {
        font-size:clamp(1.625em,4vw,2.375em);
        font-weight:400;
        line-height:1.14;
        color:var(--dark);
    }
    h3 {
        font-size:clamp(1.375em,3vw,2em);
        font-weight:400;
        line-height:1.2;
        color:var(--dark);
    }
    h4 {
        font-size:clamp(1.125em,2.5vw,1.625em);
        font-weight:400;
        line-height:1.25;
        color:var(--dark);
    }
    
    p {
        color:var(--body-grey);
        line-height:1.6;
        margin-bottom:1em;
    }
    p:last-child{
        margin-bottom:0;
    }
    
    a {
        color:var(--blue);
        text-decoration:none;
    }
    a:hover {
        text-decoration:underline;
    }
    .intro-text {
        color: var(--dark);
    }
}

.elementor {
    .wrap, .wrap-lg {
        display: grid;
        justify-content: center;
    }
    .wrap {
        grid-template-columns: min(100%, var(--container));
    }
    .wrap-lg {
        grid-template-columns: min(100%, var(--container-lg));
    }
    .intro-text {
        display: grid !important;
        grid-template-columns: min(100%, var(--container-sm));
    }
    .list-tick:before {
                    content: "✓";
            color: var(--mint);
            font-weight: 800;
            flex-shrink: 0;
    }
    .list-cross:before {
                    content: "-";
            color: #bbb;
            font-weight: 800;
            flex-shrink: 0;
    }
    .compare-cell em {
        color: var(--body-grey);
        font-style: italic;
    }
    .quote-author {
        strong {
            color: var(--dark);
            font-size: 1.1em;
        }
    }
}
.nav .e-n-menu-heading {
    gap: var(--container-gap);
    
    .e-n-menu-title:not(.e-current):not(:hover) .e-n-menu-title-container .e-n-menu-title-text {
            color: var(--mint);
            font-weight: 800;
    }
    a:hover {
        color: var(--dark);
        text-decoration: none;
    }
}
.intro-section {
    h2 {
        font-size: clamp(20px, 2.8vw, 30px);
        font-weight: 900;
        line-height: 1.2;
    }
}
.checklist {
    
    padding-bottom: 1em;
    border-bottom: 1px solid var(--line);

    .elementor-icon {
        flex-shrink: 0;
        width: 2.1666em;
        height: 2.1666em;
        margin-top: 0.25em;
        background: var(--amber);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 800;
        font-size: 0.75em;
        color: var(--dark);
    }
    .elementor-icon-box-description {
        padding-top: 0.333em;
        font-size: 0.95em;
        color: var(--body-grey);
    }
}
.checklist:last-of-type {
    border: none;
}

.card {
    .pros, .cons {
        font-size: 0.825em;
        color: var(--body-grey);
        line-height: 1.5;
        display: flex;
        inset-block-start: var(0.3em, initial);
        position: relative;
    }
    .pros .elementor-icon-list-icon {
        fill: var(--mint);
    }
    .cons .elementor-icon-list-icon {
        fill: #bbb;
    }
    .elementor-icon-list-icon svg {
        height: 0.75em;
        width: 0.75em;
    }
}
.section-dark {
    .eyebrow {
        color: var(--amber);
    }
    h2, h3, h4 {
        color: var(--white);
    }
    .intro-text {
        color: rgba(255, 255, 255, .65);
    }
}
.elementor .card-dark {
    border-top: 0.25em solid var(--amber);
    
    h4 {
        color: var(--white);
    }
    p {
        color: var(--white);
        opacity: 0.6;
    }
}/* End custom CSS */