/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Layout scoped CSS — boilerplate removed. All layout styles live in wwwroot/app.css */

/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* NavMenu scoped CSS — boilerplate removed. All sidebar styles live in wwwroot/app.css */


/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-vuq98gur6z],
.components-reconnect-repeated-attempt-visible[b-vuq98gur6z],
.components-reconnect-failed-visible[b-vuq98gur6z],
.components-pause-visible[b-vuq98gur6z],
.components-resume-failed-visible[b-vuq98gur6z],
.components-rejoining-animation[b-vuq98gur6z] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-retrying[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-failed[b-vuq98gur6z],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-vuq98gur6z] {
    display: block;
}


#components-reconnect-modal[b-vuq98gur6z] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-vuq98gur6z 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-vuq98gur6z 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-vuq98gur6z 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-vuq98gur6z]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-vuq98gur6z 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-vuq98gur6z {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-vuq98gur6z {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-vuq98gur6z {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-vuq98gur6z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-vuq98gur6z] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-vuq98gur6z] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-vuq98gur6z] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-vuq98gur6z] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-vuq98gur6z] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-vuq98gur6z] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-vuq98gur6z 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-vuq98gur6z] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-vuq98gur6z {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Marketing page shell ───────────────────────────────────────────────────── */

.mkt-page[b-fqfdfi1odo] {
    min-height: 100vh;
    background: var(--background);
    color: var(--foreground);
    font-family: var(--font-sans, system-ui, sans-serif);
}

.mkt-container[b-fqfdfi1odo] {
    max-width: 88rem;
    margin-inline: auto;
    padding-inline: 1rem;
}

@media (min-width: 640px) {
    .mkt-container[b-fqfdfi1odo] { padding-inline: 1.5rem; }
}
@media (min-width: 1024px) {
    .mkt-container[b-fqfdfi1odo] { padding-inline: 2rem; }
}

/* ── Nav ─────────────────────────────────────────────────────────────────────── */

.mkt-nav[b-fqfdfi1odo] {
    position: sticky;
    top: 0;
    z-index: 40;
    border-bottom: 1px solid color-mix(in oklch, var(--border) 60%, transparent);
    background: color-mix(in oklch, var(--background) 80%, transparent);
    backdrop-filter: blur(12px);
}

