:root {
    --ac-navy: #023c61;
    --ac-blue: #54a4d5;
    --ac-blue-soft: rgba(84, 164, 213, 0.14);
    --ac-border: rgba(15, 23, 42, 0.12);
    --ac-shadow: 0 1rem 2.5rem rgba(15, 23, 42, 0.08);
    --ac-radius: 1rem;
    scroll-behavior: smooth;
}

body .btn {
    --bs-border-radius-lg: 0;
}

h1 {
    color: var(--bs-heading-color);
}

.no-transitions *, .no-transitions *::before, .no-transitions *::after {
    transition: none !important;
}

.visually-hidden-focusable:not(:focus) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

#finHome .shadow {
    box-shadow: 0 0 4px #000 !important;
}

#finHome .bg-primary {
    background: oklch(from var(--color-primary) l c h / var(--bs-bg-opacity)) !important;
}

#finHome .bg-secondary {
    background: oklch(from var(--color-secondary) l c h / var(--bs-bg-opacity)) !important;
}

#finHome .btn-secondary {
    background: oklch(from var(--color-secondary) l c h) !important;
}

    #finHome .btn-secondary:hover {
        background: oklch(from var(--color-primary) l c h) !important;
    }

#finHome .color-primary {
    color: oklch(from var(--color-primary) l c h) !important;
}

#finHome .color-secondary {
    color: oklch(from var(--color-secondary) l c h) !important;
}

.callout-items .btn-trial {
    flex-basis: 100%;
}

.bg-secondary .mcLogo {
    height: 3em;
}

#finHome .site-header {
    background: oklch(from var(--color-bg-light) l c h / .5) !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    height: auto;
    backdrop-filter: blur(2px)
}

[data-bs-theme="dark"] #finHome .site-header {
    border-bottom-color: #0001;
}

.navbar-brand {
    padding: 0 .5rem;
    overflow: visible !important;
    text-shadow: 0 0 0 #0000;
}

    .navbar-brand:hover {
        background: oklch(from var(--color-primary) l c h / .5);
        border-radius: 0.25rem;
    }

    .navbar-brand span {
        font: normal .8rem/.9rem Montserrat, 'Avenir Next', 'Segoe UI', Arial, sans-serif;
    }

    .navbar-brand .color-secondary {
        font-weight: 900;
        font-size: .9rem;
    }

    .navbar-brand .color-primary {
        letter-spacing: .15rem;
    }

[data-bs-theme="dark"] .navbar-brand span {
    text-shadow: 0 0 4px #000;
}

[data-bs-theme="dark"] .navbar-brand:hover span {
    text-shadow: 0 0 0 #0000;
}


#smallFont {
    display: none;
}

#heroCont > p > span.bg-primary {
    box-shadow: inset 0 0 3px var(--color-primary), inset 0 0 3px var(--color-primary);
}

[data-bs-theme="dark"] #heroCont > p > span.bg-primary {
    --bs-bg-opacity: .25;
}

:is(#heroCont, .callout-items) .bg-secondary:not(.btn) {
    user-select: none;
    display: flex;
    gap: 1ch;
    padding: .5rem 0 .5rem .5rem;
    border-radius: 10em;
    align-items: center;
    min-width: 38ch;
    max-width: 42ch;
    font-size: .85em;
    font-weight: 700;
    text-align: left;
    color: var(--color-text-light)
}

:is(#heroCont, .callout-items) .bg-secondary a {
    color: var(--color-primary);
    text-decoration: none !important;
}

    :is(#heroCont, .callout-items) .bg-secondary a:hover {
        color: var(--color-text-light);
        text-decoration: underline !important;
    }

#heroCont .bg-secondary {
    width: auto;
}

