html {
    overflow-x: hidden;
}

/* Card #725: bootstrap-reboot.css sets `:root { scroll-behavior: smooth }` (guarded by
   prefers-reduced-motion), which also governs browser/framework-internal scrolling -- e.g.
   FocusOnNavigate's focus()-triggered scroll-into-view after a Blazor enhanced navigation. That
   turned what should be an instant, invisible scroll correction into a visible animated glide on
   every page navigation (see wwwroot/js/site-navigation.js for the matching JS-side fix). Same
   selector/specificity as bootstrap's rule, so this wins purely on cascade order (app.css loads
   after bootstrap.min.css in App.razor). No in-page anchor links exist yet that would want the
   smooth glide for user-initiated jumps. */
:root {
    scroll-behavior: auto;
}

/* Card #680: kit fonts + theme tokens site-wide (wwwroot/brand/brand.css,
   wwwroot/brand/locus/site-theme.css, both loaded in Components/App.razor). --lc-ground/--lc-ink
   auto-swap under prefers-color-scheme/[data-theme]; every rule below reads them via var() and
   never repeats the media query itself. */
html, body {
    font-family: var(--locus-font-body, 'Source Sans 3', 'Segoe UI', sans-serif);
    background: var(--lc-ground, #f4f6f9);
    color: var(--lc-ink, #1a2535);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--locus-font-display, 'Zilla Slab', 'Rockwell', Georgia, serif);
}

a, .btn-link {
    color: var(--lc-accent-deep, #006bb7);
}

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

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

/* ── Hero ────────────────────────────────────────────────── */
/* The hero keeps a fixed dark "dusk" ground in both site themes (architect's dark reference,
   card #680: "hero keeps navy and converges") -- var(--lc-dusk) never changes under
   prefers-color-scheme/[data-theme], same as .lc-header/.lc-footer. */
.lc-hero {
    position: relative;
    background: linear-gradient(135deg, var(--lc-dusk, #0a1628) 0%, #0d2a4a 60%, #0e3460 100%);
    color: var(--lc-on-dusk, #fff);
    padding: 5rem 1.5rem 4.5rem;
    overflow: hidden;
}

/* Card #680: contour-line motif -- twin ridge lines echoing the ratified mark's own "Twin Peak
   Dawn" ridge+arc geometry (wwwroot/brand/locus/README.md's "Mark rationale"), decorative only. */
.lc-hero-contour {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

/* Card #724: the restored Concept A mountain-sunrise graphic (Home.razor) -- same absolute
   full-bleed layer as .lc-hero-contour, but hidden below md so it never competes with the
   centered headline/sub on narrow screens, where the two would otherwise overlap directly. */
.lc-hero-sunrise {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

@media (max-width: 767.98px) {
    .lc-hero-sunrise { display: none; }
}

.lc-hero > .container {
    position: relative;
}

.lc-hero-headline {
    font-family: var(--locus-font-display, 'Zilla Slab', 'Rockwell', Georgia, serif);
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 1.25rem;
    letter-spacing: -0.5px;
}

.lc-hero-sub {
    font-size: 1.15rem;
    color: var(--lc-on-dusk-muted, #b0c8e4);
    max-width: 600px;
    margin: 0 auto 2rem;
    line-height: 1.65;
}

.lc-btn-primary {
    background: var(--lc-accent-light, #7FB6D9);
    color: var(--lc-dusk, #0a1628) !important;
    font-weight: 700;
    padding: 0.65rem 1.75rem;
    border-radius: 8px;
    border: none;
    font-size: 1rem;
    text-decoration: none;
    transition: background 0.15s;
}

.lc-btn-primary:hover { background: var(--lc-accent-resolve, #E0A458); }

.lc-btn-outline {
    background: transparent;
    color: var(--lc-on-dusk, #fff) !important;
    font-weight: 600;
    padding: 0.65rem 1.75rem;
    border-radius: 8px;
    border: 2px solid rgba(255,255,255,0.35);
    font-size: 1rem;
    text-decoration: none;
    transition: border-color 0.15s, background 0.15s;
}

.lc-btn-outline:hover { border-color: #fff; background: rgba(255,255,255,0.07); }

/* ── Proof Strip ─────────────────────────────────────────── */
/* Card #696: renders exactly the two architect-ratified figures (Home.razor) -- reads --lc-ink/
   --lc-border directly via var() (already theme-reactive from site-theme.css's :root), same
   convention .lc-section-header already uses, so no extra .lc-home scoping is needed here. */
.lc-proof-strip {
    padding: 1.5rem 0;
    border-top: 1px solid var(--lc-border, #dce4ef);
    border-bottom: 1px solid var(--lc-border, #dce4ef);
}

.lc-proof-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem 3rem;
}

.lc-proof-item {
    margin: 0;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--lc-ink, #0a1628);
    text-align: center;
}

/* ── Sections ────────────────────────────────────────────── */
.lc-section {
    padding: 4rem 0;
}

.lc-section-alt {
    background: var(--lc-ground-alt, #eef2f7);
}

.lc-section-header {
    margin-bottom: 2.5rem;
}

/* Card #724 item 5: small label above the section heading, adopted with the mock's own
   heading/lede copy -- same uppercase-accent-label convention already used elsewhere in this kit
   (.lc-family-tagline, .lc-dropdown-category), reused here rather than inventing a new one.
   Card #746: treatment (size/letter-spacing/margin) brought in line verbatim with the ratified
   mock -- color already read the theme-reactive --lc-accent-deep token (glacier-deep on light
   ground, glacier-light on dark ground per site-theme.css), which already met AA and needed no
   change. */
.lc-section-eyebrow {
    font-family: var(--locus-font-body, 'Source Sans 3', 'Segoe UI', sans-serif);
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--lc-accent-deep, #2E6E96);
    margin: 0 0 0.7rem;
}

.lc-section-header h2 {
    font-family: var(--locus-font-display, 'Zilla Slab', 'Rockwell', Georgia, serif);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--lc-ink, #0a1628);
    text-wrap: balance;
}

.lc-section-lead {
    color: var(--lc-ink-muted, #556b85);
    font-size: 1.05rem;
    margin-top: 0.25rem;
    max-width: 60ch;
    margin-left: auto;
    margin-right: auto;
}

/* ── Cards ───────────────────────────────────────────────── */
/* .lc-card and friends are shared far beyond Home.razor -- Services/Products/ProductDetail,
   every product front door (ProductFrontDoor.razor), and exhibit-class demo panels
   (StravonGoldenRecordDemo.razor, dashboards). Card #537 already established (and this card's
   own acceptance criteria repeat) that those exhibit/specimen surfaces keep a fixed light ground
   regardless of site theme, so this base rule stays on the kit's fixed (non-theme-swapping)
   tokens. Home.razor's own product-family/services cards opt into the theme-reactive --lc-ground
   -card/--lc-ink tokens via the .lc-home scope override further down this file. */
.lc-card-link {
    text-decoration: none;
    display: block;
    height: 100%;
}

.lc-card {
    background: var(--locus-cream, #fff);
    border-radius: 12px;
    padding: 1.75rem;
    border: 1px solid #dce4ef;
    transition: box-shadow 0.2s, transform 0.2s;
    display: flex;
    flex-direction: column;
}

/* Card #696: a resting elevation (not just on :hover) per the ratified mock's "kit card styling"
   -- Home.razor's own cards only; scoped the same way the theme-reactive overrides just below
   are, via .lc-home, so Services/Products/every product front door (which also render .lc-card)
   keep their pre-existing flat-until-hover treatment. Declared BEFORE .lc-card:hover below: same
   (0,2,0) specificity as that rule, so source order decides which box-shadow wins on hover, and
   this must lose there (or the deeper hover shadow would never show on Home.razor's cards). */
.lc-home .lc-card {
    box-shadow: 0 2px 10px rgba(10,22,40,0.06);
}

.lc-card:hover {
    box-shadow: 0 8px 28px rgba(10,22,40,0.12);
    transform: translateY(-3px);
}

/* Services grid line icons: bespoke SVGs per the ratified mock (card #696), falling back to
   Bootstrap Icons' bi-* glyphs for any service slug not one of the four known ones (see
   Home.razor). Both inherit color the same way via currentColor/color. */
.lc-card-icon {
    font-size: 2rem;
    color: var(--locus-glacier-deep, #4fc3f7);
    margin-bottom: 1rem;
}

.lc-card-icon svg {
    width: 2rem;
    height: 2rem;
    display: block;
}

.lc-card-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--locus-navy, #0a1628);
    margin-bottom: 0.5rem;
}

.lc-card-text {
    font-size: 0.9rem;
    color: #556b85;
    flex: 1;
    line-height: 1.6;
}

.lc-card-cta {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--locus-glacier-deep, #1b6ec2);
    margin-top: 1rem;
    display: block;
}

/* Card #680: Home.razor is the one surface the dark reference's descending grounds apply to
   ("page #0D1620, card #14283B") -- .lc-home scopes that theme-reactive treatment to the
   homepage's own cards without touching the shared, fixed-light .lc-card base rule above (which
   Services/Products/every product front door and exhibit dashboard also render). */
.lc-home .lc-card {
    background: var(--lc-ground-card, #fff);
    border-color: var(--lc-border, #dce4ef);
}

.lc-home .lc-card-icon { color: var(--lc-accent-deep, #4fc3f7); }
.lc-home .lc-card-title { color: var(--lc-ink, #0a1628); }
.lc-home .lc-card-text { color: var(--lc-ink-muted, #556b85); }
.lc-home .lc-card-cta { color: var(--lc-accent-deep, #1b6ec2); }

/* Product Family row: each member's own kit accent (--lc-family-accent, set inline per member in
   Home.razor from wwwroot/brand/locus/site-theme.css's --lc-family-*-accent tokens) -- verbatim
   tagline, no invented marketing copy. Card #696: left accent edge per the ratified mock (was a
   border-top through card #680). */
.lc-family-card {
    border-left: 3px solid var(--lc-family-accent, var(--lc-accent-deep, #2E6E96));
}

/* Card #724: ".lc-home .lc-card { border-color: var(--lc-border) }" above is a two-class
   selector (0,2,0) -- more specific than ".lc-family-card"'s single-class border-left (0,1,0) --
   so on the homepage it was silently winning the cascade and repainting the left edge back to
   the neutral --lc-border gray, right after .lc-family-card set it to the accent. That's why the
   mock's left-edge color bars never visibly landed even though the border-left rule above was
   already in the stylesheet. Matching this selector's specificity (also .lc-home + one class)
   and declaring it after settles the cascade the other way. Same fix, same reason, for the
   service tiles' new Locus-accent bar below (Consulting Services grid, Home.razor) -- "Service
   tiles get the same box-highlight treatment with Locus accents" (not a per-service color, the
   kit's own resolve accent, matching .lc-home .lc-card-icon's color above). */
.lc-home .lc-family-card {
    border-left-color: var(--lc-family-accent, var(--lc-accent-deep, #2E6E96));
}

.lc-home .lc-service-card {
    border-left: 3px solid var(--lc-accent-deep, #2E6E96);
}

/* Card #696: each member's real vendored kit mark (wwwroot/brand/<product>/) on a small white/
   cream backing swatch -- every kit mark is a light-ground-only asset (see each kit's own
   README), so the swatch keeps it legible on this card's theme-reactive background under
   [data-theme="dark"] without requiring a new dark-ground asset from any kit. */
.lc-family-mark {
    display: block;
    width: 40px;
    height: 40px;
    padding: 6px;
    margin-bottom: 0.85rem;
    background: #fff;
    border-radius: 10px;
    object-fit: contain;
}

.lc-family-tagline {
    font-family: var(--locus-font-body, 'Source Sans 3', 'Segoe UI', sans-serif);
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lc-family-accent, var(--lc-accent-deep, #2E6E96));
    margin: 0.15rem 0 0.75rem;
}

/* ── Badges ──────────────────────────────────────────────── */
.lc-card-tags { display: flex; flex-wrap: wrap; gap: 0.35rem; }

.lc-badge {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lc-badge-dev { background: #e3f2fd; color: #0d47a1; }
.lc-badge-biz { background: #e8f5e9; color: #1b5e20; }

/* Card #731 round 3: B9/G2P (3 Code Monkeys (3CM) partner-catalog products) restored after
   card #724's consolidation dropped them from the page entirely -- the ratified rule is that 3CM
   products are never presented as Locus-built, so each partner card carries this attribution pill
   up top instead of the Locus-family row's kit-accent left edge (no accent bar here -- there's no
   vendored kit to accent with, and adding one would visually imply Locus ownership the pill
   denies). Theme-reactive muted tokens, same as the rest of Home.razor's .lc-home-scoped cards. */
.lc-partner-tag {
    display: inline-block;
    font-family: var(--locus-font-body, 'Source Sans 3', 'Segoe UI', sans-serif);
    font-weight: 700;
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--lc-ink-muted, #556b85);
    background: var(--lc-ground-alt, #eef2f7);
    border-radius: 20px;
    padding: 0.2rem 0.6rem;
    margin-bottom: 0.85rem;
}

/* ── CTA Banner (Home.razor only) ─────────────────────────── */
/* Same fixed-dusk treatment as .lc-hero -- an always-dark gradient band, not a ground that swaps
   with theme. */
.lc-cta-banner {
    background: linear-gradient(135deg, var(--lc-dusk, #0a1628), #0d3460);
    color: var(--lc-on-dusk, #fff);
    padding: 4rem 1.5rem;
}

.lc-cta-banner h2 {
    font-size: 1.9rem;
    font-weight: 700;
    /* Card #724: "closer, not touching" -- was 0.75rem, read as too much air between the
       headline and the line right under it. */
    margin-bottom: 0.5rem;
}

.lc-cta-banner p {
    color: var(--lc-on-dusk-muted, #b0c8e4);
    /* Card #724: same tightening as the h2 margin above, applied to the gap before the CTA button. */
    margin-bottom: 1.25rem;
    font-size: 1.05rem;
}

/* ── Page content areas (non-home pages) ─────────────────── */
/* .lc-page hosts Services/Products/ServiceDetail/ProductDetail, every product front door, and
   exhibit-class dashboards/demo panels -- an explicit fixed-light background (rather than letting
   html/body's now theme-reactive background show through) keeps those exhibit surfaces on the
   same fixed light ground card #537 already established for their lockup headers, regardless of
   the visitor's site theme. */
.lc-page {
    background: var(--locus-cream, #faf9f5);
    padding: 3rem 0 4rem;
}

.lc-page-header {
    margin-bottom: 2.5rem;
}

.lc-page-header h1 {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--locus-navy, #0a1628);
}

.lc-page-header p {
    color: #556b85;
    font-size: 1.05rem;
}

/* ── Offering list ───────────────────────────────────────── */
.lc-offering {
    border-left: 4px solid var(--locus-glacier-deep, #4fc3f7);
    padding: 0.85rem 1.25rem;
    margin-bottom: 1rem;
    background: #fff;
    border-radius: 0 8px 8px 0;
}

.lc-offering-name {
    font-weight: 700;
    color: var(--locus-navy, #0a1628);
    font-size: 1rem;
}

.lc-offering-desc {
    color: #556b85;
    font-size: 0.9rem;
    margin: 0;
}

/* ── Product sheet ───────────────────────────────────────── */
.lc-product-hero {
    background: linear-gradient(135deg, var(--locus-navy, #0a1628), #0d2a4a);
    color: #fff;
    padding: 3.5rem 1.5rem 3rem;
}

.lc-product-hero h1 { font-size: 2.5rem; font-weight: 800; }
.lc-product-hero p  { color: #b0c8e4; font-size: 1.1rem; max-width: 680px; }

/* ── Validation / form styles ────────────────────────────── */
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #e50000; }
.validation-message { color: #e50000; }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}


a, .btn-link {
    color: var(--lc-accent-deep, #006bb7);
}

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

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

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

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}
/* -- Feature list ------------------------------------------ */
.lc-feature-list {
    padding-left: 1.25rem;
    color: #556b85;
    font-size: 0.92rem;
    line-height: 1.7;
}

.lc-feature-list li { margin-bottom: 0.35rem; }

@media (max-width: 575.98px) {
    .lc-hero         { padding: 3rem 1rem 2.5rem; }
    .lc-section      { padding: 2.5rem 0; }
    .lc-cta-banner   { padding: 2.5rem 1rem; }
    .lc-product-hero { padding: 2rem 1rem; }
    .lc-product-hero h1,
    .lc-page-header h1 { font-size: 1.75rem; }
}