.mkt-nav__inner[b-fqfdfi1odo] {
    display: flex;
    height: 4rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.mkt-nav__brand[b-fqfdfi1odo] {
    display: flex;
    align-items: center;
    gap: .625rem;
    text-decoration: none;
    color: var(--foreground);
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -.02em;
}

.mkt-nav__logo[b-fqfdfi1odo] {
    height: 2rem;
    width: 2rem;
    object-fit: contain;
}

.mkt-nav__links[b-fqfdfi1odo] {
    display: none;
    align-items: center;
    gap: 2rem;
    font-size: .875rem;
    font-weight: 500;
    color: var(--muted-foreground);
}

.mkt-nav__links a[b-fqfdfi1odo] { color: inherit; text-decoration: none; }
.mkt-nav__links a:hover[b-fqfdfi1odo] { color: var(--foreground); }

.mkt-nav__actions[b-fqfdfi1odo] {
    display: none;
    align-items: center;
    gap: .5rem;
}

@media (min-width: 768px) {
    .mkt-nav__links[b-fqfdfi1odo]  { display: flex; }
    .mkt-nav__actions[b-fqfdfi1odo] { display: flex; }
}

/* btn helpers for marketing page (won't conflict – scoped) */
.btn-navy[b-fqfdfi1odo] {
    background: var(--navy);
    color: var(--navy-foreground);
    border-color: transparent;
}
.btn-navy:hover[b-fqfdfi1odo] {
    background: color-mix(in oklch, var(--navy) 90%, black);
    color: var(--navy-foreground);
}
.btn-teal[b-fqfdfi1odo] {
    background: var(--teal);
    color: var(--navy);
    border-color: transparent;
}
.btn-teal:hover[b-fqfdfi1odo] {
    background: color-mix(in oklch, var(--teal) 90%, black);
}
.btn-ghost[b-fqfdfi1odo] {
    background: transparent;
    border-color: transparent;
    color: var(--muted-foreground);
}
.btn-ghost:hover[b-fqfdfi1odo] { color: var(--foreground); background: var(--muted); }
.btn-outline-white[b-fqfdfi1odo] {
    background: transparent;
    border: 1px solid rgba(255,255,255,.4);
    color: #fff;
}
.btn-outline-white:hover[b-fqfdfi1odo] { background: rgba(255,255,255,.1); }
.text-teal[b-fqfdfi1odo] { color: var(--teal); }

/* ── Hero ────────────────────────────────────────────────────────────────────── */

.mkt-hero[b-fqfdfi1odo] {
    position: relative;
    overflow: hidden;
}

.mkt-hero__bg-gradient[b-fqfdfi1odo] {
    position: absolute;
    inset: 0;
    z-index: -10;
    background: linear-gradient(135deg, oklch(0.32 0.08 255), oklch(0.55 0.12 220), oklch(0.78 0.12 195));
    opacity: .07;
}

.mkt-hero__bg-radial[b-fqfdfi1odo] {
    position: absolute;
    inset-inline: 0;
    top: 0;
    z-index: -10;
    height: 37.5rem;
    background: radial-gradient(ellipse at top, oklch(0.78 0.12 195 / .18), transparent 60%);
}

.mkt-hero__inner[b-fqfdfi1odo] {
    display: grid;
    align-items: center;
    gap: 3rem;
    padding-block: 4rem 5rem;
}

@media (min-width: 1024px) {
    .mkt-hero__inner[b-fqfdfi1odo] {
        grid-template-columns: 1fr 1fr;
        padding-block-start: 6rem;
    }
}

.mkt-badge[b-fqfdfi1odo] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border: 1px solid color-mix(in oklch, var(--teal) 40%, transparent);
    background: color-mix(in oklch, var(--teal) 10%, transparent);
    border-radius: 9999px;
    padding: .25rem .75rem;
    font-size: .75rem;
    font-weight: 600;
    color: var(--navy);
}

.mkt-hero__logo[b-fqfdfi1odo] {
    width: 220px;
    height: auto;
    margin-bottom: 1.25rem;
    display: block;
}

.mkt-hero__headline[b-fqfdfi1odo] {
    margin-top: 1.25rem;
    font-size: clamp(2rem, 5vw, 3.75rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.03em;
}

.mkt-hero__sub[b-fqfdfi1odo] {
    margin-top: 1.25rem;
    max-width: 36rem;
    font-size: 1.125rem;
    color: var(--muted-foreground);
    line-height: 1.6;
}

.mkt-hero__cta-row[b-fqfdfi1odo] {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 2rem;
}

.mkt-hero__trust-row[b-fqfdfi1odo] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.25rem;
    margin-top: 1.5rem;
    font-size: .75rem;
    color: var(--muted-foreground);
}

/* Hero visual */
.mkt-hero__visual[b-fqfdfi1odo] {
    position: relative;
}

.mkt-hero__visual-glow[b-fqfdfi1odo] {
    position: absolute;
    inset: -1.5rem;
    z-index: -1;
    border-radius: 1.5rem;
    background: linear-gradient(135deg, oklch(0.32 0.08 255), oklch(0.55 0.12 220), oklch(0.78 0.12 195));
    opacity: .2;
    filter: blur(2rem);
}

/* Mock browser */
.mkt-mock-browser[b-fqfdfi1odo] {
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: var(--card);
    box-shadow: 0 25px 50px -12px color-mix(in oklch, var(--navy) 10%, transparent);
    overflow: hidden;
}