#heroCont ul li {
    line-height: 2rem;
}

    #heroCont ul li:is(li,::marker) {
        font-size: 1.2rem;
    }

    #heroCont ul li .bg-secondary {
        font-size: .85rem !important;
        line-height: .85rem;
    }

        #heroCont ul li .bg-secondary .mcLogo {
            height: 2rem;
        }

    #heroCont ul li:first-child > div {
        gap: 1ch;
    }

    #heroCont ul li:first-child .mcdc {
        font-size: .6rem !important;
        min-width: 40ch;
        margin-left: 1ch;
    }

        #heroCont ul li:first-child .mcdc img {
            height: 1.5rem;
        }

    #heroCont ul li > div {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1ch;
    }

#heroCont ul li {
    padding-bottom: .85rem;
    margin-bottom: .85rem;
    border-bottom: 1px solid rgba(107, 114, 128, .28);
}

    #heroCont ul li:last-child {
        padding-bottom: 0;
        margin-bottom: 0;
        border-bottom: 0;
    }

[data-bs-theme="dark"] #heroCont ul li {
    border-bottom-color: rgba(148, 163, 184, .22);
}

#heroCont #seriously {
    font-size: 1.5rem;
}

#iconPhone {
    width: 2rem;
    height: 4rem;
    max-width: 100%;
    -webkit-user-select: none;
    user-select: none;
    opacity: .75;
    transition: opacity 1s;
    container-type: size;
}

    #iconPhone .phone-shell, #calcTainer .tab-shell {
        display: block;
        position: relative;
        width: 100%;
        height: 100%;
        margin: 0 auto;
        border-radius: 18cqi;
        background: #0f172a;
        border: 0.32cqi solid #1e293b;
        transform: rotate(-12deg);
        overflow: hidden;
    }

    #iconPhone .phone-shell {
        box-shadow: 0 .25rem 1rem #000a;
    }

        #iconPhone .phone-shell::before {
            content: "";
            position: absolute;
            top: 4.9cqi;
            left: 50%;
            width: 27.9cqi;
            height: 3.3cqi;
            border-radius: 999px;
            background: #94a3b8;
            transform: translateX(-50%);
        }

        #iconPhone .phone-shell::after {
            content: "";
            position: absolute;
            bottom: 5.9cqi;
            left: 50%;
            width: 8.5cqi;
            height: 8.5cqi;
            border-radius: 50%;
            background: #475569;
            transform: translateX(-50%);
        }

    #iconPhone .phone-screen {
        display: block;
        position: absolute;
        inset: 13.1cqi 6.9cqi 16.4cqi;
        border-radius: 13.1cqi;
        background: #f8fafc;
        padding: 8.2cqi;
    }

    #iconPhone .phone-header {
        display: block;
        margin-bottom: 8.5cqi;
        padding: 5.2cqi 6.6cqi;
        border-radius: 6.6cqi;
        background: var(--color-primary);
        color: var(--color-text-light);
        font-size: 6.9cqi;
        font-weight: 700;
        line-height: 1.15;
        text-align: center;
    }

    #iconPhone .phone-title {
        display: block;
        margin-bottom: 4.3cqi;
        font-size: 7.5cqi;
        font-weight: 700;
        line-height: 1.2;
    }

    #iconPhone .phone-divider {
        display: block;
        height: 1px;
        margin-bottom: 5.6cqi;
        background: #cbd5e1;
    }

    #iconPhone .phone-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 2.6cqi 0;
        color: #475569;
        font-size: 6.2cqi;
        line-height: 1.2;
        border-bottom: 1px solid #e2e8f0;
    }

        #iconPhone .phone-row:last-of-type {
            border-bottom: 0;
            margin-bottom: 6.6cqi;
        }

    #iconPhone .phone-profit-label {
        color: #475569;
    }

    #iconPhone .phone-income {
        color: #166534;
    }

    #iconPhone .phone-expense {
        color: #b91c1c;
    }

    #iconPhone .phone-profit {
        color: #0369a1;
        font-weight: 700;
    }

    #iconPhone .phone-chart {
        display: block;
        position: relative;
        height: 31.1cqi;
        border-radius: 6.9cqi;
        background: var(--color-secondary);
    }

        #iconPhone .phone-chart svg {
            position: absolute;
            inset: 3cqi;
            width: calc(100% - 6cqi);
            height: calc(100% - 6cqi);
        }

        #iconPhone .phone-chart polyline,
        #iconPhone .phone-chart circle {
            fill: var(--color-primary);
            stroke: var(--color-primary);
        }