.mkt-mock-browser__bar[b-fqfdfi1odo] {
    display: flex;
    align-items: center;
    gap: .375rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in oklch, var(--muted) 50%, transparent);
    padding: .625rem 1rem;
}

.mkt-mock-browser__dot[b-fqfdfi1odo] {
    display: inline-block;
    width: .625rem;
    height: .625rem;
    border-radius: 9999px;
}
.mkt-mock-browser__dot--red[b-fqfdfi1odo]    { background: color-mix(in oklch, var(--destructive) 60%, transparent); }
.mkt-mock-browser__dot--yellow[b-fqfdfi1odo] { background: oklch(0.85 0.15 90 / .6); }
.mkt-mock-browser__dot--green[b-fqfdfi1odo]  { background: oklch(0.75 0.15 145 / .6); }

.mkt-mock-browser__url[b-fqfdfi1odo] {
    margin-left: .75rem;
    font-size: .75rem;
    color: var(--muted-foreground);
}

.mkt-mock-browser__body[b-fqfdfi1odo] { padding: 1.25rem; }

/* Stat row */
.mkt-stat-row[b-fqfdfi1odo] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .75rem;
}

.mkt-stat[b-fqfdfi1odo] {
    border-radius: .75rem;
    padding: .75rem;
}
.mkt-stat--navy[b-fqfdfi1odo] { background: color-mix(in oklch, var(--navy) 5%, transparent); color: var(--navy); }
.mkt-stat--teal[b-fqfdfi1odo] { background: color-mix(in oklch, var(--teal) 10%, transparent); color: var(--navy); }
.mkt-stat--warn[b-fqfdfi1odo] { background: oklch(0.9 0.1 80 / .1); color: var(--foreground); }

.mkt-stat__value[b-fqfdfi1odo] {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -.04em;
}

.mkt-stat__label[b-fqfdfi1odo] {
    margin-top: .125rem;
    font-size: .6875rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--muted-foreground);
}

/* Standings preview */
.mkt-standings-preview[b-fqfdfi1odo] {
    margin-top: 1rem;
    border-radius: .75rem;
    border: 1px solid var(--border);
    overflow: hidden;
}

.mkt-standings-preview__header[b-fqfdfi1odo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border);
    padding: .625rem 1rem;
    font-size: .875rem;
    font-weight: 600;
}

.mkt-standings-preview__round[b-fqfdfi1odo] { font-size: .75rem; color: var(--muted-foreground); }

.mkt-standings-preview__rows[b-fqfdfi1odo] { font-size: .875rem; }

.mkt-standings-preview__row[b-fqfdfi1odo] {
    display: grid;
    grid-template-columns: 1.5rem 1fr repeat(3, 1.5rem) 2.5rem;
    align-items: center;
    padding: .5rem 1rem;
    border-bottom: 1px solid var(--border);
    gap: .25rem;
}
.mkt-standings-preview__row:last-child[b-fqfdfi1odo] { border-bottom: none; }
.mkt-standings-preview__row--hl[b-fqfdfi1odo] { background: color-mix(in oklch, var(--teal) 5%, transparent); }

.mkt-standings-preview__row .pos[b-fqfdfi1odo]  { font-size: .75rem; font-weight: 600; color: var(--muted-foreground); }
.mkt-standings-preview__row .team[b-fqfdfi1odo] { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mkt-standings-preview__row .stat[b-fqfdfi1odo] { text-align: center; font-size: .75rem; color: var(--muted-foreground); }
.mkt-standings-preview__row .pts[b-fqfdfi1odo]  { text-align: right; font-size: .875rem; font-weight: 700; color: var(--navy); }

/* Hero toast */
.mkt-hero__toast[b-fqfdfi1odo] {
    display: none;
    position: absolute;
    bottom: -1.5rem;
    left: -1.5rem;
    width: 14rem;
    border-radius: .75rem;
    border: 1px solid var(--border);
    background: var(--card);
    padding: .75rem;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,.15);
    align-items: center;
    gap: .5rem;
}

@media (min-width: 640px) { .mkt-hero__toast[b-fqfdfi1odo] { display: flex; } }

.mkt-hero__toast-icon[b-fqfdfi1odo] {
    display: flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: color-mix(in oklch, var(--teal) 15%, transparent);
    color: var(--teal);
    flex-shrink: 0;
}

.mkt-hero__toast-title[b-fqfdfi1odo] { font-size: .75rem; font-weight: 600; }
.mkt-hero__toast-body[b-fqfdfi1odo]  { font-size: .6875rem; color: var(--muted-foreground); }

/* ── Logos strip ─────────────────────────────────────────────────────────────── */

.mkt-logos-strip[b-fqfdfi1odo] {
    border-top: 1px solid color-mix(in oklch, var(--border) 60%, transparent);
    border-bottom: 1px solid color-mix(in oklch, var(--border) 60%, transparent);
    background: color-mix(in oklch, var(--muted) 30%, transparent);
    padding-block: 2rem;
}

.mkt-logos-strip__label[b-fqfdfi1odo] {
    text-align: center;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--muted-foreground);
    margin: 0;
}

.mkt-logos-strip__grid[b-fqfdfi1odo] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-top: 1.25rem;
    text-align: center;
    font-size: .875rem;
    font-weight: 600;
    color: color-mix(in oklch, var(--muted-foreground) 80%, transparent);
}

@media (min-width: 640px) { .mkt-logos-strip__grid[b-fqfdfi1odo] { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px){ .mkt-logos-strip__grid[b-fqfdfi1odo] { grid-template-columns: repeat(6, 1fr); } }

/* ── Section utility ─────────────────────────────────────────────────────────── */

.mkt-section[b-fqfdfi1odo] {
    padding-block: 6rem;
}

.mkt-section--muted[b-fqfdfi1odo] {
    background: color-mix(in oklch, var(--muted) 30%, transparent);
    border-top: 1px solid color-mix(in oklch, var(--border) 60%, transparent);
    border-bottom: 1px solid color-mix(in oklch, var(--border) 60%, transparent);
}

.mkt-eyebrow[b-fqfdfi1odo] {
    display: inline-block;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--teal);
}

.mkt-section__header[b-fqfdfi1odo] {
    max-width: 40rem;
    margin-inline: auto;
    text-align: center;
    margin-bottom: 3.5rem;
}