html:not(.no-transitions) #iconPhone :is(.phone-shell, .phone-shell::before, .phone-shell::after, .phone-screen, .phone-header, .phone-title, .phone-divider, .phone-row, .phone-profit-label, .phone-income, .phone-expense, .phone-profit, .phone-chart, .phone-chart polyline, .phone-chart circle) {
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, fill 180ms ease, stroke 180ms ease;
}

[data-bs-theme="dark"] #iconPhone .phone-shell, [data-bs-theme="dark"] #calcTainer {
    background: #020617;
    border-color: #334155;
}

    [data-bs-theme="dark"] #iconPhone .phone-shell::before {
        background: #64748b;
    }

    [data-bs-theme="dark"] #iconPhone .phone-shell::after {
        background: #94a3b8;
    }

[data-bs-theme="dark"] #iconPhone .phone-screen {
    background: #111827;
}

[data-bs-theme="dark"] #iconPhone .phone-divider {
    background: #334155;
}

[data-bs-theme="dark"] #iconPhone .phone-row {
    color: #94a3b8;
    border-bottom-color: #1e293b;
}

[data-bs-theme="dark"] #iconPhone .phone-profit-label {
    color: #94a3b8;
}

[data-bs-theme="dark"] #iconPhone .phone-income {
    color: #86efac;
}

[data-bs-theme="dark"] #iconPhone .phone-expense {
    color: #fca5a5;
}

[data-bs-theme="dark"] #iconPhone .phone-profit {
    color: #7dd3fc;
}

#calcTainer {
    cursor: pointer;
    padding: 0 !important;
    border-radius: .9rem !important;
    position: relative;
    z-index: 9;
    margin-bottom: 2.5ch;
    border: 1px solid #1e293b;
    rotate: 3deg;
}

    #calcTainer::before {
        content: " ";
        position: absolute;
        left: .75rem;
        top: 50%;
        z-index: 999;
        translate: 0 -50%;
        background: #fff;
        height: .5rem;
        border-radius: 1rem;
        width: .25rem;
        display: inline-block;
    }

    #calcTainer .tab-shell {
        padding: .32cqi;
        transform: rotate(0deg);
        border-radius: .5rem;
        border-width: 0;
    }

    #calcTainer .calc-ista-panel {
        display: grid;
        gap: .35rem;
        width: 13.5rem;
        padding: .5rem .55rem .45rem;
        border-radius: .9rem;
        background: #000;
        border: 1px solid rgba(148, 163, 184, .18);
        box-shadow: 0 14px 28px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.03);
        color: #f8fafc;
        translate: 1ch 1ch;
        user-select: none;
        font-family: Montserrat, 'Avenir Next', 'Segoe UI', Arial, sans-serif;
        overflow: hidden;
    }

    #calcTainer .calc-ista-table {
        display: grid;
        gap: .08rem;
        font: 700 .32rem/1.15 Cousine, "Courier New", monospace;
        color: #54a4d5;
    }

    #calcTainer .calc-ista-row {
        display: grid;
        grid-template-columns: 1.8fr repeat(5, minmax(0, 1fr));
        gap: .16rem;
        align-items: center;
        padding: .15rem .18rem;
        border-top: 1px solid rgba(148, 163, 184, .14);
    }

        #calcTainer .calc-ista-row span {
            text-align: center;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    #calcTainer .calc-ista-row-label {
        text-align: left !important;
        color: #cbd5e1;
        font-family: Montserrat, 'Avenir Next', 'Segoe UI', Arial, sans-serif;
    }

    #calcTainer .calc-ista-months {
        border-top: 0;
        padding-top: .08rem;
        color: #54a4d5;
        font-weight: 800;
    }

        #calcTainer .calc-ista-months .calc-ista-row-label {
            color: #f8fafc;
            font-size: .3rem;
            letter-spacing: .02em;
        }

    #calcTainer .calc-ista-section {
        padding: .08rem .18rem 0;
        color: #f8fafc;
        font: 600 .52rem/1 Montserrat, 'Avenir Next', 'Segoe UI', Arial, sans-serif;
    }

    #calcTainer .calc-ista-total .calc-ista-row-label {
        color: #f8fafc;
        font-style: italic;
        font-weight: 800;
    }

    #calcTainer .calc-ista-net .calc-ista-row-label {
        color: #00a000;
    }

    #calcTainer .calc-ista-net span:not(.calc-ista-row-label):nth-child(2) {
        color: #00a000;
    }

    #calcTainer .calc-ista-net span:not(.calc-ista-row-label):nth-child(3) {
        color: #ff2f2f;
    }

    #calcTainer .calc-ista-net span:not(.calc-ista-row-label):nth-child(4) {
        color: #00a000;
    }

    #calcTainer .calc-ista-net span:not(.calc-ista-row-label):nth-child(5) {
        color: #ff2f2f;
    }

    #calcTainer .calc-ista-net span:not(.calc-ista-row-label):nth-child(6) {
        color: #00a000;
    }