.mkt-section__header h2[b-fqfdfi1odo] {
    margin-top: .5rem;
    font-size: clamp(1.75rem, 3.5vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -.025em;
}

.mkt-section__header p[b-fqfdfi1odo] {
    margin-top: 1rem;
    color: var(--muted-foreground);
}

/* ── Feature grid ────────────────────────────────────────────────────────────── */

.mkt-feature-grid[b-fqfdfi1odo] {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: 1fr;
}

@media (min-width: 640px) { .mkt-feature-grid[b-fqfdfi1odo] { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px){ .mkt-feature-grid[b-fqfdfi1odo] { grid-template-columns: repeat(3, 1fr); } }

.mkt-feature-card[b-fqfdfi1odo] {
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: var(--card);
    padding: 1.5rem;
    transition: transform .15s, border-color .15s, box-shadow .15s;
}

.mkt-feature-card:hover[b-fqfdfi1odo] {
    transform: translateY(-2px);
    border-color: color-mix(in oklch, var(--teal) 50%, transparent);
    box-shadow: 0 10px 30px -5px color-mix(in oklch, var(--navy) 5%, transparent);
}

.mkt-feature-card__icon[b-fqfdfi1odo] {
    display: flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    border-radius: .75rem;
    background: var(--navy);
    color: var(--navy-foreground);
    font-size: 1.125rem;
}

.mkt-feature-card h3[b-fqfdfi1odo] {
    margin-top: 1.25rem;
    font-size: 1.125rem;
    font-weight: 600;
}

.mkt-feature-card p[b-fqfdfi1odo] {
    margin-top: .5rem;
    font-size: .875rem;
    color: var(--muted-foreground);
    line-height: 1.6;
}

/* ── How it works steps ──────────────────────────────────────────────────────── */

.mkt-steps-grid[b-fqfdfi1odo] {
    display: grid;
    gap: 1.5rem;
}

@media (min-width: 768px)  { .mkt-steps-grid[b-fqfdfi1odo] { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .mkt-steps-grid[b-fqfdfi1odo] { grid-template-columns: repeat(4, 1fr); } }

.mkt-step[b-fqfdfi1odo] {
    position: relative;
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: var(--card);
    padding: 1.5rem;
}

.mkt-step__num[b-fqfdfi1odo] {
    display: block;
    font-size: .875rem;
    font-weight: 700;
}

.mkt-step h3[b-fqfdfi1odo] {
    margin-top: .75rem;
    font-size: 1.125rem;
    font-weight: 600;
}

.mkt-step p[b-fqfdfi1odo] {
    margin-top: .5rem;
    font-size: .875rem;
    color: var(--muted-foreground);
    line-height: 1.6;
}

/* ── Embed showcase ──────────────────────────────────────────────────────────── */

.mkt-embed-grid[b-fqfdfi1odo] {
    display: grid;
    align-items: center;
    gap: 3rem;
}

@media (min-width: 1024px) { .mkt-embed-grid[b-fqfdfi1odo] { grid-template-columns: 1fr 1fr; } }

.mkt-embed-copy h2[b-fqfdfi1odo] {
    margin-top: .5rem;
    font-size: clamp(1.75rem, 3.5vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -.025em;
}

.mkt-embed-copy p[b-fqfdfi1odo] {
    margin-top: 1rem;
    color: var(--muted-foreground);
    line-height: 1.6;
}

.mkt-embed-list[b-fqfdfi1odo] {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 0;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    font-size: .875rem;
}

.mkt-embed-list li[b-fqfdfi1odo] {
    display: flex;
    align-items: flex-start;
    gap: .625rem;
}

.mkt-embed-preview[b-fqfdfi1odo] {
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: var(--navy);
    color: var(--navy-foreground);
    overflow: hidden;
    box-shadow: 0 25px 50px -12px color-mix(in oklch, var(--navy) 20%, transparent);
}

.mkt-embed-preview__bar[b-fqfdfi1odo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255,255,255,.1);
    padding: .625rem 1rem;
}

.mkt-embed-preview__bar-left[b-fqfdfi1odo] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .75rem;
    color: rgba(255,255,255,.6);
}

.mkt-embed-preview__badge[b-fqfdfi1odo] {
    font-size: .625rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--teal);
}

.mkt-embed-preview__code[b-fqfdfi1odo] {
    margin: 0;
    padding: 1.25rem;
    font-size: .75rem;
    line-height: 1.6;
    color: rgba(255,255,255,.9);
    overflow-x: auto;
}

.mkt-embed-preview__widget-wrap[b-fqfdfi1odo] {
    border-top: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.04);
    padding: 1.25rem;
}

.mkt-embed-preview__widget-label[b-fqfdfi1odo] {
    font-size: .75rem;
    color: rgba(255,255,255,.6);
    margin-bottom: .5rem;
}

.mkt-embed-widget[b-fqfdfi1odo] {
    border-radius: .5rem;
    background: #fff;
    color: var(--foreground);
    padding: .75rem;
    font-size: .875rem;
}

.mkt-embed-widget__header[b-fqfdfi1odo] {
    display: flex;
    justify-content: space-between;
    font-size: .75rem;
    color: var(--muted-foreground);
    font-weight: 600;
    margin-bottom: .5rem;
}

.mkt-embed-widget__row[b-fqfdfi1odo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-block: .25rem;
    font-size: .75rem;
}