.bg-secondary .bg-secondary {
    box-shadow: 0 0 4px var(--color-bg-dark);
}

.signup-open {
    padding: .5rem 4rem;
}

.hero-section, :is(#how-it-works, #how-it-works + section) > div {
    width: min(90%, 100%)
}

.hero-section {
    position: relative;
    margin-top: -2rem;
}

    .hero-section video {
        opacity: 40%;
        z-index: 1;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        width: 100%
    }

[data-bs-theme="dark"] .hero-section video {
    opacity: 30%;
}

.hero-section #heroCont {
    position: relative;
    z-index: 4;
    border-radius: 5em;
}

.hero-section .lead {
    font-size: 1.1rem;
}

.card-soft, .faq-item {
    border: 1px solid var(--ac-border);
    border-radius: var(--ac-radius);
    box-shadow: var(--ac-shadow);
}

.card-soft {
    background: rgba(255, 255, 255, 0.96);
}

[data-bs-theme="dark"] .card-soft, [data-bs-theme="dark"] .faq-item, [data-bs-theme="dark"] .list-group-item {
    background: rgba(15, 23, 42, 0.86);
    border-color: rgba(148, 163, 184, 0.16);
    color: inherit;
}

.eyebrow {
    display: inline-flex;
    gap: .5rem;
    padding: .7rem 1rem;
    border: 1px solid color-mix(in oklab, var(--color-primary), white 75%);
    border-radius: 999px;
    background: color-mix(in oklab, var(--color-primary), white 93%);
    color: var(--color-primary);
    font-size: .9rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.icon-badge {
    width: 3rem;
    height: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.9rem;
    background: var(--ac-blue-soft);
    color: var(--ac-navy);
    font-size: 1.35rem;
}

[data-bs-theme="dark"] .icon-badge {
    color: #8fd8ff;
}

[data-bs-theme="dark"] #finHome .step-card {
    background: rgba(15, 23, 42, 0.86);
    border-color: rgba(148, 163, 184, 0.16);
    color: inherit;
}

[data-bs-theme="dark"] #finHome .trial-banner {
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.92));
    border-color: rgba(148, 163, 184, 0.22);
}

#finHome .trust-row {
    max-width: 52rem;
}

#finHome .trust-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: .95rem;
    font-weight: 600;
    white-space: normal;
    --icon-size: 2rem;
}

    #finHome .trust-item i {
        color: var(--color-primary);
        /*        margin-right: .5rem;*/
        font-size: var(--icon-size);
        flex: 0 0 auto;
    }

    #finHome .trust-item img {
        height: var(--icon-size);
    }

#finHome .trust-row .col:not(:last-child) .trust-item {
    padding-right: 1rem;
    border-right: 1px solid var(--ac-border);
}

#finHome .step-card {
    position: relative;
    display: grid;
    gap: .5rem;
    padding: 1.1rem;
    border: 1px solid var(--ac-border);
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, .88);
    box-shadow: var(--ac-shadow);
    grid-template-columns: 2.25rem 1fr;
}