.mkt-embed-widget__row .pos[b-fqfdfi1odo] { margin-right: .5rem; color: var(--muted-foreground); }
.mkt-embed-widget__row .pts[b-fqfdfi1odo] { font-weight: 700; color: var(--navy); }

/* ── Pricing ─────────────────────────────────────────────────────────────────── */

.mkt-pricing-grid[b-fqfdfi1odo] {
    display: grid;
    gap: 1.5rem;
}

@media (min-width: 1024px) { .mkt-pricing-grid[b-fqfdfi1odo] { grid-template-columns: repeat(3, 1fr); } }

.mkt-plan[b-fqfdfi1odo] {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: var(--card);
    padding: 1.75rem;
}

.mkt-plan--featured[b-fqfdfi1odo] {
    border: none;
    background: var(--navy);
    color: var(--navy-foreground);
    box-shadow: 0 25px 50px -12px color-mix(in oklch, var(--navy) 20%, transparent);
}

.mkt-plan__badge[b-fqfdfi1odo] {
    position: absolute;
    top: -1rem;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 9999px;
    background: var(--teal);
    padding: .25rem .75rem;
    font-size: .625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--navy);
    white-space: nowrap;
}

.mkt-plan h3[b-fqfdfi1odo] { font-size: 1.125rem; font-weight: 600; }

.mkt-plan__desc[b-fqfdfi1odo] {
    margin-top: .25rem;
    font-size: .875rem;
    color: var(--muted-foreground);
}

.mkt-plan--featured .mkt-plan__desc[b-fqfdfi1odo] { color: rgba(255,255,255,.7); }

.mkt-plan__price[b-fqfdfi1odo] {
    display: flex;
    align-items: baseline;
    gap: .25rem;
    margin-top: 1.25rem;
}

.mkt-plan__amount[b-fqfdfi1odo] {
    font-size: 2.5rem;
    font-weight: 800;
    letter-spacing: -.04em;
}

.mkt-plan__period[b-fqfdfi1odo] { font-size: .875rem; color: var(--muted-foreground); }
.mkt-plan--featured .mkt-plan__period[b-fqfdfi1odo] { color: rgba(255,255,255,.6); }

.mkt-plan__features[b-fqfdfi1odo] {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 2rem;
    display: flex;
    flex-direction: column;
    gap: .625rem;
    font-size: .875rem;
    flex: 1;
}

.mkt-plan__features li[b-fqfdfi1odo] {
    display: flex;
    align-items: flex-start;
    gap: .625rem;
}

.mkt-plan--featured .mkt-plan__features li[b-fqfdfi1odo] { color: rgba(255,255,255,.9); }
.mkt-plan--featured .mkt-plan__features li i[b-fqfdfi1odo] { color: var(--teal); }

/* ── Testimonials ────────────────────────────────────────────────────────────── */

.mkt-testimonials-grid[b-fqfdfi1odo] {
    display: grid;
    gap: 1.5rem;
}

@media (min-width: 768px) { .mkt-testimonials-grid[b-fqfdfi1odo] { grid-template-columns: repeat(3, 1fr); } }

.mkt-testimonial[b-fqfdfi1odo] {
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: var(--card);
    padding: 1.5rem;
    margin: 0;
}

.mkt-testimonial__stars[b-fqfdfi1odo] {
    display: flex;
    gap: .125rem;
    color: var(--teal);
    font-size: 1rem;
}

.mkt-testimonial blockquote[b-fqfdfi1odo] {
    margin: 1rem 0 0;
    padding: 0;
    font-size: .875rem;
    line-height: 1.6;
    color: color-mix(in oklch, var(--foreground) 90%, transparent);
}

.mkt-testimonial figcaption[b-fqfdfi1odo] { margin-top: 1.25rem; }
.mkt-testimonial__name[b-fqfdfi1odo] { font-size: .8125rem; font-weight: 600; }
.mkt-testimonial__role[b-fqfdfi1odo] { font-size: .75rem; color: var(--muted-foreground); }

/* ── CTA banner ──────────────────────────────────────────────────────────────── */

.mkt-cta-banner[b-fqfdfi1odo] {
    position: relative;
    overflow: hidden;
    border-radius: 1.5rem;
    padding: 3.5rem 2rem;
    text-align: center;
    color: #fff;
}

.mkt-cta-banner__shine[b-fqfdfi1odo] {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at top right, rgba(255,255,255,.25), transparent 60%);
}

.mkt-cta-banner h2[b-fqfdfi1odo] {
    position: relative;
    font-size: clamp(1.75rem, 3.5vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -.025em;
}

.mkt-cta-banner p[b-fqfdfi1odo] {
    position: relative;
    margin-top: .75rem;
    color: rgba(255,255,255,.85);
}

.mkt-cta-banner__actions[b-fqfdfi1odo] {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .75rem;
    margin-top: 1.75rem;
}

/* ── Footer ──────────────────────────────────────────────────────────────────── */

.mkt-footer[b-fqfdfi1odo] {
    border-top: 1px solid var(--border);
    background: var(--background);
}

.mkt-footer__inner[b-fqfdfi1odo] {
    display: grid;
    gap: 2.5rem;
    padding-block: 3.5rem;
}

@media (min-width: 768px) { .mkt-footer__inner[b-fqfdfi1odo] { grid-template-columns: 2fr 1fr 1fr; } }

.mkt-footer__brand p[b-fqfdfi1odo] {
    margin-top: .75rem;
    max-width: 24rem;
    font-size: .875rem;
    color: var(--muted-foreground);
}

.mkt-footer__heading[b-fqfdfi1odo] {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--muted-foreground);
}