#finHome .step-arrow {
    position: absolute;
    top: 50%;
    left: -1.35rem;
    width: 2.7rem;
    height: 2.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /*    border: 1px solid var(--ac-border);*/
    border-radius: 999px;
    /*    background: var(--color-bg-light);*/
    color: var(--color-primary);
    /*    box-shadow: 0 .5rem 1.25rem rgba(15, 23, 42, .08);*/
    transform: translateY(-50%);
    z-index: 2;
}

#finHome .step-badge {
    width: 2.25rem;
    height: 2.25rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: var(--color-primary);
    color: var(--color-text-light);
    font-weight: 800;
}

#finHome .step-right {
    display: flex;
    align-items: center;
    gap: .5rem
}

    #finHome .step-right i {
        font-size: 4rem;
    }

#finHome .trial-banner {
    border: 1px solid color-mix(in oklab, var(--color-primary), white 80%);
    background: linear-gradient(135deg, color-mix(in oklab, var(--color-primary), white 96%), #fff);
    box-shadow: var(--ac-shadow);
}

    #finHome .trial-banner .signup-open {
        width: 100%;
    }

#finHome .trial-icon {
    flex: 0 0 auto;
    width: 6rem;
    height: 6rem;
    display: inline-grid;
    place-items: center;
    /*border-radius: 999px;
    background: color-mix(in oklab, var(--color-primary), white 82%);*/
    color: var(--color-primary);
    font-size: 1.5rem;
}

    #finHome .trial-icon img {
        width: 100%;
        height: 100%;
    }

#preview {
    width: 100%;
    min-height: 0;
    padding: 0;
    position: relative;
    bottom: auto;
    z-index: 1;
    overflow: visible;
    scale: .8;
    margin: -2rem;
}

    #preview .scene {
        position: relative;
        width: min(100%, 720px);
        margin: 0 auto;
        aspect-ratio: 1.22 / 1;
    }

    #preview .laptop {
        position: absolute;
        inset: 0;
        transform: rotateX(12deg);
    }

    #preview .laptop-frame {
        position: absolute;
        left: 8%;
        right: 8%;
        top: 13%;
        bottom: 9.5%;
        padding: 1rem;
        border-radius: 1.5rem 1.5rem 1.1rem 1.1rem;
        background: linear-gradient(145deg, #1f2937, #0f172a);
        box-shadow: 0 2rem 4rem rgba(15, 23, 42, .22), inset 0 1px 0 rgba(255,255,255,.08);
    }

        #preview .laptop-frame::before {
            content: "";
            position: absolute;
            top: .55rem;
            left: 50%;
            width: .5rem;
            height: .5rem;
            border-radius: 50%;
            background: rgba(255, 255, 255, .28);
            transform: translateX(-50%);
        }

    #preview .laptop-screen {
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: .9rem;
        background: #f8fafc;
        box-shadow: 0 .5rem 4rem oklch(from var(--dcolor-bg-dark) l c h / .9), inset 0 1px 0 rgba(255,255,255,.06);
    }

        #preview .laptop-screen img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: top center;
            display: block;
        }

    #preview .laptop-base {
        position: absolute;
        left: 50%;
        bottom: 5%;
        width: 98%;
        height: 5%;
        transform: translateX(-50%);
        border-radius: 0 0 1rem 1rem;
        background: linear-gradient(180deg, #8b95a1, #606a76);
        box-shadow: 0 .5rem 4rem oklch(from var(--dcolor-bg-dark) l c h / .9), inset 0 1px 0 rgba(255,255,255,.06);
    }

        #preview .laptop-base::before {
            content: "";
            position: absolute;
            left: 50%;
            top: 0;
            width: 42%;
            height: .3rem;
            border-radius: 0 0 99px 99px;
            background: #fff6;
            background: rgba(255, 255, 255, .28);
            transform: translateX(-50%);
        }

    #preview .tablet {
        position: absolute;
        right: 0%;
        top: 38%;
        width: 30%;
        max-width: 230px;
        transform: rotateX(22deg) rotateY(-3deg) rotateZ(12deg);
        z-index: 3;
    }

    #preview .tablet-frame {
        position: relative;
        width: 100%;
        aspect-ratio: 220 / 315;
        padding: .75rem;
        border-radius: 1rem;
        box-shadow: 0 0 5px #fff;
        background: linear-gradient(145deg, #262b32, #0f1216);
        box-shadow: 0 .5rem 4rem oklch(from var(--dcolor-bg-dark) l c h / .9), inset 0 1px 0 rgba(255,255,255,.06);
    }

        #preview .tablet-frame::after {
            content: "";
            position: absolute;
            bottom: .5rem;
            left: 50%;
            width: 22px;
            height: 22px;
            border: 2px solid rgba(255,255,255,.18);
            border-radius: 50%;
            transform: translateX(-50%);
        }

    #preview .tablet-screen {
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: .75rem;
        background: #f8fafc;
    }

        #preview .tablet-screen img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: top center;
        }

    #preview .phone {
        position: absolute;
        left: 1%;
        top: 40%;
        width: 20%;
        max-width: 150px;
        transform: rotateX(-20deg) rotateY(3deg) rotateZ(-12deg);
        z-index: 4;
    }

    #preview .phone-frame {
        position: relative;
        width: 100%;
        aspect-ratio: 150 / 300;
        padding: .55rem;
        border-radius: 1rem;
        box-shadow: 0 0 5px #fff;
        background: linear-gradient(145deg, #2a2e35, #0f1216);
        box-shadow: 0 .5rem 4rem oklch(from var(--dcolor-bg-dark) l c h / .9), inset 0 1px 0 rgba(255,255,255,.06);
    }

    #preview .phone-screen {
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: .5rem;
        background: #f8fafc;
    }

        #preview .phone-screen img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: top center;
        }

    #preview .phone-notch {
        position: absolute;
        top: .35rem;
        left: 50%;
        width: 58%;
        height: 10px;
        background: #0b0d10;
        border-radius: 0 0 12px 12px;
        transform: translateX(-50%);
        z-index: 2;
    }

.cta-panel {
    background: linear-gradient(135deg, rgba(2, 60, 97, 0.96), rgba(84, 164, 213, 0.95));
    color: #fff;
}

.footer-links a {
    text-decoration: none;
}

.accordion-button:not(.collapsed) {
    box-shadow: none;
}

.list-group-item {
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
}

.audience-section {
    background: linear-gradient(180deg, rgba(84, 164, 213, 0.06), rgba(255, 255, 255, 0));
}

.audience-kicker {
    letter-spacing: .08em;
}

.audience-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.audience-card {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border-radius: 16px;
    border: 1px solid rgba(2, 60, 97, 0.16);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.08), 0 2px 10px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    height: 100%;
}

    .audience-card::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 4px;
        background: linear-gradient(180deg, rgba(2, 60, 97, 0.95), rgba(2, 60, 97, 0.2));
    }

.audience-icon {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(2, 60, 97, 0.08);
    border: 1px solid rgba(2, 60, 97, 0.18);
    color: var(--ac-navy);
    font-size: 1.15rem;
}

.audience-card p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    font-weight: 600;
    color: #0b1220;
}

.mc-connect-badge {
    background: var(--color-secondary) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1ch;
    padding: .75rem 1.1rem;
    border-radius: 999px;
    font-size: .95rem;
    font-weight: 700;
    color: var(--color-text-light);
    text-decoration: none;
    min-width: 0;
    box-shadow: var(--ac-shadow);
}

    .mc-connect-badge:hover {
        color: var(--color-text-light);
        text-decoration: none;
        transform: translateY(-1px);
    }

    .mc-connect-badge .mcLogo {
        height: 2.25rem;
        width: auto;
    }

[data-bs-theme="dark"] .audience-card {
    background: rgba(15, 23, 42, 0.86);
    border-color: rgba(148, 163, 184, 0.16);
}

    [data-bs-theme="dark"] .audience-card p {
        color: #e2e8f0;
    }