.mkt-footer ul[b-fqfdfi1odo] {
    list-style: none;
    padding: 0;
    margin: .75rem 0 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.mkt-footer ul a[b-fqfdfi1odo] {
    font-size: .875rem;
    color: var(--muted-foreground);
    text-decoration: none;
}

.mkt-footer ul a:hover[b-fqfdfi1odo] { color: var(--foreground); }

.mkt-footer__bottom[b-fqfdfi1odo] {
    border-top: 1px solid var(--border);
}

.mkt-footer__bottom-inner[b-fqfdfi1odo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-block: 1.25rem;
    font-size: .75rem;
    color: var(--muted-foreground);
}

@media (min-width: 640px) { .mkt-footer__bottom-inner[b-fqfdfi1odo] { flex-direction: row; } }
/* /Components/Pages/Import.razor.rz.scp.css */
/* ── Step indicator ───────────────────────────────────────────────── */

.import-stepper[b-0sv9j3w4w2] {
    display: flex;
    align-items: center;
    margin-bottom: 2rem;
}

.import-step[b-0sv9j3w4w2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.import-step--has-line[b-0sv9j3w4w2] {
    flex: 1;
}

.import-step__bubble[b-0sv9j3w4w2] {
    height: 2rem;
    width: 2rem;
    border-radius: 9999px;
    border: 2px solid var(--border);
    color: var(--muted-foreground);
    display: grid;
    place-items: center;
    font-size: 0.8125rem;
    font-weight: 700;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.import-step__bubble.is-active[b-0sv9j3w4w2] {
    background: var(--teal);
    border-color: var(--teal);
    color: var(--teal-foreground);
}

.import-step__bubble.is-done[b-0sv9j3w4w2] {
    background: var(--success);
    border-color: var(--success);
    color: var(--success-foreground);
}

.import-step__label[b-0sv9j3w4w2] {
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    transition: opacity 0.15s;
}

.import-step__line[b-0sv9j3w4w2] {
    height: 2px;
    flex: 1;
    background: var(--border);
    margin: 0 0.75rem;
    transition: background 0.2s;
}

.import-step__line.is-done[b-0sv9j3w4w2] {
    background: var(--success);
}

/* ── Step body ────────────────────────────────────────────────────── */

.import-step-body[b-0sv9j3w4w2] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.import-field-label[b-0sv9j3w4w2] {
    display: block;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted-foreground);
    margin-bottom: 0.5rem;
}

/* ── Drop zone ────────────────────────────────────────────────────── */

.import-dropzone[b-0sv9j3w4w2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--border);
    border-radius: var(--radius-xl);
    padding: 3rem 1.5rem;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}

.import-dropzone:hover[b-0sv9j3w4w2],
.import-dropzone--has-file[b-0sv9j3w4w2] {
    border-color: oklch(from var(--teal) l c h / 0.5);
    background: oklch(from var(--teal) l c h / 0.04);
}

/* ── Selected file row ────────────────────────────────────────────── */

.import-file-row[b-0sv9j3w4w2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: oklch(from var(--muted-foreground) l c h / 0.06);
    border-radius: var(--radius-md);
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
}

/* ── Column mapping table ─────────────────────────────────────────── */

.import-map-table[b-0sv9j3w4w2] {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.import-map-table table[b-0sv9j3w4w2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.import-map-table thead tr[b-0sv9j3w4w2] {
    background: oklch(from var(--muted-foreground) l c h / 0.06);
}

.import-map-table th[b-0sv9j3w4w2] {
    text-align: left;
    padding: 0.625rem 1rem;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted-foreground);
}

.import-map-table td[b-0sv9j3w4w2] {
    padding: 0.5rem 1rem;
    border-top: 1px solid var(--border);
    vertical-align: middle;
}

.import-map-table td code[b-0sv9j3w4w2] {
    font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
    font-size: 0.75rem;
}

/* ── Validate: stat cards ─────────────────────────────────────────── */

.import-stats[b-0sv9j3w4w2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.import-stat[b-0sv9j3w4w2] {
    border: 2px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1rem;
    text-align: center;
}

.import-stat--success[b-0sv9j3w4w2] {
    border-color: oklch(from var(--success) l c h / 0.4);
    background: oklch(from var(--success) l c h / 0.05);
}

.import-stat--warning[b-0sv9j3w4w2] {
    border-color: oklch(from var(--warning) l c h / 0.4);
    background: oklch(from var(--warning) l c h / 0.05);
}

.import-stat--error[b-0sv9j3w4w2] {
    border-color: oklch(from var(--destructive) l c h / 0.4);
    background: oklch(from var(--destructive) l c h / 0.05);
}

.import-stat__n[b-0sv9j3w4w2] {
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 0.25rem;
}

.import-stat--success .import-stat__n[b-0sv9j3w4w2] { color: var(--success); }
.import-stat--warning .import-stat__n[b-0sv9j3w4w2] { color: var(--warning-foreground); }

.import-stat__label[b-0sv9j3w4w2] {
    font-size: 0.75rem;
    color: var(--muted-foreground);
}

/* ── Validate: warning list ───────────────────────────────────────── */

.import-warnings[b-0sv9j3w4w2] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.import-warning[b-0sv9j3w4w2] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    border-top: 1px solid var(--border);
}

.import-warning:first-child[b-0sv9j3w4w2] {
    border-top: none;
}

.import-warning__icon[b-0sv9j3w4w2] {
    color: var(--warning-foreground);
    flex-shrink: 0;
    margin-top: 0.125rem;
}

/* ── Commit: success icon ─────────────────────────────────────────── */

.import-success-icon[b-0sv9j3w4w2] {
    height: 3.5rem;
    width: 3.5rem;
    border-radius: 9999px;
    background: oklch(from var(--success) l c h / 0.15);
    color: var(--success);
    display: grid;
    place-items: center;
}

.import-rollback-notice[b-0sv9j3w4w2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--muted-foreground);
    padding: 0.5rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: oklch(from var(--muted-foreground) l c h / 0.04);
}