[data-bs-theme="dark"] .audience-icon {
    color: #8fd8ff;
}

.fit {
    -o-object-fit: contain;
    object-fit: contain
}

.fill {
    -o-object-fit: fill;
    object-fit: fill
}

.cover {
    -o-object-fit: cover;
    object-fit: cover
}

p, h1, h2, h3, h4, h5, h6, .text-wrap-balance {
    text-wrap: balance;
}

#testimonials .container {
    padding-right: 0;
    padding-left: 0;
}

#testimonialCarousel {
    width: auto;
    display: inline-block;
    max-width: 100%;
    margin: 0 auto;
}

    #testimonialCarousel .carousel-inner {
        display: grid;
        width: auto;
        max-width: 100%;
    }

    #testimonialCarousel .carousel-item {
        width: auto;
        margin: 0 auto;
        clear: both;
    }

        #testimonialCarousel .carousel-item > div {
            display: inline-block;
            width: auto;
            max-width: 100%;
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

#plans #tblPricing tr {
    line-height: 2rem !important;
}

#PLDemo {
    --pl-trans-timer: 500ms;
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 1060;
    width: min(865px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    translate: -50% -50%;
    display: grid;
    place-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: scale(0.98);
    transition: opacity var(--pl-trans-timer) ease, transform var(--pl-trans-timer) ease, visibility 0s linear var(--pl-trans-timer);
}

    #PLDemo.show {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: scale(1);
        transition: opacity var(--pl-trans-timer) ease, transform var(--pl-trans-timer) ease;
    }

    #PLDemo svg {
        display: block;
        width: 100%;
        height: auto;
        max-width: 865px;
        border-radius: 2rem;
        max-height: calc(100vh - 2rem);
    }

.pl-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(2, 6, 23, 0.72);
    backdrop-filter: blur(4px);
    opacity: 0;
    pointer-events: none;
    transition: opacity calc(var(--pl-trans-timer) * 2) ease;
}

    .pl-backdrop.show {
        opacity: 1;
        pointer-events: auto;
    }

.signup-dialog {
    position: fixed;
    inset: 0;
    z-index: 1070;
    display: grid;
    place-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--pl-trans-timer) ease, visibility 0s linear var(--pl-trans-timer);
}

    .signup-dialog.show {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity var(--pl-trans-timer) ease;
    }

.signup-dialog-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 6, 23, 0.65);
    backdrop-filter: blur(4px);
}

.signup-dialog-panel {
    position: relative;
    width: min(620px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    overflow: auto;
    padding: 2.25rem 2rem 1.75rem;
    border: 6px solid var(--color-primary);
    border-radius: 24px;
    background: var(--color-bg-light);
    color: var(--color-text);
    box-shadow: 0 1.5rem 3rem rgba(0,0,0,.35);
    z-index: 1;
}

    .signup-dialog-panel h2 {
        margin: 0 0 .75rem;
        font-size: clamp(1.9rem, 4vw, 2.7rem);
        line-height: 1.05;
        text-align: center;
        color: var(--color-primary);
    }

.signup-dialog-subtitle {
    margin: 0 0 1.5rem;
    text-align: center;
    font-size: 1.15rem;
}

.signup-dialog-close {
    position: absolute;
    top: .6rem;
    right: .6rem;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: 999px;
    background: var(--color-primary);
    color: var(--color-bg-light);
    font-size: 1.4rem !important;
    line-height: 2rem !important;
}

.signup-dialog form {
    display: grid;
    gap: 1rem;
}

.signup-dialog label {
    display: grid;
    gap: .45rem;
    font-weight: 700;
}

.signup-dialog input {
    width: 100%;
    min-height: 48px;
    padding: .75rem 1rem;
    border: 1px solid color-mix(in oklab, var(--color-bg-dark), transparent 10%);
    font: inherit;
    background: color-mix(in oklab, var(--color-primary), white 8%);
    color: inherit;
}

    .signup-dialog input:focus {
        background: color-mix(in oklab, var(--color-secondary), white 8%);
    }

[--data-bs-theme="dark"] .signup-dialog input {
    background: color-mix(in oklab, var(--color-surface-1), white 8%);
}

.signup-submit {
    min-height: 56px;
    margin-top: .5rem;
    border: 0;
    border-radius: 8px;
    background: var(--color-primary);
    color: var(--color-text-light);
    font-size: 1.1rem;
    font-weight: 800;
}

footer #logo {
    min-height: 150px;
    max-width: min(500px,calc(100vw - 4rem));
    aspect-ratio: 3.12/1;
    background: #0008;
    margin-bottom: 1.5rem !important;
    padding: 1rem;
    border-radius: 1rem;
}

    footer #logo:hover {
        background: oklch(from var(--color-primary) l c h / .5);
    }

    footer #logo svg {
        width: 100%;
        height: 100%;
    }

    footer #logo img {
        object-fit: contain;
        width: 100%;
        height: 100%;
    }

@media (max-width: 500px) {
    .signup-dialog-panel {
        padding: 1.75rem 1rem 1.25rem;
        border-width: 4px;
        border-radius: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html:not(.no-transitions) #iconPhone :is(.phone-shell, .phone-shell::before, .phone-shell::after, .phone-screen, .phone-header, .phone-title, .phone-divider, .phone-row, .phone-profit-label, .phone-income, .phone-expense, .phone-profit, .phone-chart, .phone-chart polyline, .phone-chart circle) {
        transition: none;
    }
}
/* portrait tablet width */
@media (max-width: 767px) {
    #finHome .navbar-brand {
        margin-right: 0;
    }

    #calcTainer {
        position: relative;
    }

        #calcTainer::after {
            content: "Tap to view";
            position: absolute;
            right: .15rem;
            bottom: -1.2rem;
            padding: .2rem .45rem;
            border-radius: 999px;
            background: var(--color-secondary);
            color: var(--color-text-light);
            font: 700 .55rem/1 Montserrat, 'Avenir Next', 'Segoe UI', Arial, sans-serif;
            letter-spacing: .06em;
            text-transform: uppercase;
            rotate: -3deg;
        }

    [data-bs-theme="dark"] #calcTainer::after {
        color: var(--color-primary);
    }

    .audience-grid {
        grid-template-columns: 1fr;
    }

    .bg-secondary,
    .mc-connect-badge {
        min-width: 0;
        padding: 1rem 1.1rem;
        text-align: center;
        justify-content: center;
    }

    .hero-section .fill-flex {
        margin-bottom: 1em;
        flex-basis: 100%;
        justify-content: center;
    }

    .hero-section .row.g-5 {
        --bs-gutter-y: 1.5rem;
    }

    #finHome .trust-row {
        max-width: none;
        gap: .75rem 0;
    }

        #finHome .trust-row .col {
            flex: 0 0 50%;
            max-width: 50%;
        }

    #finHome .trust-item {
        justify-content: center;
        white-space: normal;
        text-align: center;
    }

    #preview .scene {
        width: min(100%, 560px);
    }

    #finHome .trust-row .col:not(:last-child) .trust-item {
        padding-right: 0;
        border-right: 0;
    }

    .trial-banner .btn {
        width: 100%;
    }

    #how-it-works,
    main > section.py-2.pb-5 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }

        #how-it-works .container {
            padding-top: 0;
        }
}
/* phone width */
@media (max-width: 500px) {
    #heroCont > p > span {
        transition: width 1s;
        width: min-content;
    }

    #finHome .navbar-brand {
        margin-right: -2ch;
        justify-self: center;
    }
}
/* no phones are this small anymore tbh */
@media (max-width: 380px) {
    #finHome .navbar-brand {
        margin: 0 auto;
        justify-self: center;
    }
}

@media (min-width: 993px) {
    [id] {
        scroll-margin-top: 4rem;
    }
}
/* print */
@media print {
    .site-header {
        display: none;
    }

    #finHome footer {
        background: transparent !important;
    }
}