@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';
@import '_content/SmartComponents.AspNetCore.Components/SmartComponents.AspNetCore.Components.bundle.scp.css';

/* /Components/Account/Pages/Manage/ForetagTabs/LogotypTab.razor.rz.scp.css */
.logo-card[b-dni0yxyncb] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Förhandsvisning i exakt menyfärg och menybredd – WYSIWYG mot riktiga menyn. */
.logo-preview[b-dni0yxyncb] {
    width: 250px; /* samma bredd som sidomenyn */
    max-width: 100%;
    background-color: #1B2A4A; /* menyfärgen (Notary Navy) */
    border-radius: 0.5rem;
    overflow: hidden;
    margin-top: 0.25rem;
}

.logo-preview-empty[b-dni0yxyncb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    min-height: 74px;
    padding: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.8rem;
    text-align: center;
}

.logo-preview-empty i[b-dni0yxyncb] {
    font-size: 1.3rem;
}

/* Förhandsvisning på vitt papper – för den vanliga loggan (utskrift). */
.logo-preview-paper[b-dni0yxyncb] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    max-width: 100%;
    min-height: 96px;
    padding: 1rem 1.25rem;
    margin-top: 0.25rem;
    background-color: #ffffff; /* riktigt vitt papper */
    border: 1px solid #EDE7DD;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px rgba(27, 42, 74, 0.08);
}

.logo-paper-img[b-dni0yxyncb] {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 68px;
    object-fit: contain;
}

.logo-empty-paper[b-dni0yxyncb] {
    color: #9aa0a6;
    font-size: 0.8rem;
}

.logo-preview-caption[b-dni0yxyncb] {
    margin-top: 0.4rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.logo-actions[b-dni0yxyncb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.85rem;
}

/* Filuppladdning stylad som en knapp (det riktiga file-inputet ligger osynligt över). */
.logo-upload-btn[b-dni0yxyncb] {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.9rem;
    border-radius: 0.5rem;
    background-color: #1B2A4A;
    color: #FCFBF8;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.logo-upload-btn:hover[b-dni0yxyncb] {
    background-color: #C4875A; /* koppar vid hover, enligt designsystemet */
}

.logo-upload-btn.disabled[b-dni0yxyncb] {
    opacity: 0.6;
    pointer-events: none;
}

/* InputFile är en underkomponent – dess <input> får inte scope-attributet, så
   vi måste nå in med ::deep för att dölja webbläsarens "Choose file"-kontroll
   och lägga den osynligt över hela knappen. */
.logo-upload-btn[b-dni0yxyncb]  input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    font-size: 0; /* gardering: ingen native-text ska kunna sippra fram */
}
/* /Components/AktFiles/SingleFileDrop/AktSingleFileDropZone.razor.rz.scp.css */
/* The Quiet Notary: the whole page is the drop target. No persistent UI at rest. */

/* Hidden conduit input (also hidden inline since CSS isolation can't reach it). */
.akt-drop__input[b-rij5l474we] {
    display: none;
}

/* Full-page overlay, visible only while dragging a file over the page or while the
   dropped file is processing. Visual only: the drop is handled on the window by JS,
   so this never blocks interaction. */
.akt-drop-overlay[b-rij5l474we] {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background-color: rgba(27, 42, 74, 0.22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 160ms ease;
}

.akt-drop-overlay--active[b-rij5l474we] {
    opacity: 1;
    visibility: visible;
}

.akt-drop-overlay__inner[b-rij5l474we] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem 2rem;
    border: 2px dashed #C4875A;
    border-radius: 0.75rem;
    background-color: #FCFBF8;
    color: #1B2A4A;
    font-weight: 500;
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.10);
}

.akt-drop-overlay__icon[b-rij5l474we] {
    font-size: 1.5rem;
    color: #C4875A;
}

.akt-drop-overlay__spinner[b-rij5l474we] {
    color: #C4875A;
}

/* Transient error alert, only shown on failure. */
.akt-drop-error[b-rij5l474we] {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    z-index: 1085;
    max-width: 420px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    border: 1px solid #EDE7DD;
    border-radius: 0.5rem;
    background-color: #FCFBF8;
    color: #CC372C;
    font-size: 0.85rem;
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.10);
}

.akt-drop-error__close[b-rij5l474we] {
    margin-left: auto;
    border: none;
    background: none;
    color: #5A6474;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-p5ti111xup] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-p5ti111xup] {
    flex: 1;
}

.sidebar[b-p5ti111xup] {
    background-color: #1B2A4A;
    background-image: none;
}

.top-row[b-p5ti111xup] {
    background-color: #FAFAF7;
    border-bottom: 1px solid #EDE7DD;
    justify-content: flex-start;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-p5ti111xup]  a, .top-row[b-p5ti111xup]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-p5ti111xup]  a:hover, .top-row[b-p5ti111xup]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-p5ti111xup]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

/* ── Mobile: column layout, content below top bar ── */
@media (max-width: 767.98px) {
    .top-row[b-p5ti111xup] {
        justify-content: space-between;
    }

    .top-row[b-p5ti111xup]  a, .top-row[b-p5ti111xup]  .btn-link {
        margin-left: 0;
    }

    main[b-p5ti111xup] {
        padding-top: 50px; /* space for fixed mobile top bar */
    }
}

/* ── Desktop: row layout with sidebar ── */
@media (min-width: 768px) {
    .page[b-p5ti111xup] {
        flex-direction: row;
    }

    main[b-p5ti111xup] {
        min-width: 0;
        /* clip (not hidden) clips horizontal overflow utan att göra <main> till en
           scroll-container. Med overflow-x: hidden befordras overflow-y till auto,
           vilket bryter position: sticky för t.ex. den frysta PageHeaderBar. */
        overflow-x: clip;
    }

    .sidebar[b-p5ti111xup] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-p5ti111xup] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-p5ti111xup]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-p5ti111xup], article[b-p5ti111xup] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }

    article.max-content-width[b-p5ti111xup] {
        max-width: 1400px;
    }
}

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

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

/* Ensure non-authenticated wrapper fills the page width */
.custom-not-logged-in-container[b-p5ti111xup] {
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* /Components/Pages/ArvskiftePages/ArvskiftesAckordsberakning.razor.rz.scp.css */
/* Force ALL icons in card headers with colored backgrounds to be white */
.card-header.bg-info i[b-v10rhy78rh],
.card-header.bg-warning i[b-v10rhy78rh],
.card-header.bg-success i[b-v10rhy78rh],
.card-header.bg-primary i[b-v10rhy78rh],
.card-header.bg-danger i[b-v10rhy78rh] {
    color: white !important;
}

/* Force white text and icons in ALL colored headers (including warning) */
.card-header.bg-info[b-v10rhy78rh],
.card-header.bg-warning[b-v10rhy78rh],
.card-header.bg-success[b-v10rhy78rh],
.card-header.bg-primary[b-v10rhy78rh] {
    color: white !important;
}

/* Ensure all icon elements are white in colored backgrounds */
.card-header.bg-info .bi[b-v10rhy78rh],
.card-header.bg-warning .bi[b-v10rhy78rh],
.card-header.bg-success .bi[b-v10rhy78rh],
.card-header.bg-primary .bi[b-v10rhy78rh] {
    color: white !important;
}

/* Additional specificity for Bootstrap icons with specific classes */
.card-header.bg-info i[class*="bi-"][b-v10rhy78rh],
.card-header.bg-warning i[class*="bi-"][b-v10rhy78rh],
.card-header.bg-success i[class*="bi-"][b-v10rhy78rh],
.card-header.bg-primary i[class*="bi-"][b-v10rhy78rh] {
    color: white !important;
}

/* Override for any generic bg- classes - all icons white */
.card-header[class*="bg-"] i[b-v10rhy78rh] {
    color: white !important;
}

.card-header[class*="bg-"] i[class*="bi-"][b-v10rhy78rh] {
    color: white !important;
}
/* /Components/Pages/ArvskiftePages/ArvskiftesTillgangar.razor.rz.scp.css */
/* ArvskiftesTillgangar - scoped overrides (main styles in app.css arv-* classes) */

/* Print styles */
@media print {
    .arv-btn[b-kdxuyuq2s9],
    .arv-btn-delete[b-kdxuyuq2s9],
    .arv-btn-add[b-kdxuyuq2s9],
    .arv-btn-import[b-kdxuyuq2s9],
    .arv-expand-btn[b-kdxuyuq2s9] {
        display: none !important;
    }

    .arv-item-card[b-kdxuyuq2s9],
    .arv-group-card[b-kdxuyuq2s9] {
        break-inside: avoid;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .collapse[b-kdxuyuq2s9] {
        transition: none;
    }
}
/* /Components/Pages/BegravningPages/OffertModal.razor.rz.scp.css */
.offert-modal-content[b-hgdpujo8lq] {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}
/* /Components/Pages/BegravningPages/PublicOffert.razor.rz.scp.css */
.offert-wrapper[b-4g2w5r1yu1] {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}
/* /Components/Pages/Bouppteckning/Narvaro.razor.rz.scp.css */
/* ============================================================
   Narvaro.razor – scoped layout för deltagare-listan.
   Ersätter den tidigare tabellen med en card-baserad lista där
   varje deltagare har en statusfärgad vänsterkant, avatar med
   initialer, och chip-baserad presentation av kallelsebevis.
   ============================================================ */

.narvaro-section[b-f9wey9hmq3] {
    overflow: hidden;
}

/* ---------- Sektionshuvud (titel + auto-bilägg-toggle) ---------- */

.narvaro-section-header[b-f9wey9hmq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: linear-gradient(180deg, #fcfcfd 0%, #fff 100%);
}

.narvaro-auto-toggle .form-check-input[b-f9wey9hmq3] {
    cursor: pointer;
}

/* ---------- Varningsremsa när auto-bilägg är avstängt ---------- */

.narvaro-warning-bar[b-f9wey9hmq3] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 1.25rem;
    background: #fff8e1;
    color: #6b4d00;
    border-bottom: 1px solid #f1d97a;
}

/* ---------- Lista över deltagare ---------- */

.narvaro-list[b-f9wey9hmq3] {
    padding: 0.25rem 0;
}

.narvaro-item[b-f9wey9hmq3] {
    position: relative;
    padding: 0.875rem 1.25rem 0.875rem 1.5rem;
    border-bottom: 1px solid var(--bs-border-color-translucent);
    transition: background-color 0.15s ease;
}

.narvaro-item:last-child[b-f9wey9hmq3] {
    border-bottom: none;
}

.narvaro-item:hover[b-f9wey9hmq3] {
    background-color: #fafbfc;
}

/* Statusfärgad vänsterkant – snabb visuell scan av närvarostatus. */
.narvaro-item[b-f9wey9hmq3]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--bs-secondary-bg-subtle);
}

.narvaro-status-personligen[b-f9wey9hmq3]::before { background: var(--bs-success); }
.narvaro-status-ej[b-f9wey9hmq3]::before          { background: var(--bs-warning); }
.narvaro-status-via[b-f9wey9hmq3]::before         { background: var(--bs-info); }

/* ---------- Översta raden: identitet + närvaro-select ---------- */

.narvaro-row[b-f9wey9hmq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.narvaro-identity[b-f9wey9hmq3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.narvaro-avatar[b-f9wey9hmq3] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e7f0ff 0%, #f0e8ff 100%);
    color: #2d3a7c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: 0.02em;
}

.narvaro-namebox[b-f9wey9hmq3] {
    min-width: 0;
}

.narvaro-name[b-f9wey9hmq3] {
    font-weight: 600;
    color: var(--bs-body-color);
    line-height: 1.25;
}

.narvaro-meta[b-f9wey9hmq3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.125rem;
    font-size: 0.8125rem;
}

.narvaro-status-text[b-f9wey9hmq3] {
    color: var(--bs-secondary-color);
}

.narvaro-attendance select[b-f9wey9hmq3] {
    width: 220px;
    max-width: 100%;
}

/* ---------- Sektionsblock under raden (ställföreträdare + bevis) ---------- */

.narvaro-block[b-f9wey9hmq3] {
    margin-top: 0.625rem;
    /* Linjera under namnet (avatar 38px + 0.75rem gap). */
    padding-left: calc(38px + 0.75rem);
}

.narvaro-block-label[b-f9wey9hmq3] {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--bs-secondary-color);
    font-weight: 600;
    margin-bottom: 0.375rem;
}

/* ---------- Kallelsebevis-rad: chips + uppladdningsknapp ---------- */

.narvaro-bevis[b-f9wey9hmq3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.narvaro-chip[b-f9wey9hmq3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.625rem 0.25rem 0.625rem;
    background: #f6f7f9;
    border: 1px solid var(--bs-border-color);
    border-radius: 999px;
    font-size: 0.8125rem;
    line-height: 1.3;
    max-width: 100%;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.narvaro-chip:hover[b-f9wey9hmq3] {
    background: #fff;
    border-color: #c8cdd3;
}

.narvaro-chip > i[b-f9wey9hmq3] {
    color: var(--bs-secondary-color);
    flex-shrink: 0;
}

.narvaro-chip-rek > i[b-f9wey9hmq3] {
    color: var(--bs-info-text-emphasis);
}

.narvaro-chip-name[b-f9wey9hmq3] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--bs-body-color);
    text-decoration: none;
}

.narvaro-chip-name:hover[b-f9wey9hmq3] {
    text-decoration: underline;
}

.narvaro-chip-tag[b-f9wey9hmq3] {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.narvaro-chip-switch[b-f9wey9hmq3] {
    padding-left: 2.25rem;
    font-size: 0.75rem;
    color: var(--bs-secondary-color);
}

.narvaro-chip-switch .form-check-input[b-f9wey9hmq3] {
    margin-top: 0.125rem;
}

.narvaro-chip-remove[b-f9wey9hmq3] {
    line-height: 1;
}

/* Streckad "lägg till"-knapp som tydligt skiljer sig från fyllda chips. */
.narvaro-upload[b-f9wey9hmq3] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.75rem;
    border: 1px dashed var(--bs-border-color);
    border-radius: 999px;
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
    cursor: pointer;
    margin: 0;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, border-style 0.15s ease;
}

.narvaro-upload:hover[b-f9wey9hmq3] {
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
    border-color: var(--bs-primary);
    border-style: solid;
}

/* ---------- Responsiva justeringar ---------- */

@media (max-width: 575.98px) {
    .narvaro-block[b-f9wey9hmq3] {
        padding-left: 0;
    }
    .narvaro-attendance[b-f9wey9hmq3],
    .narvaro-attendance select[b-f9wey9hmq3] {
        width: 100%;
    }
    .narvaro-section-header[b-f9wey9hmq3] {
        padding: 0.75rem 1rem;
    }
    .narvaro-item[b-f9wey9hmq3] {
        padding: 0.75rem 1rem 0.75rem 1.25rem;
    }
}
/* /Components/Pages/Bouppteckning/Shared/FileListComponent.razor.rz.scp.css */
.file-list-container[b-adizaqsiv1] {
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    margin-bottom: 1.5rem;
    transition: all 0.3s ease;
    overflow: hidden;
    border: 1px solid transparent;
}

/* Animation for the container highlight with ease-out transition */
.highlight-animation[b-adizaqsiv1] {
    animation: container-highlight-b-adizaqsiv1 6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes container-highlight-b-adizaqsiv1 {
    0% {
        box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.4);
    }

    45% { /* Hold for about 3 seconds */
        box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.4);
    }

    100% { /* Gradual fade out over remaining time */
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }
}

.file-list-header[b-adizaqsiv1] {
    padding: 0.5rem;
    background-color: var(--bptModelHeaderBgColor);
    color: var(--bptModalHeaderText);
    padding-left: 1rem;
    border-radius: 10px 10px 0 0;
}

    .file-list-header h5[b-adizaqsiv1] {
        margin: 0;
        font-weight: 500;
    }

.file-list[b-adizaqsiv1] {
    padding: 0.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem;
}

/* Card design for each file */
.file-item[b-adizaqsiv1] {
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
    border: 1px solid transparent;
}

    .file-item:hover[b-adizaqsiv1] {
        transform: translateY(-4px);
        box-shadow: 0 8px 15px rgba(0,0,0,0.1);
    }

/* New file badge and highlight with smooth fade-out */
.file-badge[b-adizaqsiv1] {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    animation: badge-fade-b-adizaqsiv1 6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

    .file-badge span[b-adizaqsiv1] {
        background-color: var(--bptButtonBackground);
        color: white;
        padding: 4px 10px;
        border-radius: 12px;
        font-size: 0.75rem;
        font-weight: bold;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }

@keyframes badge-fade-b-adizaqsiv1 {
    0% {
        opacity: 1;
    }

    45% { /* Stay fully visible for about 3 seconds */
        opacity: 1;
    }

    100% { /* Smooth fade out over remaining time */
        opacity: 0;
    }
}

/* Highlight animation for new/updated files with smooth transition */
.file-item.new-file-highlight[b-adizaqsiv1] {
    animation: item-highlight-b-adizaqsiv1 6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes item-highlight-b-adizaqsiv1 {
    0% {
        box-shadow: 0 0 0 2px var(--bptButtonBackground), 0 0 15px rgba(0, 123, 255, 0.4);
        background-color: rgba(0, 123, 255, 0.05);
    }

    45% { /* Hold for about 3 seconds */
        box-shadow: 0 0 0 2px var(--bptButtonBackground), 0 0 15px rgba(0, 123, 255, 0.4);
        background-color: rgba(0, 123, 255, 0.05);
    }

    100% { /* Smooth fade out over remaining time */
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
        background-color: white;
    }
}

/* Card header with icon */
.file-header[b-adizaqsiv1] {
    display: flex;
    align-items: center;
    padding: 1rem;
    border-bottom: 1px solid #f0f0f0;
    background-color: #f8f9fa;
}

.file-icon[b-adizaqsiv1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    font-size: 2rem;
    border-radius: 50%;
    background-color: #f0f0f0;
    margin-right: 1rem;
}

    .file-icon .bi-filetype-pdf[b-adizaqsiv1] {
        color: var(--bptDangerColor);
    }

    .file-icon .bi-filetype-docx[b-adizaqsiv1] {
        color: var(--bptButtonBackground);
    }

    .file-icon .bi-file-earmark-richtext[b-adizaqsiv1] {
        color: var(--bptButtonSecondaryBackground);
    }

/* Card body with file info */
.file-content[b-adizaqsiv1] {
    padding: 1rem;
    flex: 1;
}

.file-title[b-adizaqsiv1] {
    font-weight: 500;
    margin-bottom: 0.75rem;
    color: var(--bptMenuText);
    font-size: 0.8rem;
    line-height: 1.3;
}

.file-meta[b-adizaqsiv1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #6c757d;
}

.meta-item[b-adizaqsiv1] {
    display: flex;
    align-items: center;
}

    .meta-item i[b-adizaqsiv1] {
        width: 18px;
        margin-right: 0.5rem;
        opacity: 0.7;
    }

.file-type[b-adizaqsiv1] {
    display: inline-block;
    background-color: #e9ecef;
    padding: 0.15rem 0.5rem;
    border-radius: 12px;
    font-weight: 500;
    font-size: 0.75rem;
    margin-top: 0.5rem;
}

/* Card footer with actions */
.file-actions[b-adizaqsiv1] {
    display: flex;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-top: 1px solid #f0f0f0;
}

    .file-actions .btn[b-adizaqsiv1] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
    }

    .file-actions .btn-sm[b-adizaqsiv1] {
        padding: 0.25rem 0.5rem;
        font-size: 0.875rem;
    }
/* /Components/Pages/ForProfessionella.razor.rz.scp.css */
/* ============================================
   ForProfessionella — Premium Sales Page
   Aesthetic: Nordic Legal Trust · High-End
   Typography: Playfair Display + Outfit
   Palette: Navy #1B2A4A · Copper #C4875A · Warm neutrals
   ============================================ */

/* --- Keyframes --- */
@keyframes pro-fadeUp-b-u15r098x72 {
    from { opacity: 0; transform: translateY(40px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes pro-float-b-u15r098x72 {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-12px); }
}

@keyframes pro-pulse-b-u15r098x72 {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50%      { opacity: 1; transform: scale(1.15); }
}

@keyframes pro-shimmer-b-u15r098x72 {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

@keyframes pro-orb-drift-1-b-u15r098x72 {
    0%   { transform: translate(0, 0) scale(1); }
    33%  { transform: translate(40px, -25px) scale(1.06); }
    66%  { transform: translate(-15px, -50px) scale(0.97); }
    100% { transform: translate(0, 0) scale(1); }
}

@keyframes pro-orb-drift-2-b-u15r098x72 {
    0%   { transform: translate(0, 0) scale(1); }
    33%  { transform: translate(-30px, 35px) scale(1.04); }
    66%  { transform: translate(25px, -20px) scale(0.96); }
    100% { transform: translate(0, 0) scale(1); }
}

.pro-page[b-u15r098x72] {
    font-family: 'Outfit', sans-serif;
    color: #2D3748;
    overflow-x: hidden; /* safeguard: keep decorative orbs/blurs from causing horizontal scroll on mobile */
}

/* ═══════════════ HERO ═══════════════ */
.pro-hero[b-u15r098x72] {
    background: linear-gradient(160deg, #0F1B2D 0%, #1B2A4A 45%, #243556 100%);
    color: #fff;
    padding: 6rem 0 5rem;
    overflow: hidden;
    position: relative;
}

.pro-hero-orb[b-u15r098x72] {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(80px);
}

.pro-hero-orb-1[b-u15r098x72] {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(196, 135, 90, 0.12) 0%, transparent 70%);
    top: -15%;
    right: -8%;
    animation: pro-orb-drift-1-b-u15r098x72 20s ease-in-out infinite;
}

.pro-hero-orb-2[b-u15r098x72] {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(107, 143, 113, 0.1) 0%, transparent 70%);
    bottom: -10%;
    left: -5%;
    animation: pro-orb-drift-2-b-u15r098x72 25s ease-in-out infinite;
}

.pro-hero .container[b-u15r098x72] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 4rem;
    align-items: center;
    position: relative;
    z-index: 1;
}

.pro-hero-content[b-u15r098x72] {
    animation: pro-fadeUp-b-u15r098x72 0.8s ease-out both;
}

.pro-badge[b-u15r098x72] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(196, 135, 90, 0.15);
    border: 1px solid rgba(196, 135, 90, 0.35);
    color: #E8B992;
    padding: 0.4rem 1rem;
    border-radius: 2rem;
    font-size: 0.82rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    margin-bottom: 1.2rem;
}

.pro-badge-dot[b-u15r098x72] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6B8F71;
    animation: pro-pulse-b-u15r098x72 2s ease-in-out infinite;
}

.pro-hero h1[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.18;
    margin-bottom: 1.4rem;
    letter-spacing: -0.02em;
    color: #FFFFFF;
}

.pro-hero h1 em[b-u15r098x72] {
    font-style: normal;
    color: #E8B992;
}

.pro-hero-lead[b-u15r098x72] {
    font-size: 1.1rem;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 2rem;
    max-width: 540px;
}

.pro-hero-actions[b-u15r098x72] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 2.5rem;
}

.pro-btn-primary[b-u15r098x72] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: #C4875A;
    color: #fff;
    padding: 0.9rem 1.6rem;
    border-radius: 0.6rem;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.pro-btn-primary[b-u15r098x72]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s ease;
}

.pro-btn-primary:hover[b-u15r098x72]::before {
    left: 125%;
}

.pro-btn-primary:hover[b-u15r098x72] {
    background: #B3764D;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(196, 135, 90, 0.35);
}

.pro-btn-primary:active[b-u15r098x72] {
    transform: translateY(0) scale(0.98);
}

.pro-btn-icon[b-u15r098x72] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    font-size: 0.85rem;
    transition: transform 0.3s ease;
}

.pro-btn-primary:hover .pro-btn-icon[b-u15r098x72] {
    transform: translateX(3px);
}

.pro-btn-secondary[b-u15r098x72] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: transparent;
    color: #fff;
    padding: 0.9rem 1.6rem;
    border-radius: 0.6rem;
    border: 1.5px solid rgba(255, 255, 255, 0.25);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.pro-btn-secondary:hover[b-u15r098x72] {
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    transform: translateY(-1px);
}

.pro-btn-primary-light[b-u15r098x72] {
    background: #E8B992;
    color: #1B2A4A;
}

.pro-btn-primary-light:hover[b-u15r098x72] {
    background: #D4A06D;
    color: #1B2A4A;
}

/* Hero Trust Bar */
.pro-hero-trust[b-u15r098x72] {
    display: flex;
    gap: 1.8rem;
    flex-wrap: wrap;
}

.pro-trust-item[b-u15r098x72] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.02em;
}

.pro-trust-item i[b-u15r098x72] {
    font-size: 0.85rem;
    color: rgba(107, 143, 113, 0.8);
}

/* Dashboard Preview → Screenshot Frame */
.pro-hero-visual[b-u15r098x72] {
    animation: pro-fadeUp-b-u15r098x72 0.8s ease-out 0.2s both;
}

.pro-screenshot-frame[b-u15r098x72] {
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.35);
    overflow: hidden;
    transform: perspective(800px) rotateY(-2deg) rotateX(1deg);
    animation: pro-float-b-u15r098x72 6s ease-in-out infinite;
}

.pro-screenshot-frame-sm[b-u15r098x72] {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
    border-radius: 0.75rem;
    transform: none;
    animation: none;
    border: 1px solid #E5E5E2;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease;
}

.pro-screenshot-frame-sm:hover[b-u15r098x72] {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 20px 50px rgba(27, 42, 74, 0.12);
}

.pro-screenshot-frame-lg[b-u15r098x72] {
    max-width: 900px;
    margin: 0 auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
    border: 1px solid #E5E5E2;
    transform: none;
    animation: none;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease;
}

.pro-screenshot-frame-lg:hover[b-u15r098x72] {
    transform: translateY(-4px);
    box-shadow: 0 30px 70px rgba(27, 42, 74, 0.12);
}

.pro-screenshot-img[b-u15r098x72] {
    width: 100%;
    height: auto;
    display: block;
}

/* Screenshot Showcase in highlight cards */
.pro-screenshot-showcase[b-u15r098x72] {
    border-radius: 0.75rem;
    overflow: hidden;
    border: 1px solid #E5E5E2;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.pro-screenshot-showcase:hover[b-u15r098x72] {
    transform: scale(1.02);
    box-shadow: 0 12px 40px rgba(27, 42, 74, 0.1);
}

.pro-showcase-img[b-u15r098x72] {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0.5rem;
}

/* Highlight card screenshot area */
.pro-highlight-card-screenshot[b-u15r098x72] {
    border-radius: 0.75rem;
    overflow: hidden;
    margin-bottom: 1.2rem;
    border: 1px solid #E5E5E2;
    transition: transform 0.3s ease;
}

.pro-highlight-card:hover .pro-highlight-card-screenshot[b-u15r098x72] {
    transform: scale(1.01);
}

.pro-highlight-card-screenshot img[b-u15r098x72] {
    width: 100%;
    height: auto;
    display: block;
}

/* Screenshot Gallery (AI section) */
.pro-screenshot-gallery[b-u15r098x72] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 4rem;
}

.pro-gallery-item[b-u15r098x72] {
    text-align: center;
}

.pro-gallery-caption[b-u15r098x72] {
    display: block;
    margin-top: 0.85rem;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 500;
    letter-spacing: 0.02em;
}

.pro-gallery-caption-dark[b-u15r098x72] {
    color: #6B7280;
}

/* AI section screenshot frame overrides */
.pro-ai-section .pro-screenshot-frame-sm[b-u15r098x72] {
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}

.pro-ai-section .pro-screenshot-frame-sm:hover[b-u15r098x72] {
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}

/* Screenshot Showcase Row (audience section) */
.pro-screenshot-showcase-row[b-u15r098x72] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.pro-showcase-item[b-u15r098x72] {
    text-align: center;
}

/* Section Showcase (large centered screenshot) */
.pro-section-showcase[b-u15r098x72] {
    margin-bottom: 3rem;
}

/* (removed: old screenshot chrome styles) */

/* ═══════════════ SOCIAL PROOF BAR ═══════════════ */
.pro-proof-bar[b-u15r098x72] {
    background: #FAFAF7;
    border-top: 1px solid #E5E5E2;
    border-bottom: 1px solid #E5E5E2;
    padding: 2.5rem 0;
}

.pro-proof-bar .container[b-u15r098x72] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.pro-proof-grid[b-u15r098x72] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
    flex-wrap: wrap;
}

.pro-proof-item[b-u15r098x72] {
    text-align: center;
}

.pro-proof-number[b-u15r098x72] {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 1.8rem;
    font-weight: 700;
    color: #1B2A4A;
    line-height: 1.1;
    margin-bottom: 0.3rem;
}

.pro-proof-label[b-u15r098x72] {
    font-size: 0.82rem;
    color: #6B7280;
    letter-spacing: 0.01em;
}

.pro-proof-divider[b-u15r098x72] {
    width: 1px;
    height: 40px;
    background: #D4D4D0;
}

/* ═══════════════ SECTIONS ═══════════════ */
.pro-section[b-u15r098x72] {
    padding: 5rem 0;
}

.pro-section-alt[b-u15r098x72] {
    background: #FAFAF7;
}

.pro-section .container[b-u15r098x72],
.pro-cta-section .container[b-u15r098x72] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.pro-section-header[b-u15r098x72] {
    text-align: center;
    margin-bottom: 3.5rem;
}

.pro-section-header h2[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 2.1rem;
    font-weight: 700;
    color: #1B2A4A;
    margin-bottom: 0.75rem;
    letter-spacing: -0.01em;
}

.pro-section-header p[b-u15r098x72] {
    font-size: 1.05rem;
    color: #6B7280;
    max-width: 620px;
    margin: 0 auto;
    line-height: 1.7;
}

/* ═══════════════ PROBLEMS GRID ═══════════════ */
.pro-problems-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.pro-problem-card[b-u15r098x72] {
    background: #fff;
    padding: 2rem 1.5rem;
    border-radius: 0.75rem;
    border: 1px solid #E5E5E2;
    text-align: center;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease;
}

.pro-problem-card:hover[b-u15r098x72] {
    transform: translateY(-6px);
    box-shadow: 0 12px 40px rgba(27, 42, 74, 0.08);
}

.pro-problem-icon[b-u15r098x72] {
    width: 56px;
    height: 56px;
    border-radius: 0.75rem;
    background: rgba(196, 135, 90, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    font-size: 1.4rem;
    color: #C4875A;
    transition: background 0.3s ease;
}

.pro-problem-card:hover .pro-problem-icon[b-u15r098x72] {
    background: rgba(196, 135, 90, 0.14);
}

.pro-problem-card h3[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.5rem;
}

.pro-problem-card p[b-u15r098x72] {
    font-size: 0.88rem;
    color: #6B7280;
    line-height: 1.65;
}

/* ═══════════════ HIGHLIGHT SECTION (NEW FEATURES) ═══════════════ */
.pro-highlight-section[b-u15r098x72] {
    background: linear-gradient(180deg, #fff 0%, #FAFAF7 100%);
    padding: 5rem 0;
}

.pro-highlight-section .container[b-u15r098x72] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.pro-badge-new[b-u15r098x72] {
    background: rgba(107, 143, 113, 0.12);
    border: 1px solid rgba(107, 143, 113, 0.35);
    color: #4D7A54;
    margin-bottom: 0.75rem;
}

.pro-highlight-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

.pro-highlight-card[b-u15r098x72] {
    background: #fff;
    border: 1px solid #E5E5E2;
    border-radius: 1rem;
    padding: 2.5rem;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease;
}

.pro-highlight-card:hover[b-u15r098x72] {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(27, 42, 74, 0.07);
}

.pro-highlight-card-wide[b-u15r098x72] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    align-items: center;
}

.pro-highlight-card-wide + .pro-highlight-card[b-u15r098x72] {
    /* Side-by-side on desktop */
}

.pro-highlight-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

/* Make the two smaller cards sit side by side */
.pro-highlight-card:not(.pro-highlight-card-wide)[b-u15r098x72] {
    /* Will be laid out in sub-grid below */
}

.pro-highlight-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.pro-highlight-card-wide[b-u15r098x72] {
    grid-column: 1 / -1;
}

.pro-highlight-badge[b-u15r098x72] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: rgba(196, 135, 90, 0.1);
    color: #C4875A;
    padding: 0.3rem 0.8rem;
    border-radius: 2rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    margin-bottom: 0.85rem;
}

.pro-highlight-badge-postnord[b-u15r098x72] {
    background: rgba(27, 42, 74, 0.08);
    color: #1B2A4A;
}

.pro-highlight-badge-sage[b-u15r098x72] {
    background: rgba(107, 143, 113, 0.1);
    color: #4D7A54;
}

.pro-highlight-card h3[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: #1B2A4A;
    margin-bottom: 0.65rem;
}

.pro-highlight-card > p[b-u15r098x72],
.pro-highlight-content > p[b-u15r098x72] {
    font-size: 0.93rem;
    color: #6B7280;
    line-height: 1.7;
    margin-bottom: 1.2rem;
}

.pro-highlight-list[b-u15r098x72] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pro-highlight-list li[b-u15r098x72] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.3rem 0;
    font-size: 0.88rem;
    color: #4A5568;
    line-height: 1.55;
}

.pro-highlight-list li i[b-u15r098x72] {
    color: #6B8F71;
    font-size: 0.8rem;
    margin-top: 0.22rem;
    flex-shrink: 0;
}

/* Highlight Visual */
.pro-highlight-visual[b-u15r098x72] {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ═══════════════ AI SECTION ═══════════════ */
.pro-ai-section[b-u15r098x72] {
    background: linear-gradient(160deg, #0F1B2D 0%, #1B2A4A 50%, #243556 100%);
    color: #fff;
    padding: 5rem 0;
    position: relative;
    overflow: hidden;
}

.pro-ai-section[b-u15r098x72]::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -15%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(196, 135, 90, 0.08) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.pro-ai-section .pro-section-header h2[b-u15r098x72] {
    color: #fff;
}

.pro-ai-section .pro-section-header p[b-u15r098x72] {
    color: rgba(255, 255, 255, 0.75);
}

.pro-badge-ai[b-u15r098x72] {
    background: rgba(196, 135, 90, 0.15);
    border: 1px solid rgba(196, 135, 90, 0.4);
    color: #E8B992;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.pro-ai-showcase[b-u15r098x72] {
    max-width: 1000px;
    margin: 0 auto;
}

.pro-ai-flow[b-u15r098x72] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0.8rem;
}

.pro-ai-step[b-u15r098x72] {
    flex: 1;
    text-align: center;
    max-width: 220px;
}

.pro-ai-step-icon[b-u15r098x72] {
    width: 64px;
    height: 64px;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    font-size: 1.6rem;
    color: rgba(255, 255, 255, 0.7);
    transition: all 0.3s ease;
}

.pro-ai-step:hover .pro-ai-step-icon[b-u15r098x72] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
}

.pro-ai-step-icon-active[b-u15r098x72] {
    background: rgba(196, 135, 90, 0.15);
    border-color: rgba(196, 135, 90, 0.4);
    color: #E8B992;
    box-shadow: 0 0 30px rgba(196, 135, 90, 0.15);
}

.pro-ai-step h3[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 0.5rem;
}

.pro-ai-step p[b-u15r098x72] {
    font-size: 0.83rem;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.6;
}

.pro-ai-arrow[b-u15r098x72] {
    display: flex;
    align-items: center;
    padding-top: 1.2rem;
    color: rgba(255, 255, 255, 0.2);
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* ═══════════════ FEATURES GRID ═══════════════ */
.pro-features-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.pro-feature[b-u15r098x72] {
    background: #fff;
    padding: 2rem;
    border-radius: 0.75rem;
    border: 1px solid #E5E5E2;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease;
}

.pro-feature:hover[b-u15r098x72] {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
}

.pro-feature-icon[b-u15r098x72] {
    width: 48px;
    height: 48px;
    border-radius: 0.75rem;
    background: rgba(107, 143, 113, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    font-size: 1.3rem;
    color: #6B8F71;
    transition: background 0.3s ease;
}

.pro-feature:hover .pro-feature-icon[b-u15r098x72] {
    background: rgba(107, 143, 113, 0.14);
}

.pro-feature h3[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.5rem;
}

.pro-feature p[b-u15r098x72] {
    font-size: 0.88rem;
    color: #6B7280;
    line-height: 1.65;
}

.pro-feature-ai[b-u15r098x72] {
    border-color: rgba(196, 135, 90, 0.2);
    background: linear-gradient(135deg, #FFFDF9, #FFF8F0);
}

.pro-feature-icon-ai[b-u15r098x72] {
    background: rgba(196, 135, 90, 0.1) !important;
    color: #C4875A !important;
}

/* ═══════════════ AUDIENCE GRID ═══════════════ */
.pro-audience-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}

.pro-audience-card[b-u15r098x72] {
    background: #fff;
    padding: 2.5rem;
    border-radius: 1rem;
    border: 1px solid #E5E5E2;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.pro-audience-card:hover[b-u15r098x72] {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
    transform: translateY(-3px);
}

.pro-audience-card-accent[b-u15r098x72] {
    border-color: rgba(196, 135, 90, 0.25);
    background: linear-gradient(135deg, #FFFDF9 0%, #FFF8F0 100%);
}

.pro-audience-icon[b-u15r098x72] {
    width: 56px;
    height: 56px;
    border-radius: 0.75rem;
    background: rgba(27, 42, 74, 0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.2rem;
    font-size: 1.5rem;
    color: #1B2A4A;
}

.pro-audience-card-accent .pro-audience-icon[b-u15r098x72] {
    background: rgba(196, 135, 90, 0.1);
    color: #C4875A;
}

.pro-audience-card h3[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 1.3rem;
    font-weight: 700;
    color: #1B2A4A;
    margin-bottom: 0.75rem;
}

.pro-audience-card p[b-u15r098x72] {
    font-size: 0.93rem;
    color: #6B7280;
    line-height: 1.7;
    margin-bottom: 1.2rem;
}

.pro-audience-card ul[b-u15r098x72] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pro-audience-card li[b-u15r098x72] {
    position: relative;
    padding: 0.4rem 0 0.4rem 1.8rem;
    font-size: 0.88rem;
    color: #4A5568;
}

.pro-audience-card li[b-u15r098x72]::before {
    content: "\F26E";
    font-family: 'bootstrap-icons';
    position: absolute;
    left: 0;
    color: #6B8F71;
    font-size: 0.85rem;
}

/* ═══════════════ FUNERAL GRID ═══════════════ */
.pro-funeral-grid[b-u15r098x72] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.pro-funeral-grid-2col[b-u15r098x72] {
    grid-template-columns: repeat(2, 1fr);
}

.pro-funeral-card[b-u15r098x72] {
    background: #fff;
    border: 1px solid #E5E5E2;
    border-radius: 0.75rem;
    padding: 2rem;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease;
}

.pro-funeral-card:hover[b-u15r098x72] {
    transform: translateY(-4px);
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.06);
}

.pro-funeral-card-header[b-u15r098x72] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 0.75rem;
}

.pro-funeral-icon[b-u15r098x72] {
    width: 44px;
    height: 44px;
    border-radius: 0.65rem;
    background: rgba(196, 135, 90, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: #C4875A;
    flex-shrink: 0;
}

.pro-funeral-icon-sage[b-u15r098x72] {
    background: rgba(107, 143, 113, 0.08);
    color: #6B8F71;
}

.pro-funeral-icon-navy[b-u15r098x72] {
    background: rgba(27, 42, 74, 0.06);
    color: #1B2A4A;
}

.pro-funeral-icon-warm[b-u15r098x72] {
    background: rgba(212, 160, 109, 0.1);
    color: #B3764D;
}

.pro-funeral-card h3[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1B2A4A;
    margin: 0;
}

.pro-funeral-card > p[b-u15r098x72] {
    font-size: 0.88rem;
    color: #6B7280;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.pro-funeral-features[b-u15r098x72] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pro-funeral-features li[b-u15r098x72] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.35rem 0;
    font-size: 0.84rem;
    color: #4A5568;
    line-height: 1.5;
}

.pro-funeral-features li i[b-u15r098x72] {
    color: #6B8F71;
    font-size: 0.8rem;
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.pro-funeral-features li i.bi-stars[b-u15r098x72] {
    color: #C4875A;
}

/* ═══════════════ BADGE VARIANTS ═══════════════ */
.pro-badge-dark[b-u15r098x72] {
    background: rgba(107, 143, 113, 0.1);
    border-color: rgba(107, 143, 113, 0.35);
    color: #4D7A54;
    margin-bottom: 0.75rem;
}

/* ═══════════════ FAQ ═══════════════ */
.pro-faq-list[b-u15r098x72] {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pro-faq-item[b-u15r098x72] {
    background: #fff;
    border: 1px solid #E5E5E2;
    border-radius: 0.75rem;
    overflow: hidden;
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

.pro-faq-item:hover[b-u15r098x72] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
}

.pro-faq-item[open][b-u15r098x72] {
    border-color: rgba(196, 135, 90, 0.3);
}

.pro-faq-question[b-u15r098x72] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    cursor: pointer;
    font-family: 'Playfair Display', serif;
    font-size: 1rem;
    font-weight: 600;
    color: #1B2A4A;
    list-style: none;
    user-select: none;
    transition: background 0.2s ease;
}

.pro-faq-question:hover[b-u15r098x72] {
    background: rgba(250, 250, 247, 0.6);
}

.pro-faq-question[b-u15r098x72]::-webkit-details-marker {
    display: none;
}

.pro-faq-question i[b-u15r098x72] {
    font-size: 0.85rem;
    color: #9CA3AF;
    transition: transform 0.3s ease;
    flex-shrink: 0;
    margin-left: 1rem;
}

.pro-faq-item[open] .pro-faq-question i[b-u15r098x72] {
    transform: rotate(180deg);
}

.pro-faq-answer[b-u15r098x72] {
    padding: 0 1.5rem 1.25rem;
}

.pro-faq-answer p[b-u15r098x72] {
    font-size: 0.92rem;
    color: #6B7280;
    line-height: 1.7;
    margin: 0;
}

/* ═══════════════ CTA ═══════════════ */
.pro-cta-section[b-u15r098x72] {
    background: linear-gradient(160deg, #0F1B2D 0%, #1B2A4A 50%, #2C3E6B 100%);
    padding: 5rem 0;
    text-align: center;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.pro-cta-section[b-u15r098x72]::before {
    content: '';
    position: absolute;
    top: -40%;
    left: 50%;
    transform: translateX(-50%);
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(196, 135, 90, 0.06) 0%, transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}

.pro-cta-content[b-u15r098x72] {
    position: relative;
    z-index: 1;
}

.pro-cta-content h2[b-u15r098x72] {
    font-family: 'Playfair Display', serif;
    color: #FFFFFF;
    font-size: 2.1rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.pro-cta-content p[b-u15r098x72] {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 2rem;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.pro-cta-content .pro-hero-actions[b-u15r098x72] {
    justify-content: center;
    margin-bottom: 1.5rem;
}

.pro-cta-sub[b-u15r098x72] {
    font-size: 0.9rem !important;
    color: rgba(255, 255, 255, 0.5) !important;
}

.pro-cta-sub a[b-u15r098x72] {
    color: #E8B992;
    text-decoration: none;
    transition: color 0.2s ease;
}

.pro-cta-sub a:hover[b-u15r098x72] {
    color: #D4A06D;
    text-decoration: underline;
}

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width: 991.98px) {
    .pro-section[b-u15r098x72] {
        padding: 4rem 0;
    }

    .pro-section-header[b-u15r098x72] {
        margin-bottom: 2.5rem;
    }

    .pro-section-header h2[b-u15r098x72] {
        font-size: 1.9rem;
    }

    .pro-highlight-card[b-u15r098x72] {
        padding: 2rem;
    }

    .pro-hero .container[b-u15r098x72] {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .pro-hero h1[b-u15r098x72] {
        font-size: 2.1rem;
    }

    .pro-hero-lead[b-u15r098x72] {
        margin: 0 auto 2rem;
    }

    .pro-hero-actions[b-u15r098x72] {
        justify-content: center;
    }

    .pro-hero-trust[b-u15r098x72] {
        justify-content: center;
    }

    .pro-screenshot-frame[b-u15r098x72] {
        transform: none;
        max-width: 420px;
        margin: 0 auto;
    }

    .pro-screenshot-gallery[b-u15r098x72] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }

    .pro-screenshot-showcase-row[b-u15r098x72] {
        grid-template-columns: repeat(2, 1fr);
    }

    .pro-problems-grid[b-u15r098x72] {
        grid-template-columns: repeat(2, 1fr);
    }

    .pro-features-grid[b-u15r098x72] {
        grid-template-columns: repeat(2, 1fr);
    }

    .pro-funeral-grid[b-u15r098x72] {
        grid-template-columns: repeat(2, 1fr);
    }

    .pro-highlight-card-wide[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-highlight-grid[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-ai-flow[b-u15r098x72] {
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }

    .pro-ai-arrow[b-u15r098x72] {
        transform: rotate(90deg);
        padding-top: 0;
    }
}

@media (max-width: 575.98px) {
    .pro-hero[b-u15r098x72] {
        padding: 3.5rem 0 2.5rem;
    }

    .pro-hero h1[b-u15r098x72] {
        font-size: 1.65rem;
    }

    .pro-section[b-u15r098x72] {
        padding: 3.5rem 0;
    }

    .pro-problems-grid[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-features-grid[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-funeral-grid[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-funeral-grid-2col[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-audience-grid[b-u15r098x72] {
        grid-template-columns: 1fr;
    }

    .pro-hero-actions[b-u15r098x72] {
        flex-direction: column;
        align-items: center;
    }

    .pro-ai-section[b-u15r098x72] {
        padding: 3rem 0;
    }

    .pro-btn-primary[b-u15r098x72],
    .pro-btn-secondary[b-u15r098x72] {
        width: 100%;
        justify-content: center;
    }

    .pro-proof-grid[b-u15r098x72] {
        flex-direction: column;
        gap: 1.5rem;
    }

    .pro-proof-divider[b-u15r098x72] {
        width: 40px;
        height: 1px;
    }

    .pro-screenshot-gallery[b-u15r098x72] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        margin-top: 2.5rem;
    }

    .pro-screenshot-showcase-row[b-u15r098x72] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .pro-section-showcase[b-u15r098x72] {
        margin-bottom: 2rem;
    }

    .pro-highlight-card[b-u15r098x72] {
        padding: 1.8rem;
    }

    .pro-screenshot-frame-lg[b-u15r098x72] {
        max-width: 100%;
    }

    /* Tighter horizontal padding so content gets more room on phones */
    .pro-hero .container[b-u15r098x72],
    .pro-section .container[b-u15r098x72],
    .pro-cta-section .container[b-u15r098x72],
    .pro-proof-bar .container[b-u15r098x72],
    .pro-highlight-section .container[b-u15r098x72] {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .pro-section-header[b-u15r098x72] {
        margin-bottom: 2rem;
    }

    .pro-section-header h2[b-u15r098x72] {
        font-size: 1.5rem;
    }

    .pro-section-header p[b-u15r098x72] {
        font-size: 0.95rem;
    }

    .pro-cta-content h2[b-u15r098x72] {
        font-size: 1.6rem;
    }

    .pro-funeral-card[b-u15r098x72],
    .pro-audience-card[b-u15r098x72],
    .pro-problem-card[b-u15r098x72] {
        padding: 1.5rem;
    }

    .pro-proof-number[b-u15r098x72] {
        font-size: 1.5rem;
    }
}

@media (max-width: 400px) {
    .pro-hero h1[b-u15r098x72] {
        font-size: 1.45rem;
    }

    .pro-badge[b-u15r098x72] {
        font-size: 0.72rem;
        padding: 0.35rem 0.8rem;
    }

    .pro-section-header h2[b-u15r098x72] {
        font-size: 1.4rem;
    }
}
/* /Components/Pages/GuidePages/GuideArticle.razor.rz.scp.css */
/* ============================================
   Guide Article Component Styles — v3
   Aesthetic: Nordic Legal Trust · Editorial
   Typography: Playfair Display + Outfit
   Palette: Navy #1B2A4A · Copper #C4875A · Gold #D4A06D
            Sage #6B8F71 · Neutrals #FAFAF7/#F5F0EA/#EDE7DD
   Note: literal colour values — :root custom properties are
   not supported in Blazor scoped CSS (.razor.css). JS-injected
   nodes (the TOC list) are reached with ::deep.
   ============================================ */

/* === Reading progress bar === */
.guide-progress[b-pujyfpay6f] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: transparent;
    z-index: 1030;
    pointer-events: none;
}

.guide-progress-bar[b-pujyfpay6f] {
    display: block;
    height: 100%;
    width: 100%;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, #C4875A, #D4A06D);
    will-change: transform;
}

/* === Breadcrumb === */
.guide-breadcrumb[b-pujyfpay6f] {
    background: #FAFAF7;
    border-bottom: 1px solid #EDE7DD;
    padding: 0.75rem 0;
}

.breadcrumb-list[b-pujyfpay6f] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
}

.breadcrumb-list li[b-pujyfpay6f]::before {
    content: '›';
    margin-right: 0.5rem;
    color: #9AA3B0;
}

.breadcrumb-list li:first-child[b-pujyfpay6f]::before {
    display: none;
}

.breadcrumb-list a[b-pujyfpay6f] {
    color: #5A6474;
    text-decoration: none;
    transition: color 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.breadcrumb-list a:hover[b-pujyfpay6f] {
    color: #C4875A;
}

.breadcrumb-list .active[b-pujyfpay6f] {
    color: #1B2A4A;
    font-weight: 500;
}

/* === Page Layout === */
.guide-page[b-pujyfpay6f] {
    background: #FAFAF7;
    min-height: 100dvh;
}

/* === Article masthead === */
.guide-hero[b-pujyfpay6f] {
    position: relative;
    overflow: hidden;
    padding: 3.5rem 0 3rem;
    background: linear-gradient(160deg, #FAFAF7 0%, #F5F0EA 45%, #EDE7DD 100%);
    border-bottom: 1px solid rgba(196, 135, 90, 0.18);
}

.guide-hero-deco[b-pujyfpay6f] {
    position: absolute;
    top: -40%;
    right: -8%;
    width: 42%;
    height: 180%;
    background: radial-gradient(ellipse, rgba(196, 135, 90, 0.10) 0%, transparent 65%);
    pointer-events: none;
}

.guide-hero .container[b-pujyfpay6f] {
    position: relative;
    z-index: 1;
    max-width: 1180px;
}

.guide-category[b-pujyfpay6f] {
    display: inline-block;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #C4875A;
    margin-bottom: 0.85rem;
}

.guide-title[b-pujyfpay6f] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(2.1rem, 4vw, 3rem);
    font-weight: 700;
    color: #1B2A4A;
    line-height: 1.12;
    margin-bottom: 1.1rem;
    letter-spacing: -0.018em;
    text-wrap: balance;
    max-width: 16ch;
}

.guide-intro[b-pujyfpay6f] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.18rem;
    line-height: 1.7;
    color: #5A6474;
    max-width: 60ch;
    text-wrap: pretty;
}

.guide-meta[b-pujyfpay6f] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 1.5rem;
    margin-top: 1.5rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.82rem;
    color: #5A6474;
}

.guide-meta span[b-pujyfpay6f] {
    display: inline-flex;
    align-items: center;
}

.guide-meta i[b-pujyfpay6f] {
    margin-right: 0.4rem;
    color: #C4875A;
    font-size: 0.95rem;
}

/* === Two-column reading layout === */
.guide-layout[b-pujyfpay6f] {
    display: grid;
    grid-template-columns: 270px 1fr;
    gap: 3.5rem;
    padding: 3rem 0 4.5rem;
    align-items: start;
    max-width: 1180px;
    margin: 0 auto;
}

/* === Sidebar === */
.guide-sidebar[b-pujyfpay6f] {
    position: sticky;
    top: 6.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* --- Table of contents (scroll-spy) --- */
.guide-toc[b-pujyfpay6f] {
    background: #FFFFFF;
    border: 1px solid #EDE7DD;
    border-radius: 0.9rem;
    overflow: hidden;
}

.guide-toc-toggle[b-pujyfpay6f] {
    display: none; /* desktop: panel always open */
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.9rem 1.25rem;
    background: none;
    border: none;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1B2A4A;
    cursor: pointer;
}

.guide-toc-toggle i[b-pujyfpay6f] { color: #C4875A; }

.guide-toc-chevron[b-pujyfpay6f] {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-toc.is-open .guide-toc-chevron[b-pujyfpay6f] {
    transform: rotate(180deg);
}

.guide-toc-panel[b-pujyfpay6f] {
    padding: 1.4rem 1.4rem 1.1rem;
}

.guide-toc-title[b-pujyfpay6f] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #C4875A;
    margin: 0 0 0.9rem;
}

.guide-toc-list[b-pujyfpay6f] {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

/* Vertical rail behind the TOC items */
.guide-toc-list[b-pujyfpay6f]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.35rem;
    bottom: 0.35rem;
    width: 2px;
    background: #EDE7DD;
    border-radius: 2px;
}

/* ::deep — TOC items are injected by guide-article.js (unscoped nodes) */
.guide-toc-list[b-pujyfpay6f]  li {
    margin: 0;
    position: relative;
}

.guide-toc-list[b-pujyfpay6f]  a {
    display: block;
    padding: 0.4rem 0 0.4rem 1rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.86rem;
    line-height: 1.4;
    color: #5A6474;
    text-decoration: none;
    border-left: 2px solid transparent;
    margin-left: -1px;
    transition: color 0.25s ease, border-color 0.25s ease;
}

.guide-toc-list[b-pujyfpay6f]  a:hover {
    color: #1B2A4A;
}

.guide-toc-list[b-pujyfpay6f]  li.active a {
    color: #1B2A4A;
    font-weight: 600;
    border-left-color: #C4875A;
}

/* --- Secondary nav: all guides --- */
.guide-nav[b-pujyfpay6f] {
    background: #FFFFFF;
    border: 1px solid #EDE7DD;
    border-radius: 0.9rem;
    padding: 1.4rem;
    transition: box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-nav:hover[b-pujyfpay6f] {
    box-shadow: 0 4px 20px rgba(27, 42, 74, 0.06);
}

.guide-nav-title[b-pujyfpay6f] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #9AA3B0;
    margin-bottom: 0.9rem;
    padding-bottom: 0.7rem;
    border-bottom: 1px solid #EDE7DD;
}

.guide-nav-list[b-pujyfpay6f] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.guide-nav-list li[b-pujyfpay6f] {
    margin-bottom: 0.15rem;
}

.guide-nav-list li a[b-pujyfpay6f] {
    display: block;
    padding: 0.45rem 0.7rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.86rem;
    color: #5A6474;
    text-decoration: none;
    border-radius: 0.4rem;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    border-left: 2px solid transparent;
}

.guide-nav-list li a:hover[b-pujyfpay6f] {
    color: #1B2A4A;
    background: rgba(27, 42, 74, 0.04);
    padding-left: 0.85rem;
}

.guide-nav-list li.active a[b-pujyfpay6f] {
    color: #1B2A4A;
    font-weight: 600;
    background: rgba(196, 135, 90, 0.08);
    border-left-color: #C4875A;
}

/* === Sidebar CTA === */
.guide-sidebar-cta[b-pujyfpay6f] {
    background: linear-gradient(135deg, #1B2A4A 0%, #2D4A7A 100%);
    border-radius: 0.9rem;
    padding: 1.6rem;
    color: #FFFFFF;
}

.guide-sidebar-cta h4[b-pujyfpay6f] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 0.65rem;
    color: #FFFFFF;
}

.guide-sidebar-cta p[b-pujyfpay6f] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.86rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 1.2rem;
}

.guide-cta-btn[b-pujyfpay6f] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.65rem 1.25rem;
    background: linear-gradient(135deg, #C4875A 0%, #D4A06D 100%);
    color: #FFFFFF !important;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.6rem;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.guide-cta-btn[b-pujyfpay6f]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0);
    transition: background 0.2s ease;
    border-radius: inherit;
    pointer-events: none;
}

.guide-cta-btn:hover[b-pujyfpay6f] {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(196, 135, 90, 0.38);
    color: #FFFFFF !important;
}

.guide-cta-btn:active[b-pujyfpay6f]::after {
    background: rgba(0, 0, 0, 0.08);
}

.guide-cta-btn i[b-pujyfpay6f] {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.guide-cta-btn:hover i[b-pujyfpay6f] {
    transform: translateX(3px);
}

/* === Main Content === */
.guide-content[b-pujyfpay6f] {
    min-width: 0;
}

/* === Article Body === */
.guide-body[b-pujyfpay6f] {
    background: #FFFFFF;
    border: 1px solid #EDE7DD;
    border-radius: 1rem;
    padding: 3rem 3.25rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.03);
}

.guide-body[b-pujyfpay6f]  h2 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.65rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-top: 2.75rem;
    margin-bottom: 1.25rem;
    padding-top: 1.75rem;
    border-top: 1px solid #EDE7DD;
    scroll-margin-top: 120px;
    letter-spacing: -0.01em;
}

.guide-body[b-pujyfpay6f]  h2:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.guide-body[b-pujyfpay6f]  h3 {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.2rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-top: 2.25rem;
    margin-bottom: 1rem;
    scroll-margin-top: 120px;
}

.guide-body[b-pujyfpay6f]  p {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.02rem;
    line-height: 1.8;
    color: #3D4654;
    margin-bottom: 1.25rem;
    max-width: 68ch;
}

/* Lead paragraph: first paragraph after a top-level heading reads larger */
.guide-body[b-pujyfpay6f]  h2 + p {
    font-size: 1.08rem;
    color: #2C3543;
}

.guide-body[b-pujyfpay6f]  a {
    color: #A96D3F;
    text-decoration: underline;
    text-decoration-color: rgba(196, 135, 90, 0.35);
    text-underline-offset: 2px;
    transition: text-decoration-color 0.2s ease, color 0.2s ease;
}

.guide-body[b-pujyfpay6f]  a:hover {
    color: #C4875A;
    text-decoration-color: #C4875A;
}

.guide-body[b-pujyfpay6f]  ul, .guide-body[b-pujyfpay6f]  ol {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.02rem;
    line-height: 1.8;
    color: #3D4654;
    margin-bottom: 1.5rem;
    padding-left: 1.5rem;
    max-width: 68ch;
}

.guide-body[b-pujyfpay6f]  li {
    margin-bottom: 0.5rem;
}

.guide-body[b-pujyfpay6f]  ul li::marker {
    color: #C4875A;
}

.guide-body[b-pujyfpay6f]  strong {
    color: #1B2A4A;
    font-weight: 600;
}

/* Checklist — CSS-drawn checkbox marker + hanging indent for readability */
.guide-body[b-pujyfpay6f]  .guide-checklist ul {
    list-style: none !important;
    padding-left: 0;
    margin-bottom: 1.75rem;
}

.guide-body[b-pujyfpay6f]  .guide-checklist li {
    position: relative;
    padding: 0.7rem 0.65rem 0.7rem 2.4rem;
    margin-bottom: 0;
    border-radius: 0.55rem;
    transition: background 0.2s ease;
}

/* Drawn checkbox sitting in the left gutter (replaces the ☐ glyph) */
.guide-body[b-pujyfpay6f]  .guide-checklist li::before {
    content: "";
    position: absolute;
    left: 0.55rem;
    top: 0.98rem;
    width: 1.15rem;
    height: 1.15rem;
    box-sizing: border-box;
    border: 2px solid #D9C3AC;
    border-radius: 0.32rem;
    background: #FFFFFF;
    transition: border-color 0.2s ease, background 0.2s ease;
}

/* Inset divider aligned with the text column, not full-bleed */
.guide-body[b-pujyfpay6f]  .guide-checklist li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 2.4rem;
    right: 0.4rem;
    bottom: 0;
    height: 1px;
    background: #F1ECE3;
}

.guide-body[b-pujyfpay6f]  .guide-checklist li:hover {
    background: #FAF7F2;
}

.guide-body[b-pujyfpay6f]  .guide-checklist li:hover::before {
    border-color: #C4875A;
}

/* Print toolbar above the checklist */
.guide-body[b-pujyfpay6f]  .checklist-toolbar {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 1.5rem;
}

.guide-body[b-pujyfpay6f]  .checklist-print-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1.15rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.92rem;
    font-weight: 600;
    color: #1B2A4A;
    background: #FFFFFF;
    border: 1.5px solid #D9C3AC;
    border-radius: 0.7rem;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.guide-body[b-pujyfpay6f]  .checklist-print-btn:hover {
    color: #C4875A;
    border-color: #C4875A;
    background: #FAF7F2;
    transform: translateY(-1px);
}

.guide-body[b-pujyfpay6f]  .checklist-print-btn i {
    font-size: 1.05rem;
}

@media print {
    .guide-body[b-pujyfpay6f]  .checklist-toolbar {
        display: none;
    }
}

/* Info / warning callouts with a leading rule + soft tint */
.guide-body[b-pujyfpay6f]  .guide-info-box {
    background: linear-gradient(135deg, rgba(107, 143, 113, 0.09), rgba(107, 143, 113, 0.04));
    border: 1px solid rgba(107, 143, 113, 0.22);
    border-left: 4px solid #6B8F71;
    border-radius: 0.6rem;
    padding: 1.25rem 1.5rem;
    margin: 1.85rem 0;
}

.guide-body[b-pujyfpay6f]  .guide-info-box p {
    margin: 0;
    font-size: 0.96rem;
    color: #3D4654;
}

.guide-body[b-pujyfpay6f]  .guide-info-box p + p {
    margin-top: 0.75rem;
}

.guide-body[b-pujyfpay6f]  .guide-info-box strong {
    color: #3D6B45;
}

.guide-body[b-pujyfpay6f]  .guide-warning-box {
    background: linear-gradient(135deg, rgba(196, 135, 90, 0.09), rgba(196, 135, 90, 0.04));
    border: 1px solid rgba(196, 135, 90, 0.22);
    border-left: 4px solid #C4875A;
    border-radius: 0.6rem;
    padding: 1.25rem 1.5rem;
    margin: 1.85rem 0;
}

.guide-body[b-pujyfpay6f]  .guide-warning-box p {
    margin: 0;
    font-size: 0.96rem;
    color: #3D4654;
}

.guide-body[b-pujyfpay6f]  .guide-warning-box strong {
    color: #9A6234;
}

/* Footnote under a table (e.g. asterisk explaining price ranges) */
.guide-body[b-pujyfpay6f]  .guide-table-note {
    margin: -0.6rem 0 1.85rem;
    color: #6A7280;
}

.guide-body[b-pujyfpay6f]  .guide-table-note small {
    font-size: 0.85rem;
    line-height: 1.5;
}

/* Inline call-to-action box inside an article */
.guide-body[b-pujyfpay6f]  .guide-cta-box {
    background: linear-gradient(135deg, #F5F0EA 0%, #EDE7DD 100%);
    border: 1px solid rgba(196, 135, 90, 0.18);
    border-radius: 0.85rem;
    padding: 1.5rem 1.75rem;
    margin: 1.85rem 0;
}

.guide-body[b-pujyfpay6f]  .guide-cta-box p {
    margin: 0 0 1.15rem;
    font-size: 0.96rem;
    color: #3D4654;
}

.guide-body[b-pujyfpay6f]  .guide-cta-box strong {
    color: #9A6234;
}

.guide-body[b-pujyfpay6f]  .guide-cta-box-note {
    font-size: 0.86rem;
    color: #6A7280;
    line-height: 1.55;
}

.guide-body[b-pujyfpay6f]  .guide-cta-box-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.8rem 1.6rem;
    background: linear-gradient(135deg, #C4875A 0%, #D4A06D 100%);
    color: #FFFFFF !important;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.7rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.guide-body[b-pujyfpay6f]  .guide-cta-box-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(196, 135, 90, 0.35);
    color: #FFFFFF !important;
}

.guide-body[b-pujyfpay6f]  .guide-cta-box-btn i {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.guide-body[b-pujyfpay6f]  .guide-cta-box-btn:hover i {
    transform: translateX(3px);
}

/* Key takeaways — opening "in short" panel (opt-in via .guide-key-takeaways) */
.guide-body[b-pujyfpay6f]  .guide-key-takeaways {
    background: #FAFAF7;
    border: 1px solid #EDE7DD;
    border-radius: 0.85rem;
    padding: 1.6rem 1.85rem;
    margin: 0 0 2.25rem;
}

.guide-body[b-pujyfpay6f]  .guide-key-takeaways .guide-kt-label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #C4875A;
    margin-bottom: 0.85rem;
}

.guide-body[b-pujyfpay6f]  .guide-key-takeaways ul {
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: none;
}

.guide-body[b-pujyfpay6f]  .guide-key-takeaways li {
    position: relative;
    padding-left: 1.85rem;
    margin-bottom: 0.6rem;
    font-size: 0.98rem;
    color: #3D4654;
}

.guide-body[b-pujyfpay6f]  .guide-key-takeaways li::before {
    content: '\2713'; /* check */
    position: absolute;
    left: 0;
    top: 0.05rem;
    width: 1.25rem;
    height: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: #FFFFFF;
    background: linear-gradient(135deg, #6B8F71, #5A7D60);
    border-radius: 50%;
}

/* Pull quote — editorial emphasis (opt-in via blockquote.guide-pullquote) */
.guide-body[b-pujyfpay6f]  .guide-pullquote {
    margin: 2.25rem 0;
    padding: 0.25rem 0 0.25rem 1.75rem;
    border-left: 3px solid #C4875A;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.4rem;
    line-height: 1.45;
    font-style: italic;
    color: #1B2A4A;
    text-wrap: balance;
}

/* Step list */
.guide-body[b-pujyfpay6f]  .guide-step-list {
    counter-reset: guide-step;
    list-style: none;
    padding-left: 0;
}

.guide-body[b-pujyfpay6f]  .guide-step-list li {
    counter-increment: guide-step;
    position: relative;
    padding-left: 3rem;
    margin-bottom: 1.5rem;
}

.guide-body[b-pujyfpay6f]  .guide-step-list li::before {
    content: counter(guide-step);
    position: absolute;
    left: 0;
    top: 0;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1B2A4A, #2D4A7A);
    color: #FFFFFF;
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    border-radius: 50%;
}

/* Tables */
.guide-body[b-pujyfpay6f]  table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 1.85rem 0;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    table-layout: auto;
    border: 1px solid #EDE7DD;
    border-radius: 0.6rem;
    overflow: hidden;
}

.guide-body[b-pujyfpay6f]  th {
    background: #1B2A4A;
    color: #FFFFFF;
    padding: 0.9rem 1.5rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.88rem;
}

.guide-body[b-pujyfpay6f]  th:first-child {
    min-width: 200px;
}

.guide-body[b-pujyfpay6f]  td {
    padding: 0.9rem 1.5rem;
    border-bottom: 1px solid #EDE7DD;
    color: #3D4654;
}

.guide-body[b-pujyfpay6f]  tr:last-child td {
    border-bottom: none;
}

.guide-body[b-pujyfpay6f]  tr:nth-child(even) td {
    background: #FAFAF7;
}

/* === Bottom CTA === */
.guide-bottom-cta[b-pujyfpay6f] {
    background: linear-gradient(135deg, #F5F0EA 0%, #EDE7DD 100%);
    border: 1px solid rgba(196, 135, 90, 0.15);
    border-radius: 1rem;
    padding: 2.5rem;
    text-align: center;
    margin-bottom: 2.5rem;
}

.guide-bottom-cta h3[b-pujyfpay6f] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.6rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.75rem;
}

.guide-bottom-cta p[b-pujyfpay6f] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    color: #5A6474;
    line-height: 1.65;
    max-width: 500px;
    margin: 0 auto 1.5rem;
}

.guide-bottom-cta-buttons[b-pujyfpay6f] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.guide-btn-primary[b-pujyfpay6f] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 1.85rem;
    background: linear-gradient(135deg, #C4875A 0%, #D4A06D 100%);
    color: #FFFFFF !important;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    border: none;
    position: relative;
    overflow: hidden;
}

.guide-btn-primary[b-pujyfpay6f]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0);
    transition: background 0.2s ease;
    border-radius: inherit;
    pointer-events: none;
}

.guide-btn-primary:hover[b-pujyfpay6f] {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(196, 135, 90, 0.38);
    color: #FFFFFF !important;
}

.guide-btn-primary:active[b-pujyfpay6f]::after {
    background: rgba(0, 0, 0, 0.08);
}

.guide-btn-primary i[b-pujyfpay6f] {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.guide-btn-primary:hover i[b-pujyfpay6f] {
    transform: translateX(3px);
}

.guide-btn-outline[b-pujyfpay6f] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 1.85rem;
    background: transparent;
    color: #1B2A4A !important;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    border: 2px solid rgba(27, 42, 74, 0.18);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-btn-outline:hover[b-pujyfpay6f] {
    border-color: #1B2A4A;
    background: rgba(27, 42, 74, 0.04);
    transform: translateY(-2px);
}

.guide-btn-outline:active[b-pujyfpay6f] {
    transform: translateY(0);
    background: rgba(27, 42, 74, 0.08);
}

/* === Related Articles === */
.guide-related[b-pujyfpay6f] {
    margin-bottom: 1rem;
}

.guide-related h3[b-pujyfpay6f] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 1.25rem;
}

.guide-related-grid[b-pujyfpay6f] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.guide-related-grid[b-pujyfpay6f]  .guide-hub-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: #FFFFFF;
    border: 1px solid #EDE7DD;
    border-radius: 0.85rem;
    padding: 1.35rem;
    text-decoration: none !important;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.guide-related-grid[b-pujyfpay6f]  .guide-hub-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C4875A, #D4A06D);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-related-grid[b-pujyfpay6f]  .guide-hub-card:hover {
    border-color: rgba(196, 135, 90, 0.25);
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.07);
    transform: translateY(-4px);
}

.guide-related-grid[b-pujyfpay6f]  .guide-hub-card:hover::before {
    transform: scaleX(1);
}

.guide-related-grid[b-pujyfpay6f]  .guide-hub-card-body h3 {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.3rem;
}

.guide-related-grid[b-pujyfpay6f]  .guide-hub-card-body p {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
    line-height: 1.55;
    color: #5A6474;
    margin-bottom: 0;
}

/* === Back to top === */
.guide-backtotop[b-pujyfpay6f] {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background: #1B2A4A;
    color: #FFFFFF;
    font-size: 1.1rem;
    cursor: pointer;
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.35s ease;
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.25);
    z-index: 1020;
}

.guide-backtotop.is-visible[b-pujyfpay6f] {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.guide-backtotop:hover[b-pujyfpay6f] {
    background: #2D4A7A;
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(27, 42, 74, 0.32);
}

/* === Responsive === */
@media (max-width: 991.98px) {
    .guide-layout[b-pujyfpay6f] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1.75rem 0 3rem;
    }

    .guide-sidebar[b-pujyfpay6f] {
        position: static;
        top: auto;
    }

    /* TOC becomes a collapsible disclosure at the top of the article */
    .guide-toc-toggle[b-pujyfpay6f] {
        display: flex;
    }

    .guide-toc-panel[b-pujyfpay6f] {
        display: none;
    }

    .guide-toc.is-open .guide-toc-panel[b-pujyfpay6f] {
        display: block;
        border-top: 1px solid #EDE7DD;
    }

    /* The full guide list and CTA drop below the article on mobile */
    .guide-nav[b-pujyfpay6f],
    .guide-sidebar-cta[b-pujyfpay6f] {
        order: 3;
    }

    .guide-hero[b-pujyfpay6f] {
        padding: 2.5rem 0 2.25rem;
    }

    .guide-body[b-pujyfpay6f] {
        padding: 2rem 1.75rem;
    }
}

@media (max-width: 575.98px) {
    .guide-title[b-pujyfpay6f] {
        font-size: 1.85rem;
        max-width: none;
    }

    .guide-intro[b-pujyfpay6f] {
        font-size: 1.05rem;
    }

    .guide-body[b-pujyfpay6f] {
        padding: 1.5rem 1.35rem;
    }

    .guide-body[b-pujyfpay6f]  h2 {
        font-size: 1.4rem;
    }

    .guide-body[b-pujyfpay6f]  table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .guide-bottom-cta[b-pujyfpay6f] {
        padding: 1.75rem;
    }

    .guide-bottom-cta-buttons[b-pujyfpay6f] {
        flex-direction: column;
        align-items: stretch;
    }

    .guide-btn-primary[b-pujyfpay6f],
    .guide-btn-outline[b-pujyfpay6f] {
        justify-content: center;
        text-align: center;
    }

    .guide-backtotop[b-pujyfpay6f] {
        right: 1rem;
        bottom: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .guide-progress-bar[b-pujyfpay6f] {
        transition: none;
    }

    *[b-pujyfpay6f],
    *[b-pujyfpay6f]::before,
    *[b-pujyfpay6f]::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
/* /Components/Pages/GuidePages/GuideIndex.razor.rz.scp.css */
/* ============================================
   Guide Index / Hub Page — v2
   Matching Nordic Legal Trust · Modern
   ============================================ */

/* ─── Hero ─── */
.guide-hub-hero[b-l3qvdsa699] {
    padding: 4.5rem 0 3.5rem;
    background: linear-gradient(160deg, #FAFAF7 0%, #F5F0EA 40%, #EDE7DD 100%);
    position: relative;
    overflow: hidden;
}

.guide-hub-hero[b-l3qvdsa699]::before {
    content: '';
    position: absolute;
    top: -30%;
    right: -10%;
    width: 45%;
    height: 160%;
    background: radial-gradient(ellipse, rgba(196, 135, 90, 0.06) 0%, transparent 65%);
    pointer-events: none;
}

.guide-hub-hero[b-l3qvdsa699]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.18), transparent);
}

.guide-hub-hero-deco[b-l3qvdsa699] {
    position: absolute;
    top: -55%;
    right: -6%;
    width: 38%;
    height: 200%;
    background: radial-gradient(ellipse, rgba(27, 42, 74, 0.05) 0%, transparent 62%);
    pointer-events: none;
}

.guide-hub-hero-content[b-l3qvdsa699] {
    position: relative;
    z-index: 1;
    max-width: 720px;
    animation: guide-fadeUp-b-l3qvdsa699 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-hub-hero-meta[b-l3qvdsa699] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 1.75rem;
    margin-top: 1.75rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
    color: #5A6474;
}

.guide-hub-hero-meta span[b-l3qvdsa699] {
    display: inline-flex;
    align-items: center;
}

.guide-hub-hero-meta i[b-l3qvdsa699] {
    margin-right: 0.45rem;
    color: #C4875A;
    font-size: 0.95rem;
}

@keyframes guide-fadeUp-b-l3qvdsa699 {
    from { opacity: 0; transform: translateY(30px); }
    to   { opacity: 1; transform: translateY(0); }
}

.guide-hub-label[b-l3qvdsa699] {
    display: inline-block;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #C4875A;
    margin-bottom: 0.75rem;
}

.guide-hub-title[b-l3qvdsa699] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(2rem, 3.5vw, 2.8rem);
    font-weight: 700;
    color: #1B2A4A;
    line-height: 1.15;
    margin-bottom: 1rem;
    letter-spacing: -0.01em;
}

.guide-hub-title .accent[b-l3qvdsa699] {
    color: #C4875A;
    position: relative;
}

.guide-hub-desc[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.15rem;
    line-height: 1.75;
    color: #5A6474;
}

/* ─── Quick Start Cards (asymmetric bento) ─── */
.guide-hub-quickstart[b-l3qvdsa699] {
    padding: 3.5rem 0;
    background: #FFFFFF;
}

.guide-hub-eyebrow[b-l3qvdsa699] {
    display: inline-block;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #C4875A;
    margin-bottom: 1.25rem;
}

.guide-hub-quickstart-grid[b-l3qvdsa699] {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    grid-auto-rows: 1fr;
    gap: 1.25rem;
}

.guide-hub-quick-card[b-l3qvdsa699] {
    display: flex;
    flex-direction: column;
    background: #FAFAF7;
    border: 1px solid #EDE7DD;
    border-radius: 1rem;
    padding: 2rem;
    text-decoration: none !important;
    position: relative;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    overflow: hidden;
}

/* Featured card anchors the bento: tall column on the left */
.guide-hub-quick-featured[b-l3qvdsa699] {
    grid-column: 1;
    grid-row: 1 / span 2;
    justify-content: flex-end;
    padding: 2.5rem;
}

.guide-hub-quick-featured h2[b-l3qvdsa699] {
    font-size: 1.55rem !important;
}

.guide-hub-quick-featured .guide-hub-quick-icon[b-l3qvdsa699] {
    width: 58px;
    height: 58px;
    font-size: 1.55rem;
    margin-bottom: auto;
}

.guide-hub-quick-featured .guide-hub-quick-arrow[b-l3qvdsa699] {
    position: static;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1.25rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.92rem;
    font-weight: 600;
}

.guide-hub-quick-card[b-l3qvdsa699]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #1B2A4A, #2D4A7A);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-hub-quick-card:hover[b-l3qvdsa699] {
    transform: translateY(-8px);
    box-shadow: 0 16px 45px rgba(27, 42, 74, 0.1);
    border-color: transparent;
}

.guide-hub-quick-card:hover[b-l3qvdsa699]::before {
    transform: scaleX(1);
}

.guide-hub-quick-featured[b-l3qvdsa699] {
    background: linear-gradient(135deg, #1B2A4A 0%, #2D4A7A 100%);
    border-color: transparent;
}

.guide-hub-quick-featured h2[b-l3qvdsa699],
.guide-hub-quick-featured p[b-l3qvdsa699] {
    color: #FFFFFF !important;
}

.guide-hub-quick-featured .guide-hub-quick-icon[b-l3qvdsa699] {
    background: rgba(255, 255, 255, 0.15);
    color: #D4A06D;
}

.guide-hub-quick-featured .guide-hub-quick-arrow[b-l3qvdsa699] {
    color: rgba(255, 255, 255, 0.6);
}

.guide-hub-quick-featured:hover[b-l3qvdsa699] {
    box-shadow: 0 16px 45px rgba(27, 42, 74, 0.28);
}

.guide-hub-quick-featured[b-l3qvdsa699]::before {
    background: linear-gradient(90deg, #C4875A, #D4A06D);
}

.guide-hub-quick-icon[b-l3qvdsa699] {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(196, 135, 90, 0.1);
    color: #C4875A;
    border-radius: 0.65rem;
    font-size: 1.3rem;
    margin-bottom: 1.25rem;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
                background 0.3s ease;
}

.guide-hub-quick-card:hover .guide-hub-quick-icon[b-l3qvdsa699] {
    transform: scale(1.1);
    background: rgba(196, 135, 90, 0.16);
}

.guide-hub-quick-featured:hover .guide-hub-quick-icon[b-l3qvdsa699] {
    background: rgba(255, 255, 255, 0.22);
}

.guide-hub-quick-card h2[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.5rem;
}

.guide-hub-quick-card p[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.92rem;
    line-height: 1.6;
    color: #5A6474;
    margin: 0;
}

.guide-hub-quick-tag[b-l3qvdsa699] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    padding: 0.2rem 0.65rem;
    background: rgba(196, 135, 90, 0.2);
    color: #D4A06D;
    font-family: 'Outfit', sans-serif;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 1rem;
}

.guide-hub-quick-arrow[b-l3qvdsa699] {
    position: absolute;
    bottom: 1.5rem;
    right: 1.5rem;
    color: #C4875A;
    font-size: 1.1rem;
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.guide-hub-quick-card:hover .guide-hub-quick-arrow[b-l3qvdsa699] {
    transform: translateX(5px);
}

.guide-hub-quick-featured:hover .guide-hub-quick-arrow[b-l3qvdsa699] {
    transform: none;
    gap: 0.7rem;
}

.guide-hub-quick-featured .guide-hub-quick-arrow i[b-l3qvdsa699] {
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.guide-hub-quick-featured:hover .guide-hub-quick-arrow i[b-l3qvdsa699] {
    transform: translateX(4px);
}

/* ─── All Guides Grid ─── */
.guide-hub-articles[b-l3qvdsa699] {
    padding: 3.5rem 0 4.5rem;
    background: #FAFAF7;
}

.guide-hub-section-title[b-l3qvdsa699] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.8rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 2rem;
}

.guide-hub-grid[b-l3qvdsa699] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
}

.guide-hub-card[b-l3qvdsa699] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    background: #FFFFFF;
    border: 1px solid #EDE7DD;
    border-radius: 0.75rem;
    padding: 1.5rem;
    text-decoration: none !important;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.guide-hub-card[b-l3qvdsa699]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(180deg, #C4875A, #D4A06D);
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-hub-card:hover[b-l3qvdsa699] {
    border-color: rgba(196, 135, 90, 0.25);
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.07);
    transform: translateY(-3px) translateX(3px);
}

.guide-hub-card:hover[b-l3qvdsa699]::before {
    transform: scaleY(1);
}

.guide-hub-card-icon[b-l3qvdsa699] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(27, 42, 74, 0.06);
    color: #1B2A4A;
    border-radius: 0.6rem;
    font-size: 1.1rem;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
                background 0.3s ease;
}

.guide-hub-card:hover .guide-hub-card-icon[b-l3qvdsa699] {
    transform: scale(1.08);
    background: rgba(27, 42, 74, 0.1);
}

.guide-hub-card-body h3[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.35rem;
    transition: color 0.2s ease;
}

.guide-hub-card:hover .guide-hub-card-body h3[b-l3qvdsa699] {
    color: #C4875A;
}

.guide-hub-card-body p[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.88rem;
    line-height: 1.6;
    color: #5A6474;
    margin-bottom: 0.5rem;
}

.guide-hub-card-meta[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.78rem;
    color: #9AA3B0;
}

.guide-hub-card-meta i[b-l3qvdsa699] {
    margin-right: 0.2rem;
}

/* ─── CTA Section ─── */
.guide-hub-cta[b-l3qvdsa699] {
    padding: 4.5rem 0;
    background: linear-gradient(135deg, #1B2A4A 0%, #2D4A7A 100%);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.guide-hub-cta[b-l3qvdsa699]::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

.guide-hub-cta-content[b-l3qvdsa699] {
    max-width: 560px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.guide-hub-cta h2[b-l3qvdsa699] {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 2rem;
    font-weight: 600;
    color: #FFFFFF;
    margin-bottom: 1rem;
}

.guide-hub-cta p[b-l3qvdsa699] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 2rem;
}

.guide-hub-cta-buttons[b-l3qvdsa699] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.guide-hub-btn-primary[b-l3qvdsa699] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 1.85rem;
    background: linear-gradient(135deg, #C4875A, #D4A06D);
    color: #FFFFFF !important;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.guide-hub-btn-primary[b-l3qvdsa699]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0);
    transition: background 0.2s ease;
    border-radius: inherit;
    pointer-events: none;
}

.guide-hub-btn-primary:hover[b-l3qvdsa699] {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(196, 135, 90, 0.4);
    color: #FFFFFF !important;
}

.guide-hub-btn-primary:active[b-l3qvdsa699]::after {
    background: rgba(0, 0, 0, 0.08);
}

.guide-hub-btn-primary i[b-l3qvdsa699] {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.guide-hub-btn-primary:hover i[b-l3qvdsa699] {
    transform: translateX(3px);
}

.guide-hub-btn-outline[b-l3qvdsa699] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 1.85rem;
    background: transparent;
    color: rgba(255, 255, 255, 0.9) !important;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    border: 2px solid rgba(255, 255, 255, 0.2);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-hub-btn-outline:hover[b-l3qvdsa699] {
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.08);
    color: #FFFFFF !important;
    transform: translateY(-2px);
}

.guide-hub-btn-outline:active[b-l3qvdsa699] {
    transform: translateY(0);
    background: rgba(255, 255, 255, 0.12);
}

/* ─── Responsive ─── */
@media (max-width: 991.98px) {
    .guide-hub-quickstart-grid[b-l3qvdsa699] {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
    }

    /* Reset the bento span so cards stack cleanly */
    .guide-hub-quick-featured[b-l3qvdsa699] {
        grid-column: auto;
        grid-row: auto;
        padding: 2rem;
    }

    .guide-hub-quick-featured .guide-hub-quick-icon[b-l3qvdsa699] {
        margin-bottom: 1.25rem;
    }

    .guide-hub-grid[b-l3qvdsa699] {
        grid-template-columns: 1fr;
    }

    .guide-hub-title[b-l3qvdsa699] {
        font-size: 2.2rem;
    }
}

@media (max-width: 575.98px) {
    .guide-hub-hero[b-l3qvdsa699] {
        padding: 2.5rem 0 2rem;
    }

    .guide-hub-title[b-l3qvdsa699] {
        font-size: 1.85rem;
    }

    .guide-hub-cta-buttons[b-l3qvdsa699] {
        flex-direction: column;
        align-items: stretch;
    }

    .guide-hub-btn-primary[b-l3qvdsa699],
    .guide-hub-btn-outline[b-l3qvdsa699] {
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .guide-hub-hero-content[b-l3qvdsa699] {
        animation: none;
    }

    *[b-l3qvdsa699],
    *[b-l3qvdsa699]::before,
    *[b-l3qvdsa699]::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
/* /Components/Pages/HomeStats/HomeStatsStrip.razor.rz.scp.css */
.home-stats-strip[b-y27nlsseyd] {
    display: grid;
    grid-template-columns: minmax(260px, 1.1fr) minmax(220px, 1fr) minmax(260px, 1.2fr);
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

@media (max-width: 1200px) {
    .home-stats-strip[b-y27nlsseyd] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .home-stats-strip[b-y27nlsseyd] {
        grid-template-columns: 1fr;
    }
}

/* ── KPI cards ── */
.home-stats-kpis[b-y27nlsseyd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.home-stats-kpi[b-y27nlsseyd] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem 0.75rem;
    background: #fff;
    border: 1px solid #e7eaee;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.home-stats-kpi-icon[b-y27nlsseyd] {
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.4rem;
    font-size: 1rem;
    flex-shrink: 0;
}

.home-stats-kpi--cases .home-stats-kpi-icon[b-y27nlsseyd] { background: #e7f1ff; color: #0d6efd; }
.home-stats-kpi--new .home-stats-kpi-icon[b-y27nlsseyd] { background: #e8f6ee; color: #198754; }
.home-stats-kpi--urgent .home-stats-kpi-icon[b-y27nlsseyd] { background: #fdecec; color: #dc3545; }
.home-stats-kpi--tasks .home-stats-kpi-icon[b-y27nlsseyd] { background: #f4ecfb; color: #6f42c1; }

.home-stats-kpi-body[b-y27nlsseyd] {
    min-width: 0;
}

.home-stats-kpi-value[b-y27nlsseyd] {
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.1;
    color: #1f2937;
}

.home-stats-kpi-label[b-y27nlsseyd] {
    font-size: 0.78rem;
    color: #6b7280;
    line-height: 1.2;
    margin-top: 0.1rem;
}

/* ── Cards (sparkline + upcoming) ── */
.home-stats-card[b-y27nlsseyd] {
    background: #fff;
    border: 1px solid #e7eaee;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    padding: 0.7rem 0.85rem;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.home-stats-card-header[b-y27nlsseyd] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
}

.home-stats-card-header i[b-y27nlsseyd] {
    color: #0d6efd;
}

/* Override to-chart container heights for the compact sparkline */
.home-stats-spark-chart[b-y27nlsseyd] {
    min-height: 110px !important;
    padding-bottom: 0 !important;
}

.home-stats-spark-chart .to-chart-bars[b-y27nlsseyd] {
    height: 90px !important;
}

.home-stats-spark-chart .to-chart-bar[b-y27nlsseyd] {
    max-width: 18px;
}

.home-stats-spark-chart .to-chart-label[b-y27nlsseyd] {
    font-size: 0.6rem;
}

/* ── Upcoming events list ── */
.home-stats-upcoming-list[b-y27nlsseyd] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.home-stats-upcoming-row[b-y27nlsseyd] {
    margin: 0;
}

.home-stats-upcoming-btn[b-y27nlsseyd] {
    display: grid;
    grid-template-columns: 4.5rem 1.6rem 1fr;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 0.35rem 0.4rem;
    border-radius: 0.35rem;
    color: #1f2937;
    cursor: pointer;
    transition: background-color 0.15s ease;
    min-width: 0;
}

.home-stats-upcoming-btn:hover[b-y27nlsseyd],
.home-stats-upcoming-btn:focus-visible[b-y27nlsseyd] {
    background: #f3f4f6;
    outline: none;
}

.home-stats-upcoming-date[b-y27nlsseyd] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
    text-transform: capitalize;
}

.home-stats-upcoming-kind[b-y27nlsseyd] {
    width: 1.4rem;
    height: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.3rem;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.home-stats-upcoming-kind--ceremoni[b-y27nlsseyd] { background: #e7f1ff; color: #0d6efd; }
.home-stats-upcoming-kind--forrattning[b-y27nlsseyd] { background: #fff4e6; color: #b46406; }
.home-stats-upcoming-kind--gravsten[b-y27nlsseyd] { background: #efeae3; color: #6b5b3a; }
.home-stats-upcoming-kind--arvskifte[b-y27nlsseyd] { background: #ecf7ee; color: #198754; }

.home-stats-upcoming-text[b-y27nlsseyd] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.home-stats-upcoming-title[b-y27nlsseyd] {
    font-size: 0.82rem;
    line-height: 1.2;
    color: #1f2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-stats-upcoming-time[b-y27nlsseyd] {
    font-size: 0.72rem;
    color: #6b7280;
    line-height: 1.1;
}

.home-stats-upcoming-empty[b-y27nlsseyd] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: #6b7280;
    font-size: 0.85rem;
    padding: 0.5rem 0.25rem;
}

.home-stats-upcoming-empty i[b-y27nlsseyd] {
    color: #198754;
}

.home-stats-upcoming-more[b-y27nlsseyd] {
    font-size: 0.72rem;
    color: #6b7280;
    margin-top: 0.3rem;
    padding-left: 0.4rem;
}
/* /Components/Pages/HomeStats/HomeStatsStripPlaceholder.razor.rz.scp.css */
/* ──────────────────────────────────────────────────────────────
   Layout shell — duplicated from HomeStatsStrip.razor.css because
   Blazor scoped CSS does not cross component boundaries. Keep in
   sync with that file if the real strip's outer shape changes.
   ────────────────────────────────────────────────────────────── */

.home-stats-strip[b-vw584miwd4] {
    display: grid;
    grid-template-columns: minmax(260px, 1.1fr) minmax(220px, 1fr) minmax(260px, 1.2fr);
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

@media (max-width: 1200px) {
    .home-stats-strip[b-vw584miwd4] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .home-stats-strip[b-vw584miwd4] {
        grid-template-columns: 1fr;
    }
}

.home-stats-kpis[b-vw584miwd4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.home-stats-kpi[b-vw584miwd4] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem 0.75rem;
    background: #fff;
    border: 1px solid #e7eaee;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.home-stats-kpi-icon[b-vw584miwd4] {
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.4rem;
    font-size: 1rem;
    flex-shrink: 0;
}

.home-stats-kpi--cases .home-stats-kpi-icon[b-vw584miwd4] { background: #e7f1ff; }
.home-stats-kpi--new .home-stats-kpi-icon[b-vw584miwd4] { background: #e8f6ee; }
.home-stats-kpi--urgent .home-stats-kpi-icon[b-vw584miwd4] { background: #fdecec; }
.home-stats-kpi--tasks .home-stats-kpi-icon[b-vw584miwd4] { background: #f4ecfb; }

.home-stats-kpi-body[b-vw584miwd4] {
    min-width: 0;
    flex: 1;
}

.home-stats-card[b-vw584miwd4] {
    background: #fff;
    border: 1px solid #e7eaee;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    padding: 0.7rem 0.85rem;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.home-stats-card-header[b-vw584miwd4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
}

.home-stats-card-header i[b-vw584miwd4] {
    color: #0d6efd;
}

.home-stats-spark-chart[b-vw584miwd4] {
    min-height: 110px !important;
    padding-bottom: 0 !important;
}

.home-stats-spark-chart .to-chart-bars[b-vw584miwd4] {
    height: 90px !important;
}

.home-stats-spark-chart .to-chart-bar[b-vw584miwd4] {
    max-width: 18px;
}

.home-stats-upcoming-list[b-vw584miwd4] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.home-stats-upcoming-row[b-vw584miwd4] {
    margin: 0;
}

/* ──────────────────────────────────────────────────────────────
   Placeholder blocks — calm, static, warm-sand tinted. No shimmer.
   ────────────────────────────────────────────────────────────── */

.home-stats-ph-value[b-vw584miwd4],
.home-stats-ph-label[b-vw584miwd4],
.home-stats-ph-tick[b-vw584miwd4],
.home-stats-ph-date[b-vw584miwd4],
.home-stats-ph-kind[b-vw584miwd4],
.home-stats-ph-title[b-vw584miwd4] {
    background: #EDE7DD;
    border-radius: 3px;
    display: block;
}

.home-stats-ph-value[b-vw584miwd4] {
    height: 1.1rem;
    width: 2.25rem;
    margin-bottom: 0.35rem;
}

.home-stats-ph-label[b-vw584miwd4] {
    height: 0.55rem;
    width: 80%;
    max-width: 7.5rem;
}

.home-stats-strip--placeholder .home-stats-kpi-icon[b-vw584miwd4] {
    /* The real component uses a colored icon glyph inside the swatch.
       In the placeholder we keep just the soft tinted swatch — no glyph. */
    opacity: 0.6;
}

.home-stats-ph-bar[b-vw584miwd4] {
    background: #EDE7DD !important;
    opacity: 1 !important;
    border-radius: 3px 3px 0 0;
}

.home-stats-ph-tick[b-vw584miwd4] {
    height: 0.5rem;
    width: 60%;
    margin: 4px auto 0;
}

.home-stats-ph-row[b-vw584miwd4] {
    display: grid;
    grid-template-columns: 4.5rem 1.6rem 1fr;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.4rem;
}

.home-stats-ph-date[b-vw584miwd4] {
    height: 0.7rem;
    width: 3rem;
}

.home-stats-ph-kind[b-vw584miwd4] {
    height: 1.4rem;
    width: 1.4rem;
    border-radius: 0.3rem;
}

.home-stats-ph-title[b-vw584miwd4] {
    height: 0.7rem;
    width: 70%;
    max-width: 11rem;
}
/* /Components/Pages/NotLoggedIn.razor.rz.scp.css */
/* ============================================
   NotLoggedIn Landing Page � v3 PREMIUM
   Aesthetic: Nordic Legal Trust � High-End
   Typography: Playfair Display + Outfit
   Palette: Navy + Copper + Warm neutrals
   MOTION_INTENSITY: HIGH
   ============================================ */

/* Palette: Navy #1B2A4A � Copper #C4875A � Gold #D4A06D � Green #6B8F71
   Warm neutrals: #FAFAF7 / #F5F0EA / #EDE7DD
   Note: Literal values used throughout � :root custom properties
   are NOT supported in Blazor scoped CSS (.razor.css). */

/* --- Keyframes (HIGH INTENSITY) --- */
@keyframes nlp-fadeUp-b-82ahl2bvgj {
    from { opacity: 0; transform: translateY(60px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes nlp-scaleIn-b-82ahl2bvgj {
    from { opacity: 0; transform: scale(0.85) rotate(-1deg); }
    to   { opacity: 1; transform: scale(1) rotate(0deg); }
}

@keyframes nlp-slideInLeft-b-82ahl2bvgj {
    from { opacity: 0; transform: translateX(-50px) scale(0.96); }
    to   { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes nlp-slideInRight-b-82ahl2bvgj {
    from { opacity: 0; transform: translateX(50px) scale(0.96); }
    to   { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes nlp-shimmer-b-82ahl2bvgj {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

@keyframes nlp-float-b-82ahl2bvgj {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    25%      { transform: translateY(-14px) rotate(0.5deg); }
    75%      { transform: translateY(-6px) rotate(-0.5deg); }
}

@keyframes nlp-float-delayed-b-82ahl2bvgj {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    30%      { transform: translateY(-10px) rotate(-0.8deg); }
    60%      { transform: translateY(-18px) rotate(0.4deg); }
}

@keyframes nlp-grain-b-82ahl2bvgj {
    0%, 100% { transform: translate(0, 0); }
    10%  { transform: translate(-2%, -2%); }
    30%  { transform: translate(1%, -1%); }
    50%  { transform: translate(-1%, 2%); }
    70%  { transform: translate(2%, 1%); }
    90%  { transform: translate(-2%, 1%); }
}

@keyframes nlp-pulse-glow-b-82ahl2bvgj {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50%      { opacity: 0.7; transform: scale(1.05); }
}

/* Hero/CTA ambient orbs carry filter: blur(40-60px) — same rule as the aurora
   blobs: translate only, no scale, so the blur isn't re-rasterized per frame. */
@keyframes nlp-orb-drift-b-82ahl2bvgj {
    0%   { transform: translate3d(0, 0, 0); }
    25%  { transform: translate3d(30px, -20px, 0); }
    50%  { transform: translate3d(-10px, -40px, 0); }
    75%  { transform: translate3d(-30px, -10px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

@keyframes nlp-orb-drift-2-b-82ahl2bvgj {
    0%   { transform: translate3d(0, 0, 0); }
    33%  { transform: translate3d(-25px, 30px, 0); }
    66%  { transform: translate3d(20px, -15px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

@keyframes nlp-badge-pulse-b-82ahl2bvgj {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50%      { transform: scale(1.8); opacity: 0; }
}

@keyframes nlp-btn-shimmer-sweep-b-82ahl2bvgj {
    0%   { left: -75%; }
    100% { left: 125%; }
}

@keyframes nlp-border-trace-b-82ahl2bvgj {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* --- Aurora Flow Keyframes ---
   Translate-only (compositor-cheap). The blobs carry filter: blur(72px); scaling
   or rotating a blurred layer forces the browser to RE-RASTERIZE the whole blur
   every frame — with six 900px blobs that was the main source of the scroll/
   animation jank. A pure translate just slides the already-rasterized layer on
   the GPU, so the soft aurora drift stays but the per-frame repaint is gone.
   (The previous nlp-aurora-morph scale-pulse, listed second on each blob, also
   overrode the drift's translate entirely — so removing it actually restores the
   intended drifting motion.) translate3d nudges each blob onto its own layer. */
@keyframes nlp-aurora-drift-1-b-82ahl2bvgj {
    0%   { transform: translate3d(0, 0, 0); }
    25%  { transform: translate3d(26px, -20px, 0); }
    50%  { transform: translate3d(-16px, -38px, 0); }
    75%  { transform: translate3d(-28px, -12px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

@keyframes nlp-aurora-drift-2-b-82ahl2bvgj {
    0%   { transform: translate3d(0, 0, 0); }
    33%  { transform: translate3d(-22px, 20px, 0); }
    66%  { transform: translate3d(20px, -16px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

@keyframes nlp-aurora-drift-3-b-82ahl2bvgj {
    0%   { transform: translate3d(0, 0, 0); }
    50%  { transform: translate3d(22px, -28px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

/* --- Page Wrapper (positions aurora canvas) --- */
.nlp-page-wrapper[b-82ahl2bvgj] {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* ---------------------------------------
   AURORA FLOW � Scrolling Background Canvas
   --------------------------------------- */
/* Aurora canvas is FIXED to the viewport and built from small BLURRED blobs.
   Previously these were page-tall (up to 7500px) gradient layers with
   will-change:transform — each one a ~200MB GPU raster, nine of them at once.
   That overwhelmed the compositor and forced main-thread repaints on scroll
   (the reported lag). Small blurred blobs give the same soft aurora for a
   fraction of the memory, and fixed positioning means they cover every section
   without needing to span the whole document height. */
.nlp-bg-canvas[b-82ahl2bvgj] {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.nlp-bg-blob[b-82ahl2bvgj] {
    position: absolute;
    /* 56px is still a soft aurora but rasterizes a smaller blurred surface than 72px —
       6 fixed blobs at 900px add up in GPU memory/fill cost on weaker devices. */
    filter: blur(56px);
    opacity: 0.4;
    pointer-events: none;
    border-radius: 50%;
    will-change: transform;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
}

.nlp-bg-blob-1[b-82ahl2bvgj] {
    width: 900px;
    height: 900px;
    background: linear-gradient(135deg, #E8CEB0 0%, #D4A06D 40%, #C4875A 100%);
    top: -12%;
    left: -8%;
    animation: nlp-aurora-drift-1-b-82ahl2bvgj 120s infinite;
}

.nlp-bg-blob-2[b-82ahl2bvgj] {
    width: 820px;
    height: 820px;
    background: linear-gradient(200deg, #F0DAC4 0%, #E4C3B2 50%, #D4A06D 100%);
    top: 26%;
    left: 16%;
    animation: nlp-aurora-drift-2-b-82ahl2bvgj 150s infinite;
}

.nlp-bg-blob-3[b-82ahl2bvgj] {
    width: 720px;
    height: 720px;
    background: linear-gradient(160deg, #EDE7DD 0%, #D4A06D 60%, #C4875A 100%);
    top: 52%;
    left: 52%;
    opacity: 0.28;
    animation: nlp-aurora-drift-3-b-82ahl2bvgj 180s infinite;
}

.nlp-bg-blob-4[b-82ahl2bvgj] {
    width: 860px;
    height: 860px;
    background: linear-gradient(240deg, #F5F0EA 0%, #E8CEB0 40%, #D4A06D 100%);
    top: 2%;
    left: 58%;
    animation: nlp-aurora-drift-2-b-82ahl2bvgj 140s infinite reverse;
}

.nlp-bg-blob-5[b-82ahl2bvgj] {
    width: 780px;
    height: 780px;
    background: linear-gradient(180deg, #E8CEB0 0%, #C4875A 50%, #D4A06D 100%);
    top: 55%;
    left: -6%;
    animation: nlp-aurora-drift-1-b-82ahl2bvgj 160s infinite reverse;
}

.nlp-bg-blob-6[b-82ahl2bvgj] {
    width: 620px;
    height: 620px;
    background: linear-gradient(170deg, #F0DAC4 0%, #D4A06D 50%, #E8CEB0 100%);
    top: 60%;
    left: 72%;
    opacity: 0.3;
    animation: nlp-aurora-drift-3-b-82ahl2bvgj 130s infinite;
}

/* Trimmed for performance — five to six soft blobs already read as a full aurora. */
.nlp-bg-blob-7[b-82ahl2bvgj],
.nlp-bg-blob-8[b-82ahl2bvgj],
.nlp-bg-blob-9[b-82ahl2bvgj] {
    display: none;
}

/* --- Scroll Reveal System (HIGH INTENSITY) --- */
.nlp-reveal[b-82ahl2bvgj] {
    opacity: 0;
    transform: translateY(52px) scale(0.98);
    transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1),
                transform 1s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.nlp-reveal.nlp-visible[b-82ahl2bvgj] {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Staggered children inside revealed sections */
.nlp-visible .nlp-service-card[b-82ahl2bvgj],
.nlp-visible .nlp-step[b-82ahl2bvgj],
.nlp-visible .nlp-guide-card[b-82ahl2bvgj],
.nlp-visible .nlp-stat-card[b-82ahl2bvgj],
.nlp-visible .nlp-feature-item[b-82ahl2bvgj],
.nlp-visible .nlp-faq-item[b-82ahl2bvgj],
.nlp-visible .nlp-b2b-feature[b-82ahl2bvgj] {
    animation: nlp-fadeUp-b-82ahl2bvgj 0.9s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.nlp-visible .nlp-service-card:nth-child(1)[b-82ahl2bvgj],
.nlp-visible .nlp-step:nth-child(1)[b-82ahl2bvgj],
.nlp-visible .nlp-guide-card:nth-child(1)[b-82ahl2bvgj],
.nlp-visible .nlp-stat-card:nth-child(1)[b-82ahl2bvgj],
.nlp-visible .nlp-faq-item:nth-child(1)[b-82ahl2bvgj] { animation-delay: 0.08s; }
.nlp-visible .nlp-service-card:nth-child(2)[b-82ahl2bvgj],
.nlp-visible .nlp-step:nth-child(2)[b-82ahl2bvgj],
.nlp-visible .nlp-guide-card:nth-child(2)[b-82ahl2bvgj],
.nlp-visible .nlp-stat-card:nth-child(2)[b-82ahl2bvgj],
.nlp-visible .nlp-faq-item:nth-child(2)[b-82ahl2bvgj] { animation-delay: 0.18s; }
.nlp-visible .nlp-step:nth-child(3)[b-82ahl2bvgj],
.nlp-visible .nlp-guide-card:nth-child(3)[b-82ahl2bvgj],
.nlp-visible .nlp-stat-card:nth-child(3)[b-82ahl2bvgj],
.nlp-visible .nlp-faq-item:nth-child(3)[b-82ahl2bvgj] { animation-delay: 0.28s; }
.nlp-visible .nlp-step:nth-child(4)[b-82ahl2bvgj],
.nlp-visible .nlp-guide-card:nth-child(4)[b-82ahl2bvgj],
.nlp-visible .nlp-stat-card:nth-child(4)[b-82ahl2bvgj],
.nlp-visible .nlp-faq-item:nth-child(4)[b-82ahl2bvgj] { animation-delay: 0.38s; }
.nlp-visible .nlp-faq-item:nth-child(5)[b-82ahl2bvgj] { animation-delay: 0.48s; }
.nlp-visible .nlp-faq-item:nth-child(6)[b-82ahl2bvgj] { animation-delay: 0.58s; }

.nlp-visible .nlp-feature-item:nth-child(1)[b-82ahl2bvgj] { animation-delay: 0.06s; }
.nlp-visible .nlp-feature-item:nth-child(2)[b-82ahl2bvgj] { animation-delay: 0.14s; }
.nlp-visible .nlp-feature-item:nth-child(3)[b-82ahl2bvgj] { animation-delay: 0.22s; }
.nlp-visible .nlp-feature-item:nth-child(4)[b-82ahl2bvgj] { animation-delay: 0.30s; }
.nlp-visible .nlp-feature-item:nth-child(5)[b-82ahl2bvgj] { animation-delay: 0.38s; }
.nlp-visible .nlp-feature-item:nth-child(6)[b-82ahl2bvgj] { animation-delay: 0.46s; }

.nlp-visible .nlp-b2b-feature:nth-child(1)[b-82ahl2bvgj] { animation-delay: 0.08s; }
.nlp-visible .nlp-b2b-feature:nth-child(2)[b-82ahl2bvgj] { animation-delay: 0.18s; }
.nlp-visible .nlp-b2b-feature:nth-child(3)[b-82ahl2bvgj] { animation-delay: 0.28s; }
.nlp-visible .nlp-b2b-feature:nth-child(4)[b-82ahl2bvgj] { animation-delay: 0.38s; }

/* ---------------------------------------
   HERO SECTION � IMMERSIVE
   --------------------------------------- */
.nlp-hero[b-82ahl2bvgj] {
    padding: 7rem 0 8rem;
    background: transparent;
    position: relative;
    overflow: hidden;
    min-height: 85dvh;
    display: flex;
    align-items: center;
}

.nlp-hero[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.25), transparent) bottom / 100% 2px no-repeat,
        linear-gradient(160deg, rgba(250, 250, 247, 0.8) 0%, rgba(245, 240, 234, 0.8) 35%, rgba(237, 231, 221, 0.8) 70%, rgba(245, 240, 234, 0.8) 100%);
    pointer-events: none;
}

.nlp-hero[b-82ahl2bvgj]::after {
    display: none;
}

/* Floating ambient orbs */
.nlp-hero-orb[b-82ahl2bvgj] {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(60px);
    z-index: 0;
}

.nlp-hero-orb-1[b-82ahl2bvgj] {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(196, 135, 90, 0.12) 0%, transparent 70%);
    top: -5%;
    right: 10%;
    animation: nlp-orb-drift-b-82ahl2bvgj 18s ease-in-out infinite;
}

.nlp-hero-orb-2[b-82ahl2bvgj] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(107, 143, 113, 0.08) 0%, transparent 70%);
    bottom: 5%;
    left: -5%;
    animation: nlp-orb-drift-2-b-82ahl2bvgj 22s ease-in-out infinite;
}

/* Grain texture overlay */
.nlp-hero-grain[b-82ahl2bvgj] {
    position: absolute;
    inset: -50%;
    width: 200%;
    height: 200%;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 0;
    animation: nlp-grain-b-82ahl2bvgj 6s steps(10) infinite;
    opacity: 0.6;
}

.nlp-hero > .container[b-82ahl2bvgj] {
    position: relative;
    z-index: 1;
}

.nlp-hero-content[b-82ahl2bvgj] {
    animation: nlp-slideInLeft-b-82ahl2bvgj 1.1s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-hero-badge[b-82ahl2bvgj] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 1.2rem;
    background: rgba(27, 42, 74, 0.06);
    color: #1B2A4A;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    border-radius: 2rem;
    margin-bottom: 2rem;
    border: 1px solid rgba(27, 42, 74, 0.1);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
}

.nlp-hero-badge:hover[b-82ahl2bvgj] {
    background: rgba(27, 42, 74, 0.1);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(27, 42, 74, 0.08);
}

.nlp-badge-pulse[b-82ahl2bvgj] {
    position: absolute;
    left: 12px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #6B8F71;
    animation: nlp-badge-pulse-b-82ahl2bvgj 2s ease-in-out infinite;
}

.nlp-hero-badge i[b-82ahl2bvgj] {
    color: #6B8F71;
    font-size: 0.9rem;
}

.nlp-hero-title[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: clamp(2.4rem, 4.5vw, 3.8rem);
    font-weight: 700;
    line-height: 1.1;
    color: #1B2A4A;
    margin-bottom: 1.75rem;
    letter-spacing: -0.02em;
    text-wrap: balance;
}

.nlp-accent[b-82ahl2bvgj] {
    color: #C4875A;
    position: relative;
    display: inline-block;
}

.nlp-accent[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #C4875A, #D4A06D, #C4875A);
    background-size: 200% 100%;
    border-radius: 2px;
    opacity: 0.5;
    animation: nlp-border-trace-b-82ahl2bvgj 4s ease-in-out infinite;
}

.nlp-hero-title:hover .nlp-accent[b-82ahl2bvgj]::after {
    opacity: 0.85;
}

.nlp-hero-text[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.15rem;
    line-height: 1.85;
    color: #5A6474;
    margin-bottom: 2.5rem;
    max-width: 520px;
    text-wrap: pretty;
}

.nlp-hero-buttons[b-82ahl2bvgj] {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 3rem;
}

/* --- Buttons (Global) � PREMIUM --- */
.nlp-btn[b-82ahl2bvgj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.95rem 2rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.85rem;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    border: none;
    letter-spacing: 0.01em;
    position: relative;
    overflow: hidden;
}

.nlp-btn[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0);
    transition: background 0.2s ease;
    border-radius: inherit;
    pointer-events: none;
}

.nlp-btn:active[b-82ahl2bvgj]::after {
    background: rgba(0, 0, 0, 0.08);
}

.nlp-btn i[b-82ahl2bvgj] {
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-btn:hover i[b-82ahl2bvgj] {
    transform: translateX(5px);
}

/* Shimmer sweep effect on primary buttons */
.nlp-btn-shimmer[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transform: skewX(-20deg);
    animation: nlp-btn-shimmer-sweep-b-82ahl2bvgj 4s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
}

.nlp-btn-primary[b-82ahl2bvgj] {
    background: linear-gradient(135deg, #1B2A4A 0%, #2D4A7A 100%);
    color: #FFFFFF !important;
    box-shadow: 0 6px 24px rgba(27, 42, 74, 0.28), 0 2px 6px rgba(27, 42, 74, 0.1);
}

.nlp-btn-primary:hover[b-82ahl2bvgj] {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 14px 40px rgba(27, 42, 74, 0.35), 0 4px 10px rgba(27, 42, 74, 0.12);
    color: #FFFFFF !important;
}

.nlp-btn-primary:active[b-82ahl2bvgj] {
    transform: translateY(-1px) scale(1);
    box-shadow: 0 4px 12px rgba(27, 42, 74, 0.25);
}

.nlp-btn-outline[b-82ahl2bvgj] {
    background: transparent;
    color: #1B2A4A !important;
    border: 2px solid rgba(27, 42, 74, 0.18);
}

.nlp-btn-outline:hover[b-82ahl2bvgj] {
    border-color: #1B2A4A;
    background: rgba(27, 42, 74, 0.05);
    color: #1B2A4A !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.1);
}

.nlp-btn-outline:active[b-82ahl2bvgj] {
    transform: translateY(0);
    background: rgba(27, 42, 74, 0.08);
}

/* --- Trust Items --- */
.nlp-hero-trust[b-82ahl2bvgj] {
    display: flex;
    gap: 2rem;
    animation: nlp-fadeUp-b-82ahl2bvgj 1s cubic-bezier(0.16, 1, 0.3, 1) 0.5s both;
}

.nlp-trust-item[b-82ahl2bvgj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    color: #5A6474;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-trust-item:hover[b-82ahl2bvgj] {
    color: #1B2A4A;
    transform: translateY(-2px);
}

.nlp-trust-item i[b-82ahl2bvgj] {
    color: #6B8F71;
    font-size: 1.15rem;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-trust-item:hover i[b-82ahl2bvgj] {
    transform: scale(1.25) rotate(-5deg);
    color: #5A7D60;
}

/* --- Hero Visual � Dual Image Composition --- */
.nlp-hero-visual[b-82ahl2bvgj] {
    position: relative;
    height: 460px;
    animation: nlp-slideInRight-b-82ahl2bvgj 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.nlp-hero-image[b-82ahl2bvgj] {
    position: absolute;
    border-radius: 1.25rem;
    overflow: hidden;
    transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-hero-image img[b-82ahl2bvgj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.nlp-hero-image-main[b-82ahl2bvgj] {
    width: 72%;
    height: 88%;
    top: 0;
    left: 0;
    z-index: 2;
    box-shadow: 0 24px 60px rgba(27, 42, 74, 0.16), 0 6px 16px rgba(27, 42, 74, 0.08);
    animation: nlp-float-b-82ahl2bvgj 8s ease-in-out infinite;
}

.nlp-hero-image-main:hover[b-82ahl2bvgj] {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 32px 80px rgba(27, 42, 74, 0.22), 0 8px 20px rgba(27, 42, 74, 0.1);
}

.nlp-hero-image-float[b-82ahl2bvgj] {
    width: 52%;
    height: 58%;
    bottom: 0;
    right: 0;
    z-index: 3;
    box-shadow: 0 20px 50px rgba(27, 42, 74, 0.18), 0 4px 12px rgba(27, 42, 74, 0.1);
    animation: nlp-float-delayed-b-82ahl2bvgj 9s ease-in-out infinite;
    border: 3px solid rgba(255, 255, 255, 0.8);
}

.nlp-hero-image-float:hover[b-82ahl2bvgj] {
    transform: translateY(-12px) rotate(-1deg) scale(1.03);
    box-shadow: 0 28px 60px rgba(27, 42, 74, 0.24), 0 6px 16px rgba(27, 42, 74, 0.12);
}

.nlp-hero-glow[b-82ahl2bvgj] {
    position: absolute;
    bottom: 10%;
    left: 20%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(196, 135, 90, 0.15) 0%, transparent 70%);
    border-radius: 50%;
    z-index: 0;
    filter: blur(30px);
    animation: nlp-pulse-glow-b-82ahl2bvgj 5s ease-in-out infinite;
    pointer-events: none;
}

/* ---------------------------------------
   SECTION HEADERS � PREMIUM
   --------------------------------------- */
.nlp-section-header[b-82ahl2bvgj] {
    text-align: center;
    margin-bottom: 4rem;
}

.nlp-section-label[b-82ahl2bvgj] {
    display: inline-block;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #C4875A;
    margin-bottom: 0.85rem;
    position: relative;
    padding: 0 1.5rem;
}

.nlp-section-label[b-82ahl2bvgj]::before,
.nlp-section-label[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 24px;
    height: 1px;
    background: linear-gradient(90deg, #C4875A, transparent);
}

.nlp-section-label[b-82ahl2bvgj]::before { right: 100%; }
.nlp-section-label[b-82ahl2bvgj]::after { left: 100%; transform: scaleX(-1); }

.nlp-section-title[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: clamp(1.9rem, 3.2vw, 2.6rem);
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 1rem;
    letter-spacing: -0.015em;
    text-wrap: balance;
}

.nlp-section-desc[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.1rem;
    color: #5A6474;
    max-width: 620px;
    margin: 0 auto;
    line-height: 1.75;
    text-wrap: pretty;
}

.nlp-section-header-light .nlp-section-title[b-82ahl2bvgj] {
    color: #FFFFFF;
}

.nlp-section-header-light .nlp-section-label[b-82ahl2bvgj]::before,
.nlp-section-header-light .nlp-section-label[b-82ahl2bvgj]::after {
    background: linear-gradient(90deg, #D4A06D, transparent);
}

.nlp-label-light[b-82ahl2bvgj] {
    color: #D4A06D;
}

/* ---------------------------------------
   SERVICES SECTION � PREMIUM
   --------------------------------------- */
.nlp-services[b-82ahl2bvgj] {
    padding: 7rem 0;
    background: transparent;
    position: relative;
}

.nlp-services[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(27, 42, 74, 0.08), transparent) top / 100% 1px no-repeat,
        rgba(255, 255, 255, 0.55);
    pointer-events: none;
}

.nlp-services[b-82ahl2bvgj]::after {
    display: none;
}

.nlp-service-card[b-82ahl2bvgj] {
    background: #FAFAF7;
    border: 1px solid rgba(27, 42, 74, 0.06);
    border-radius: 1.25rem;
    padding: 2.75rem 2.25rem;
    height: 100%;
    text-align: center;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.nlp-service-card[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #C4875A, #D4A06D, #C4875A);
    background-size: 200% 100%;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-service-card:hover[b-82ahl2bvgj] {
    transform: translateY(-14px) scale(1.01);
    box-shadow: 0 28px 70px rgba(27, 42, 74, 0.14), 0 8px 20px rgba(27, 42, 74, 0.05);
    border-color: transparent;
}

.nlp-service-card:hover[b-82ahl2bvgj]::before {
    transform: scaleX(1);
}

.nlp-service-icon[b-82ahl2bvgj] {
    width: 80px;
    height: 80px;
    margin: 0 auto 1.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-service-card:hover .nlp-service-icon[b-82ahl2bvgj] {
    transform: scale(1.12) translateY(-6px);
}

.nlp-service-icon img[b-82ahl2bvgj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.nlp-service-card h3[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 1rem;
}

.nlp-service-card p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    line-height: 1.7;
    color: #5A6474;
    margin-bottom: 1.5rem;
}

.nlp-service-tag[b-82ahl2bvgj] {
    display: inline-block;
    padding: 0.3rem 0.85rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6B8F71;
    background: rgba(107, 143, 113, 0.1);
    border-radius: 1rem;
    transition: background 0.3s ease;
}

.nlp-service-card:hover .nlp-service-tag[b-82ahl2bvgj] {
    background: rgba(107, 143, 113, 0.16);
}

.nlp-service-tag-extra[b-82ahl2bvgj] {
    color: #C4875A;
    background: rgba(196, 135, 90, 0.1);
}

.nlp-service-card:hover .nlp-service-tag-extra[b-82ahl2bvgj] {
    background: rgba(196, 135, 90, 0.16);
}

/* ---------------------------------------
   PROCESS / HOW IT WORKS � PREMIUM
   --------------------------------------- */
.nlp-process[b-82ahl2bvgj] {
    padding: 7rem 0;
    background: transparent;
    position: relative;
}

.nlp-process[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.15), transparent) top / 100% 1px no-repeat,
        linear-gradient(180deg, rgba(245, 240, 234, 0.55) 0%, rgba(250, 250, 247, 0.55) 100%);
    pointer-events: none;
}

.nlp-steps[b-82ahl2bvgj] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
    max-width: 1000px;
    margin: 0 auto;
}

.nlp-step[b-82ahl2bvgj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    flex: 1;
    position: relative;
}

.nlp-step-number[b-82ahl2bvgj] {
    width: 68px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1B2A4A, #2D4A7A);
    color: #FFFFFF;
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 1.5rem;
    font-weight: 700;
    border-radius: 50%;
    margin-bottom: 1.5rem;
    box-shadow: 0 8px 28px rgba(27, 42, 74, 0.25), 0 0 0 4px rgba(27, 42, 74, 0.06);
    position: relative;
    z-index: 2;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-step:hover .nlp-step-number[b-82ahl2bvgj] {
    transform: scale(1.18) translateY(-4px);
    box-shadow: 0 14px 36px rgba(27, 42, 74, 0.32), 0 0 0 6px rgba(196, 135, 90, 0.15);
}

.nlp-step-connector[b-82ahl2bvgj] {
    flex: 0 0 60px;
    height: 2px;
    background: linear-gradient(90deg, rgba(196, 135, 90, 0.15), rgba(196, 135, 90, 0.6), rgba(196, 135, 90, 0.15));
    margin-top: 34px;
    border-radius: 1px;
    position: relative;
}

.nlp-step-connector[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background: #C4875A;
    border-radius: 50%;
    opacity: 0.5;
    animation: nlp-pulse-glow-b-82ahl2bvgj 3s ease-in-out infinite;
}

.nlp-step-content h3[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.5rem;
}

.nlp-step-content p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.88rem;
    line-height: 1.6;
    color: #5A6474;
    max-width: 185px;
    margin: 0 auto;
}

/* ---------------------------------------
   FEATURES SECTION (dark) � PREMIUM GLASS
   --------------------------------------- */
.nlp-features[b-82ahl2bvgj] {
    padding: 7rem 0;
    background: linear-gradient(135deg, #1B2A4A 0%, #1E3558 40%, #243D66 80%, #1B2A4A 100%);
    background-size: 200% 200%;
    position: relative;
    z-index: 1;
}

.nlp-features[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

/* Asymmetric bento: two wide bookend tiles + standard tiles (4-col base) */
.nlp-features-grid[b-82ahl2bvgj] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 1fr;
    gap: 1.25rem;
    position: relative;
    z-index: 1;
}

.nlp-feature-item[b-82ahl2bvgj] {
    display: flex;
    flex-direction: column;
    padding: 2.25rem;
    border-radius: 1rem;
    /* No backdrop-filter: the section behind is opaque navy, so the blur bought almost
       nothing visually but still forced a backdrop recompute on every paint. A flat
       translucent white reads as the same frosted-glass tile for free. */
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    height: 100%;
    position: relative;
    z-index: 1;
}

/* Wide bookend tiles span two columns and carry more weight */
.nlp-feature-item-wide[b-82ahl2bvgj] {
    grid-column: span 2;
    padding: 2.5rem;
}

.nlp-feature-item-wide .nlp-feature-icon[b-82ahl2bvgj] {
    width: 60px;
    height: 60px;
    border-radius: 1rem;
}

.nlp-feature-item-wide .nlp-feature-icon i[b-82ahl2bvgj] {
    font-size: 1.55rem;
}

.nlp-feature-item-wide h3[b-82ahl2bvgj] {
    font-size: 1.3rem;
}

.nlp-feature-item-wide p[b-82ahl2bvgj] {
    font-size: 0.98rem;
    max-width: 54ch;
}

.nlp-feature-item[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(196, 135, 90, 0.08) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.nlp-feature-item:hover[b-82ahl2bvgj] {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(196, 135, 90, 0.3);
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 50px rgba(27, 42, 74, 0.3), 0 0 30px rgba(196, 135, 90, 0.08);
}

.nlp-feature-item:hover[b-82ahl2bvgj]::before {
    opacity: 1;
}

.nlp-feature-icon[b-82ahl2bvgj] {
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(196, 135, 90, 0.22), rgba(212, 160, 109, 0.12));
    border-radius: 0.85rem;
    margin-bottom: 1.5rem;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-feature-item:hover .nlp-feature-icon[b-82ahl2bvgj] {
    transform: scale(1.15) rotate(-5deg);
    box-shadow: 0 0 20px rgba(196, 135, 90, 0.15);
}

.nlp-feature-icon i[b-82ahl2bvgj] {
    font-size: 1.3rem;
    color: #D4A06D;
}

.nlp-feature-item h3[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: #FFFFFF;
    margin-bottom: 0.5rem;
}

.nlp-feature-item p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.65);
    margin: 0;
}

/* ---------------------------------------
   STATISTICS SECTION � PREMIUM
   --------------------------------------- */
.nlp-stats[b-82ahl2bvgj] {
    padding: 6rem 0;
    background: transparent;
    position: relative;
}

.nlp-stats[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(27, 42, 74, 0.08), transparent) top / 100% 1px no-repeat,
        rgba(255, 255, 255, 0.55);
    pointer-events: none;
}

.nlp-stats-grid[b-82ahl2bvgj] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    max-width: 1000px;
    margin: 0 auto;
}

.nlp-stat-card[b-82ahl2bvgj] {
    text-align: center;
    padding: 2.5rem 1.5rem;
    border-radius: 1rem;
    background: #FAFAF7;
    border: 1px solid rgba(27, 42, 74, 0.06);
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.nlp-stat-card[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C4875A, #D4A06D);
    transform: scaleX(0);
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-stat-card:hover[b-82ahl2bvgj] {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 16px 44px rgba(27, 42, 74, 0.12);
}

.nlp-stat-card:hover[b-82ahl2bvgj]::after {
    transform: scaleX(1);
}

/* Highlighted stat card (our price) */
.nlp-stat-card-highlight[b-82ahl2bvgj] {
    background: linear-gradient(135deg, #1B2A4A 0%, #2D4A7A 100%);
    border-color: transparent;
}

.nlp-stat-card-highlight .nlp-stat-value[b-82ahl2bvgj] {
    color: #FFFFFF;
}

.nlp-stat-card-highlight .nlp-stat-label[b-82ahl2bvgj] {
    color: rgba(255, 255, 255, 0.75);
}

.nlp-stat-card-highlight .nlp-stat-icon[b-82ahl2bvgj] {
    background: rgba(196, 135, 90, 0.2);
}

.nlp-stat-card-highlight .nlp-stat-icon i[b-82ahl2bvgj] {
    color: #D4A06D;
}

.nlp-stat-card-highlight:hover[b-82ahl2bvgj] {
    box-shadow: 0 16px 44px rgba(27, 42, 74, 0.3), 0 0 30px rgba(196, 135, 90, 0.1);
}

.nlp-stat-icon[b-82ahl2bvgj] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(196, 135, 90, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.25rem;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-stat-card:hover .nlp-stat-icon[b-82ahl2bvgj] {
    transform: scale(1.15) rotate(-5deg);
    background: rgba(196, 135, 90, 0.18);
}

.nlp-stat-icon i[b-82ahl2bvgj] {
    font-size: 1.25rem;
    color: #C4875A;
}

.nlp-stat-value[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2.1rem;
    font-weight: 700;
    color: #1B2A4A;
    margin-bottom: 0.4rem;
    font-variant-numeric: tabular-nums;
}

.nlp-stat-label[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.84rem;
    color: #5A6474;
    line-height: 1.5;
}

/* ---------------------------------------
   GUIDE PREVIEW SECTION � PREMIUM
   --------------------------------------- */
.nlp-guide-preview[b-82ahl2bvgj] {
    padding: 7rem 0;
    background: transparent;
    position: relative;
}

.nlp-guide-preview[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.15), transparent) top / 100% 1px no-repeat,
        linear-gradient(180deg, rgba(245, 240, 234, 0.55) 0%, rgba(250, 250, 247, 0.55) 100%);
    pointer-events: none;
}

.nlp-guide-preview[b-82ahl2bvgj]::after {
    display: none;
}

.nlp-guide-cards[b-82ahl2bvgj] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.75rem;
    margin-bottom: 3rem;
}

.nlp-guide-card[b-82ahl2bvgj] {
    background: #FFFFFF;
    border: 1px solid rgba(27, 42, 74, 0.06);
    border-radius: 1rem;
    padding: 2rem 1.5rem;
    text-decoration: none !important;
    display: flex;
    flex-direction: column;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.nlp-guide-card[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #6B8F71, #8FB896, #6B8F71);
    background-size: 200% 100%;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-guide-card:hover[b-82ahl2bvgj] {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 0 24px 60px rgba(27, 42, 74, 0.12), 0 6px 16px rgba(27, 42, 74, 0.04);
    border-color: transparent;
}

.nlp-guide-card:hover[b-82ahl2bvgj]::before {
    transform: scaleX(1);
}

.nlp-guide-card-icon[b-82ahl2bvgj] {
    width: 50px;
    height: 50px;
    border-radius: 0.75rem;
    background: rgba(107, 143, 113, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-guide-card:hover .nlp-guide-card-icon[b-82ahl2bvgj] {
    transform: scale(1.15) rotate(-5deg);
    background: rgba(107, 143, 113, 0.2);
    box-shadow: 0 0 20px rgba(107, 143, 113, 0.1);
}

.nlp-guide-card-icon i[b-82ahl2bvgj] {
    font-size: 1.2rem;
    color: #6B8F71;
}

.nlp-guide-card h3[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.5rem;
}

.nlp-guide-card p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.88rem;
    line-height: 1.6;
    color: #5A6474;
    margin-bottom: 1rem;
    flex: 1;
}

.nlp-guide-card-link[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    color: #C4875A;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    transition: gap 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-guide-card:hover .nlp-guide-card-link[b-82ahl2bvgj] {
    gap: 0.65rem;
}

.nlp-guide-cta[b-82ahl2bvgj] {
    text-align: center;
}

/* ---------------------------------------
   FAQ SECTION � PREMIUM
   --------------------------------------- */
.nlp-faq[b-82ahl2bvgj] {
    padding: 7rem 0;
    background: transparent;
    position: relative;
}

.nlp-faq[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: rgba(255, 255, 255, 0.55);
    pointer-events: none;
}

.nlp-faq-grid[b-82ahl2bvgj] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    max-width: 960px;
    margin: 0 auto 2.5rem;
}

.nlp-faq-item[b-82ahl2bvgj] {
    background: #FAFAF7;
    border: 1px solid rgba(27, 42, 74, 0.06);
    border-radius: 1rem;
    padding: 2rem;
    transition: all 0.45s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.nlp-faq-item[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #C4875A, #D4A06D);
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-faq-item:hover[b-82ahl2bvgj] {
    border-color: rgba(196, 135, 90, 0.2);
    box-shadow: 0 8px 30px rgba(27, 42, 74, 0.08);
    transform: translateX(6px) translateY(-2px);
}

.nlp-faq-item:hover[b-82ahl2bvgj]::before {
    transform: scaleY(1);
}

.nlp-faq-item h3[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.6rem;
}

.nlp-faq-item p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    line-height: 1.65;
    color: #5A6474;
    margin: 0;
}

.nlp-faq-item a[b-82ahl2bvgj] {
    color: #C4875A;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.nlp-faq-item a:hover[b-82ahl2bvgj] {
    text-decoration: underline;
    color: #A96D3F;
}

.nlp-faq-more[b-82ahl2bvgj] {
    text-align: center;
}

.nlp-faq-more a[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: #C4875A;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    transition: gap 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.2s ease;
}

.nlp-faq-more a:hover[b-82ahl2bvgj] {
    gap: 0.75rem;
}

/* ---------------------------------------
   CONSUMER CTA � PREMIUM
   --------------------------------------- */
.nlp-consumer-cta[b-82ahl2bvgj] {
    padding: 5rem 0;
    background: transparent;
    position: relative;
}

.nlp-consumer-cta[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.25), transparent) top / 100% 1px no-repeat,
        linear-gradient(135deg, rgba(245, 240, 234, 0.55) 0%, rgba(237, 231, 221, 0.55) 50%, rgba(245, 240, 234, 0.55) 100%);
    pointer-events: none;
}

.nlp-consumer-cta[b-82ahl2bvgj]::after {
    display: none;
}

.nlp-consumer-cta-content[b-82ahl2bvgj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.5rem;
    max-width: 900px;
    margin: 0 auto;
}

.nlp-consumer-cta-text h2[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 1.85rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.6rem;
    line-height: 1.3;
    text-wrap: balance;
}

.nlp-consumer-cta-text p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    line-height: 1.7;
    color: #5A6474;
    margin-bottom: 0;
}

/* ---------------------------------------
   B2B TEASER � PREMIUM
   --------------------------------------- */
.nlp-b2b-teaser[b-82ahl2bvgj] {
    padding: 6.5rem 0;
    background: linear-gradient(135deg, #1B2A4A 0%, #1E3558 40%, #243D66 80%, #1B2A4A 100%);
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.nlp-b2b-teaser[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

.nlp-b2b-content[b-82ahl2bvgj] {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 3.5rem;
    align-items: center;
    position: relative;
    z-index: 1;
}

.nlp-b2b-text h2[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2rem;
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 1rem;
    line-height: 1.25;
    text-wrap: balance;
}

.nlp-b2b-text p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 1.75rem;
}

.nlp-btn-b2b[b-82ahl2bvgj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 1.85rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #C4875A 0%, #D4A06D 100%);
    color: #FFFFFF !important;
    box-shadow: 0 8px 25px rgba(196, 135, 90, 0.2);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.nlp-btn-b2b[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0);
    transition: background 0.2s ease;
    border-radius: inherit;
    pointer-events: none;
}

.nlp-btn-b2b:hover[b-82ahl2bvgj] {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(196, 135, 90, 0.4);
    color: #FFFFFF !important;
}

.nlp-btn-b2b:active[b-82ahl2bvgj]::after {
    background: rgba(0, 0, 0, 0.1);
}

.nlp-btn-b2b i[b-82ahl2bvgj] {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-btn-b2b:hover i[b-82ahl2bvgj] {
    transform: translateX(3px);
}

.nlp-b2b-features[b-82ahl2bvgj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.nlp-b2b-feature[b-82ahl2bvgj] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.75rem;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.7rem;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.nlp-b2b-feature:hover[b-82ahl2bvgj] {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(196, 135, 90, 0.35);
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 12px 32px rgba(27, 42, 74, 0.2), 0 0 20px rgba(196, 135, 90, 0.06);
}

.nlp-b2b-feature i[b-82ahl2bvgj] {
    font-size: 1.4rem;
    color: #D4A06D;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-b2b-feature:hover i[b-82ahl2bvgj] {
    transform: scale(1.15);
}

.nlp-b2b-feature span[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.85);
}

/* ---------------------------------------
   FINAL CTA � PREMIUM
   --------------------------------------- */
.nlp-cta[b-82ahl2bvgj] {
    padding: 7rem 0;
    background: transparent;
    position: relative;
    overflow: hidden;
}

.nlp-cta[b-82ahl2bvgj]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.2), transparent) top / 100% 1px no-repeat,
        linear-gradient(135deg, rgba(245, 240, 234, 0.55) 0%, rgba(237, 231, 221, 0.55) 50%, rgba(245, 240, 234, 0.55) 100%);
    pointer-events: none;
}

.nlp-cta[b-82ahl2bvgj]::after {
    display: none;
}

.nlp-cta-orb[b-82ahl2bvgj] {
    position: absolute;
    width: 350px;
    height: 350px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(196, 135, 90, 0.1) 0%, transparent 70%);
    top: -100px;
    right: -50px;
    filter: blur(40px);
    animation: nlp-orb-drift-b-82ahl2bvgj 20s ease-in-out infinite;
    pointer-events: none;
}

.nlp-cta-content[b-82ahl2bvgj] {
    text-align: center;
    max-width: 620px;
    margin: 0 auto;
}

.nlp-cta-content h2[b-82ahl2bvgj] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 1rem;
    text-wrap: balance;
}

.nlp-cta-content p[b-82ahl2bvgj] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.1rem;
    line-height: 1.7;
    color: #5A6474;
    margin-bottom: 2.5rem;
    text-wrap: pretty;
}

.nlp-cta-buttons[b-82ahl2bvgj] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.nlp-btn-cta[b-82ahl2bvgj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2.1rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #C4875A 0%, #D4A06D 100%);
    color: #FFFFFF !important;
    box-shadow: 0 8px 25px rgba(196, 135, 90, 0.2);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    border: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.nlp-btn-cta[b-82ahl2bvgj]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0);
    transition: background 0.2s ease;
    border-radius: inherit;
    pointer-events: none;
}

.nlp-btn-cta:hover[b-82ahl2bvgj] {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 14px 40px rgba(196, 135, 90, 0.42), 0 0 20px rgba(196, 135, 90, 0.1);
    color: #FFFFFF !important;
}

.nlp-btn-cta:active[b-82ahl2bvgj] {
    transform: translateY(-1px);
}

.nlp-btn-cta:active[b-82ahl2bvgj]::after {
    background: rgba(0, 0, 0, 0.08);
}

.nlp-btn-cta i[b-82ahl2bvgj] {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nlp-btn-cta:hover i[b-82ahl2bvgj] {
    transform: translateX(3px);
}

.nlp-btn-cta-outline[b-82ahl2bvgj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2.1rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.75rem;
    background: transparent;
    color: #1B2A4A !important;
    border: 2px solid rgba(27, 42, 74, 0.18);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
}

.nlp-btn-cta-outline:hover[b-82ahl2bvgj] {
    border-color: #1B2A4A;
    background: rgba(27, 42, 74, 0.04);
    color: #1B2A4A !important;
    transform: translateY(-2px);
}

.nlp-btn-cta-outline:active[b-82ahl2bvgj] {
    transform: translateY(0);
    background: rgba(27, 42, 74, 0.08);
}

/* ---------------------------------------
   ACCESSIBILITY � FOCUS & SCROLL
   --------------------------------------- */
.nlp-btn:focus-visible[b-82ahl2bvgj],
.nlp-btn-b2b:focus-visible[b-82ahl2bvgj],
.nlp-btn-cta:focus-visible[b-82ahl2bvgj],
.nlp-btn-cta-outline:focus-visible[b-82ahl2bvgj],
.nlp-guide-card:focus-visible[b-82ahl2bvgj],
.nlp-faq-more a:focus-visible[b-82ahl2bvgj] {
    outline: 2px solid #C4875A;
    outline-offset: 3px;
    box-shadow: 0 0 0 4px rgba(196, 135, 90, 0.2);
}

.nlp-skip-link[b-82ahl2bvgj] {
    position: absolute;
    top: -100%;
    left: 1rem;
    z-index: 9999;
    padding: 0.75rem 1.5rem;
    background: #1B2A4A;
    color: #FFFFFF;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    border-radius: 0 0 0.5rem 0.5rem;
    text-decoration: none;
    transition: top 0.2s ease;
}

.nlp-skip-link:focus[b-82ahl2bvgj] {
    top: 0;
}

/* ---------------------------------------
   MODAL OVERRIDES
   --------------------------------------- */
.modal-backdrop[b-82ahl2bvgj] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(27, 42, 74, 0.5);
    z-index: 1040;
    backdrop-filter: blur(6px);
}

[b-82ahl2bvgj] .modal-content.no-rounded-corners {
    border-radius: 1rem;
    border: none;
    box-shadow: 0 25px 60px rgba(27, 42, 74, 0.25);
}

[b-82ahl2bvgj] .modal-header {
    border-bottom: 1px solid rgba(27, 42, 74, 0.08);
    padding: 1.25rem 1.5rem;
}

[b-82ahl2bvgj] .modal-title {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-weight: 600;
    color: #1B2A4A;
}

[b-82ahl2bvgj] .modal-body {
    padding: 1.5rem;
}

/* ---------------------------------------
   RESPONSIVE: TABLET � PREMIUM
   --------------------------------------- */
@media (max-width: 991.98px) {
    .nlp-hero[b-82ahl2bvgj] {
        padding: 4rem 0 5rem;
        min-height: auto;
    }

    .nlp-hero-title[b-82ahl2bvgj] {
        font-size: 2.5rem;
    }

    .nlp-hero-visual[b-82ahl2bvgj] {
        margin-top: 3rem;
        height: 360px;
    }

    .nlp-hero-orb-1[b-82ahl2bvgj] {
        width: 250px;
        height: 250px;
    }

    .nlp-hero-orb-2[b-82ahl2bvgj] {
        width: 180px;
        height: 180px;
    }

    .nlp-services[b-82ahl2bvgj]::after,
    .nlp-guide-preview[b-82ahl2bvgj]::after,
    .nlp-consumer-cta[b-82ahl2bvgj]::after,
    .nlp-cta[b-82ahl2bvgj]::after {
        width: 320px;
        height: 320px;
    }

    .nlp-bg-blob[b-82ahl2bvgj] { opacity: 0.3; }
    .nlp-bg-blob-1[b-82ahl2bvgj] { width: 640px; height: 640px; }
    .nlp-bg-blob-2[b-82ahl2bvgj] { width: 560px; height: 560px; }
    .nlp-bg-blob-3[b-82ahl2bvgj] { width: 520px; height: 520px; opacity: 0.24; }
    .nlp-bg-blob-4[b-82ahl2bvgj] { width: 560px; height: 560px; }
    .nlp-bg-blob-5[b-82ahl2bvgj] { width: 520px; height: 520px; }
    .nlp-bg-blob-6[b-82ahl2bvgj] { width: 460px; height: 460px; opacity: 0.24; }
    .nlp-steps[b-82ahl2bvgj] {
        flex-direction: column;
        align-items: center;
        gap: 0;
    }

    .nlp-step-connector[b-82ahl2bvgj] {
        width: 2px;
        height: 40px;
        flex: 0 0 40px;
        margin-top: 0;
        background: linear-gradient(180deg, rgba(196, 135, 90, 0.2), rgba(196, 135, 90, 0.5), rgba(196, 135, 90, 0.2));
    }

    .nlp-step-connector[b-82ahl2bvgj]::after {
        display: none;
    }

    .nlp-step-content p[b-82ahl2bvgj] {
        max-width: 300px;
    }

    .nlp-section-title[b-82ahl2bvgj] {
        font-size: 2rem;
    }

    .nlp-services[b-82ahl2bvgj],
    .nlp-process[b-82ahl2bvgj],
    .nlp-features[b-82ahl2bvgj],
    .nlp-cta[b-82ahl2bvgj],
    .nlp-guide-preview[b-82ahl2bvgj],
    .nlp-faq[b-82ahl2bvgj] {
        padding: 5rem 0;
    }

    .nlp-stats-grid[b-82ahl2bvgj] {
        grid-template-columns: repeat(2, 1fr);
    }

    .nlp-features-grid[b-82ahl2bvgj] {
        grid-template-columns: repeat(2, 1fr);
    }

    .nlp-feature-item-wide[b-82ahl2bvgj] {
        grid-column: span 2;
    }

    .nlp-guide-cards[b-82ahl2bvgj] {
        grid-template-columns: repeat(2, 1fr);
    }

    .nlp-consumer-cta-content[b-82ahl2bvgj] {
        flex-direction: column;
        text-align: center;
    }

    .nlp-b2b-content[b-82ahl2bvgj] {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .nlp-b2b-features[b-82ahl2bvgj] {
        max-width: 360px;
        margin: 0 auto;
    }

    .nlp-btn-b2b[b-82ahl2bvgj] {
        margin: 0 auto;
    }

    /* Proportional reveal distance on tablet */
    .nlp-reveal[b-82ahl2bvgj] {
        transform: translateY(36px) scale(0.99);
    }
}

/* ---------------------------------------
   RESPONSIVE: MOBILE � PREMIUM
   --------------------------------------- */
@media (max-width: 575.98px) {
    .nlp-hero[b-82ahl2bvgj] {
        padding: 3rem 0 4rem;
    }

    .nlp-hero-title[b-82ahl2bvgj] {
        font-size: 2rem;
    }

    .nlp-hero-badge[b-82ahl2bvgj] {
        font-size: 0.78rem;
    }

    .nlp-hero-text[b-82ahl2bvgj] {
        font-size: 1.05rem;
    }

    .nlp-hero-buttons[b-82ahl2bvgj] {
        flex-direction: column;
        align-items: stretch;
    }

    .nlp-hero-buttons .nlp-btn[b-82ahl2bvgj] {
        text-align: center;
        justify-content: center;
    }

    .nlp-hero-trust[b-82ahl2bvgj] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .nlp-hero-visual[b-82ahl2bvgj] {
        height: 280px;
        margin-top: 2rem;
    }

    .nlp-hero-image-float[b-82ahl2bvgj] {
        width: 48%;
        height: 52%;
    }

    .nlp-hero-orb[b-82ahl2bvgj] {
        display: none;
    }

    .nlp-services[b-82ahl2bvgj]::after,
    .nlp-guide-preview[b-82ahl2bvgj]::after,
    .nlp-consumer-cta[b-82ahl2bvgj]::after,
    .nlp-cta[b-82ahl2bvgj]::after {
        display: none;
    }

    .nlp-bg-blob[b-82ahl2bvgj] { opacity: 0.24; }
    .nlp-bg-blob-1[b-82ahl2bvgj] { width: 440px; height: 440px; }
    .nlp-bg-blob-2[b-82ahl2bvgj] { width: 400px; height: 400px; }
    .nlp-bg-blob-3[b-82ahl2bvgj] { display: none; }
    .nlp-bg-blob-4[b-82ahl2bvgj] { display: none; }
    .nlp-bg-blob-5[b-82ahl2bvgj] { width: 360px; height: 360px; }
    .nlp-bg-blob-6[b-82ahl2bvgj] { display: none; }

    .nlp-section-title[b-82ahl2bvgj] {
        font-size: 1.7rem;
    }

    .nlp-section-label[b-82ahl2bvgj]::before,
    .nlp-section-label[b-82ahl2bvgj]::after {
        display: none;
    }

    .nlp-service-card[b-82ahl2bvgj] {
        padding: 2rem 1.5rem;
    }

    .nlp-cta-content h2[b-82ahl2bvgj] {
        font-size: 1.75rem;
    }

    .nlp-cta-buttons[b-82ahl2bvgj] {
        flex-direction: column;
        align-items: stretch;
    }

    .nlp-cta-buttons a[b-82ahl2bvgj] {
        text-align: center;
        justify-content: center;
    }

    .nlp-services[b-82ahl2bvgj],
    .nlp-process[b-82ahl2bvgj],
    .nlp-features[b-82ahl2bvgj],
    .nlp-cta[b-82ahl2bvgj],
    .nlp-guide-preview[b-82ahl2bvgj],
    .nlp-faq[b-82ahl2bvgj] {
        padding: 4rem 0;
    }

    .nlp-features-grid[b-82ahl2bvgj] {
        grid-template-columns: 1fr;
    }

    .nlp-feature-item[b-82ahl2bvgj] {
        padding: 1.5rem;
    }

    .nlp-feature-item-wide[b-82ahl2bvgj] {
        grid-column: span 1;
        padding: 1.5rem;
    }

    .nlp-feature-item-wide h3[b-82ahl2bvgj] {
        font-size: 1.15rem;
    }

    .nlp-stats-grid[b-82ahl2bvgj] {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .nlp-stat-value[b-82ahl2bvgj] {
        font-size: 1.5rem;
    }

    .nlp-guide-cards[b-82ahl2bvgj] {
        grid-template-columns: 1fr;
    }

    .nlp-faq-grid[b-82ahl2bvgj] {
        grid-template-columns: 1fr;
    }

    .nlp-consumer-cta[b-82ahl2bvgj] {
        padding: 3rem 0;
    }

    .nlp-consumer-cta-text h2[b-82ahl2bvgj] {
        font-size: 1.4rem;
    }

    .nlp-b2b-teaser[b-82ahl2bvgj] {
        padding: 3.5rem 0;
    }

    .nlp-b2b-text h2[b-82ahl2bvgj] {
        font-size: 1.5rem;
    }

    .nlp-b2b-features[b-82ahl2bvgj] {
        grid-template-columns: 1fr 1fr;
    }

    /* Proportional motion on mobile */
    .nlp-reveal[b-82ahl2bvgj] {
        transform: translateY(24px) scale(0.99);
    }

    .nlp-hero-grain[b-82ahl2bvgj] {
        display: none;
    }
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .nlp-reveal[b-82ahl2bvgj] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .nlp-visible .nlp-service-card[b-82ahl2bvgj],
    .nlp-visible .nlp-step[b-82ahl2bvgj],
    .nlp-visible .nlp-guide-card[b-82ahl2bvgj],
    .nlp-visible .nlp-stat-card[b-82ahl2bvgj],
    .nlp-visible .nlp-feature-item[b-82ahl2bvgj],
    .nlp-visible .nlp-faq-item[b-82ahl2bvgj],
    .nlp-visible .nlp-b2b-feature[b-82ahl2bvgj] {
        animation: none;
    }

    .nlp-hero-content[b-82ahl2bvgj],
    .nlp-hero-image[b-82ahl2bvgj],
    .nlp-hero-trust[b-82ahl2bvgj] {
        animation: none;
    }

    .nlp-hero-grain[b-82ahl2bvgj] {
        animation: none;
    }

    .nlp-bg-blob[b-82ahl2bvgj] {
        animation: none;
        opacity: 0.12;
        border-radius: 50%;
    }

    *[b-82ahl2bvgj],
    *[b-82ahl2bvgj]::before,
    *[b-82ahl2bvgj]::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
/* /Components/Pages/OmOss.razor.rz.scp.css */
/* ============================================
   Om Oss Page
   Aesthetic: Nordic Legal Trust
   Typography: Playfair Display + Outfit
   Palette: Navy + Copper + Warm neutrals
   ============================================ */

/* === Hero Section === */
.about-hero[b-fpyos3ab1r] {
    padding: 5rem 0 4rem;
    background: linear-gradient(135deg, #FAFAF7 0%, #F5F0EA 50%, #EDE7DD 100%);
    position: relative;
    overflow: hidden;
}

.about-hero[b-fpyos3ab1r]::before {
    content: '';
    position: absolute;
    top: -40%;
    right: -15%;
    width: 50%;
    height: 180%;
    background: radial-gradient(ellipse, rgba(196, 135, 90, 0.06) 0%, transparent 70%);
    pointer-events: none;
}

.about-hero[b-fpyos3ab1r]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.15), transparent);
}

.about-hero-content[b-fpyos3ab1r] {
    max-width: 720px;
    animation: about-fadeUp-b-fpyos3ab1r 0.8s ease-out;
}

.about-label[b-fpyos3ab1r] {
    display: inline-block;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #C4875A;
    margin-bottom: 1rem;
}

.about-hero-title[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 3rem;
    font-weight: 700;
    color: #1B2A4A;
    line-height: 1.2;
    margin-bottom: 1.25rem;
}

.about-accent[b-fpyos3ab1r] {
    color: #C4875A;
    font-style: italic;
}

.about-hero-text[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.15rem;
    line-height: 1.7;
    color: #5A6474;
    max-width: 600px;
}

/* === Shared === */
.about-section-label[b-fpyos3ab1r] {
    display: inline-block;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #C4875A;
    margin-bottom: 0.75rem;
}

.about-label-light[b-fpyos3ab1r] {
    color: #E8B992;
}

.about-section-header[b-fpyos3ab1r] {
    text-align: center;
    margin-bottom: 3rem;
}

.about-section-header h2[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2.2rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0;
    line-height: 1.3;
}

/* === Story Section === */
.about-story[b-fpyos3ab1r] {
    padding: 5rem 0;
    background: #FFFFFF;
}

.about-story-grid[b-fpyos3ab1r] {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 4rem;
    align-items: start;
}

.about-story-text h2[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 1.25rem;
    line-height: 1.3;
}

.about-story-text p[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    line-height: 1.75;
    color: #5A6474;
    margin-bottom: 1rem;
}

/* Timeline */
.about-timeline[b-fpyos3ab1r] {
    position: relative;
    padding-left: 2rem;
}

.about-timeline[b-fpyos3ab1r]::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: linear-gradient(180deg, #E8B992, #C4875A, #6B8F71);
    border-radius: 1px;
}

.about-timeline-item[b-fpyos3ab1r] {
    position: relative;
    padding-bottom: 2rem;
    padding-left: 1rem;
}

.about-timeline-item:last-child[b-fpyos3ab1r] {
    padding-bottom: 0;
}

.about-timeline-marker[b-fpyos3ab1r] {
    position: absolute;
    left: -2rem;
    top: 4px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 2px solid #C4875A;
    z-index: 1;
}

.about-timeline-marker-active[b-fpyos3ab1r] {
    background: #C4875A;
    box-shadow: 0 0 0 4px rgba(196, 135, 90, 0.15);
}

.about-timeline-label[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #C4875A;
    margin-bottom: 0.25rem;
    display: block;
}

.about-timeline-content h3[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.35rem;
}

.about-timeline-content p[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.92rem;
    line-height: 1.6;
    color: #5A6474;
    margin-bottom: 0;
}

/* === Mission Section === */
.about-mission[b-fpyos3ab1r] {
    padding: 5rem 0;
    background: linear-gradient(135deg, #1B2A4A 0%, #1E3558 50%, #243D66 100%);
    position: relative;
    overflow: hidden;
}

.about-mission[b-fpyos3ab1r]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

.about-mission-content[b-fpyos3ab1r] {
    max-width: 750px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

.about-mission-content h2[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2.2rem;
    font-weight: 600;
    color: #FFFFFF;
    margin-bottom: 1.25rem;
    line-height: 1.3;
}

.about-mission-text[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.1rem;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 1.5rem;
}

.about-mission-caveat[b-fpyos3ab1r] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    text-align: left;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    margin-top: 1.5rem;
}

.about-mission-caveat i[b-fpyos3ab1r] {
    color: #D4A06D;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.15rem;
}

/* === Values Section === */
.about-values[b-fpyos3ab1r] {
    padding: 5rem 0;
    background: #FAFAF7;
}

.about-values-grid[b-fpyos3ab1r] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.about-value-card[b-fpyos3ab1r] {
    background: #FFFFFF;
    border: 1px solid rgba(27, 42, 74, 0.06);
    border-radius: 1rem;
    padding: 2rem 1.5rem;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.about-value-card:hover[b-fpyos3ab1r] {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(27, 42, 74, 0.08);
    border-color: rgba(196, 135, 90, 0.15);
}

.about-value-icon[b-fpyos3ab1r] {
    width: 52px;
    height: 52px;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, rgba(196, 135, 90, 0.08), rgba(196, 135, 90, 0.15));
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.25rem;
}

.about-value-icon i[b-fpyos3ab1r] {
    font-size: 1.3rem;
    color: #C4875A;
}

.about-value-card h3[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.6rem;
}

.about-value-card p[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.92rem;
    line-height: 1.6;
    color: #5A6474;
    margin-bottom: 0;
}

/* === Audience Section === */
.about-audience[b-fpyos3ab1r] {
    padding: 5rem 0;
    background: #FFFFFF;
}

.about-audience-grid[b-fpyos3ab1r] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    max-width: 900px;
    margin: 0 auto;
}

.about-audience-card[b-fpyos3ab1r] {
    background: linear-gradient(135deg, #FAFAF7, #F5F0EA);
    border: 1px solid rgba(27, 42, 74, 0.06);
    border-radius: 1rem;
    padding: 2.5rem 2rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.about-audience-card:hover[b-fpyos3ab1r] {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(27, 42, 74, 0.08);
    border-color: rgba(196, 135, 90, 0.15);
}

.about-audience-icon[b-fpyos3ab1r] {
    width: 48px;
    height: 48px;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #C4875A, #D4A06D);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.about-audience-icon i[b-fpyos3ab1r] {
    font-size: 1.25rem;
    color: #FFFFFF;
}

.about-audience-card h3[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 1.3rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.75rem;
}

.about-audience-card p[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    line-height: 1.7;
    color: #5A6474;
    margin-bottom: 1rem;
}

.about-audience-link[b-fpyos3ab1r] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.92rem;
    font-weight: 600;
    color: #C4875A;
    text-decoration: none;
    transition: gap 0.3s ease, color 0.2s ease;
}

.about-audience-link:hover[b-fpyos3ab1r] {
    color: #A66E45;
    gap: 0.7rem;
}

/* === Company Section === */
.about-company[b-fpyos3ab1r] {
    padding: 5rem 0;
    background: #FAFAF7;
}

.about-company-content[b-fpyos3ab1r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.5rem;
    align-items: start;
}

.about-company-info h2[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 1.5rem;
}

.about-company-details[b-fpyos3ab1r] {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.about-detail-row[b-fpyos3ab1r] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 0.85rem 0;
    border-bottom: 1px solid rgba(27, 42, 74, 0.06);
}

.about-detail-row:first-child[b-fpyos3ab1r] {
    border-top: 1px solid rgba(27, 42, 74, 0.06);
}

.about-detail-row dt[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    color: #5A6474;
}

.about-detail-row dd[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1B2A4A;
    margin: 0;
}

.about-detail-row dd a[b-fpyos3ab1r] {
    color: #C4875A;
    text-decoration: none;
    transition: color 0.2s ease;
}

.about-detail-row dd a:hover[b-fpyos3ab1r] {
    color: #A66E45;
}

/* Trust items */
.about-company-trust[b-fpyos3ab1r] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.about-trust-item[b-fpyos3ab1r] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: #FFFFFF;
    border: 1px solid rgba(27, 42, 74, 0.06);
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    transition: border-color 0.3s ease;
}

.about-trust-item:hover[b-fpyos3ab1r] {
    border-color: rgba(196, 135, 90, 0.2);
}

.about-trust-item > i[b-fpyos3ab1r] {
    font-size: 1.4rem;
    color: #6B8F71;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.about-trust-item h3[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.2rem;
}

.about-trust-item p[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 0.88rem;
    line-height: 1.55;
    color: #5A6474;
    margin-bottom: 0;
}

/* === CTA Section === */
.about-cta[b-fpyos3ab1r] {
    padding: 5rem 0;
    background: linear-gradient(135deg, #F5F0EA 0%, #EDE7DD 100%);
    position: relative;
}

.about-cta[b-fpyos3ab1r]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(196, 135, 90, 0.15), transparent);
}

.about-cta-content[b-fpyos3ab1r] {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.about-cta-content h2[b-fpyos3ab1r] {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
    font-size: 2.2rem;
    font-weight: 600;
    color: #1B2A4A;
    margin-bottom: 0.75rem;
}

.about-cta-content p[b-fpyos3ab1r] {
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1.05rem;
    line-height: 1.65;
    color: #5A6474;
    margin-bottom: 2rem;
}

.about-cta-buttons[b-fpyos3ab1r] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.about-btn[b-fpyos3ab1r] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 1.75rem;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 0.5rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: none;
}

.about-btn-primary[b-fpyos3ab1r] {
    background: linear-gradient(135deg, #C4875A 0%, #D4A06D 100%);
    color: #FFFFFF !important;
    box-shadow: 0 4px 15px rgba(196, 135, 90, 0.3);
}

.about-btn-primary:hover[b-fpyos3ab1r] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(196, 135, 90, 0.4);
    color: #FFFFFF !important;
}

.about-btn-outline[b-fpyos3ab1r] {
    background: transparent;
    color: #1B2A4A !important;
    border: 2px solid rgba(27, 42, 74, 0.2);
}

.about-btn-outline:hover[b-fpyos3ab1r] {
    border-color: #1B2A4A;
    background: rgba(27, 42, 74, 0.04);
    color: #1B2A4A !important;
}

/* === Animation === */
@keyframes about-fadeUp-b-fpyos3ab1r {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* === Responsive: Tablet === */
@media (max-width: 991.98px) {
    .about-hero-title[b-fpyos3ab1r] {
        font-size: 2.4rem;
    }

    .about-story-grid[b-fpyos3ab1r] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .about-values-grid[b-fpyos3ab1r] {
        grid-template-columns: repeat(2, 1fr);
    }

    .about-company-content[b-fpyos3ab1r] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .about-hero[b-fpyos3ab1r],
    .about-story[b-fpyos3ab1r],
    .about-mission[b-fpyos3ab1r],
    .about-values[b-fpyos3ab1r],
    .about-audience[b-fpyos3ab1r],
    .about-company[b-fpyos3ab1r],
    .about-cta[b-fpyos3ab1r] {
        padding: 4rem 0;
    }
}

/* === Responsive: Mobile === */
@media (max-width: 575.98px) {
    .about-hero-title[b-fpyos3ab1r] {
        font-size: 1.9rem;
    }

    .about-hero-text[b-fpyos3ab1r] {
        font-size: 1.05rem;
    }

    .about-section-header h2[b-fpyos3ab1r],
    .about-story-text h2[b-fpyos3ab1r],
    .about-company-info h2[b-fpyos3ab1r] {
        font-size: 1.65rem;
    }

    .about-mission-content h2[b-fpyos3ab1r] {
        font-size: 1.65rem;
    }

    .about-values-grid[b-fpyos3ab1r] {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .about-value-card[b-fpyos3ab1r] {
        padding: 1.5rem 1.25rem;
    }

    .about-audience-grid[b-fpyos3ab1r] {
        grid-template-columns: 1fr;
    }

    .about-audience-card[b-fpyos3ab1r] {
        padding: 2rem 1.5rem;
    }

    .about-mission-caveat[b-fpyos3ab1r] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .about-cta-content h2[b-fpyos3ab1r] {
        font-size: 1.65rem;
    }

    .about-cta-buttons[b-fpyos3ab1r] {
        flex-direction: column;
        align-items: stretch;
    }

    .about-cta-buttons a[b-fpyos3ab1r] {
        text-align: center;
        justify-content: center;
    }

    .about-hero[b-fpyos3ab1r],
    .about-story[b-fpyos3ab1r],
    .about-mission[b-fpyos3ab1r],
    .about-values[b-fpyos3ab1r],
    .about-audience[b-fpyos3ab1r],
    .about-company[b-fpyos3ab1r],
    .about-cta[b-fpyos3ab1r] {
        padding: 3rem 0;
    }
}
/* /Components/Pages/Payments/KassaCheckout.razor.rz.scp.css */
/* Kassa — konsumentens betalvy. Lugn, förtroendeingivande, konverteringsmedveten.
   Följer DESIGN.md (Quiet Notary): navy/copper/warm-cream, Outfit, platt med lyft på state. */

.kassa-wrap[b-hkjhqvgz08] {
    max-width: 640px;
    margin: 2.5rem auto;
    padding: 0 1rem;
}

.kassa-head[b-hkjhqvgz08] {
    text-align: center;
    margin-bottom: 1.25rem;
}

.kassa-eyebrow[b-hkjhqvgz08] {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: #5A6474;
    margin-bottom: 0.4rem;
}

.kassa-title[b-hkjhqvgz08] {
    font-family: 'Outfit', 'Segoe UI', system-ui, sans-serif;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.2;
    color: #1B2A4A;
    margin: 0 0 0.4rem;
}

.kassa-lead[b-hkjhqvgz08] {
    color: #5A6474;
    font-size: 0.95rem;
    line-height: 1.55;
    max-width: 46ch;
    margin: 0 auto;
}

.kassa-card[b-hkjhqvgz08] {
    background: #FCFBF8;
    border: 1px solid #EDE7DD;
    border-radius: 0.75rem;
    padding: 1.5rem;
}

.kassa-center[b-hkjhqvgz08] {
    text-align: center;
}

.kassa-muted[b-hkjhqvgz08] {
    color: #5A6474;
}

.kassa-spinner[b-hkjhqvgz08],
.kassa-card .spinner-border[b-hkjhqvgz08] {
    color: #1B2A4A;
    margin-bottom: 0.75rem;
}

/* ── Tjänsteval ── */
.kassa-options[b-hkjhqvgz08] {
    border: 0;
    margin: 0 0 1.25rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.kassa-legend[b-hkjhqvgz08] {
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #5A6474;
    margin-bottom: 0.25rem;
    padding: 0;
    width: auto;
}

.kassa-option[b-hkjhqvgz08] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border: 1px solid #EDE7DD;
    border-radius: 0.5rem;
    background: #FCFBF8;
    cursor: pointer;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.kassa-option:hover[b-hkjhqvgz08] {
    background: #F5F0EA;
    box-shadow: 0 2px 6px rgba(27, 42, 74, 0.06);
}

.kassa-option.is-selected[b-hkjhqvgz08] {
    border-color: #C4875A;
    background: #FCFBF8;
    box-shadow: 0 0 0 1px #C4875A inset;
}

.kassa-checkbox[b-hkjhqvgz08] {
    margin-top: 0.2rem;
    width: 1.15rem;
    height: 1.15rem;
    accent-color: #C4875A;
    flex: 0 0 auto;
    cursor: pointer;
}

.kassa-option-body[b-hkjhqvgz08] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    flex: 1 1 auto;
    min-width: 0;
}

.kassa-option-name[b-hkjhqvgz08] {
    font-weight: 600;
    color: #1B2A4A;
    font-size: 0.98rem;
}

.kassa-option-desc[b-hkjhqvgz08] {
    font-size: 0.85rem;
    color: #5A6474;
    line-height: 1.45;
}

.kassa-option-price[b-hkjhqvgz08] {
    font-weight: 600;
    color: #1B2A4A;
    white-space: nowrap;
    flex: 0 0 auto;
}

/* ── Rabattkod ── */
.kassa-rabatt[b-hkjhqvgz08] {
    margin-bottom: 1rem;
}

.kassa-rabatt-label[b-hkjhqvgz08] {
    display: block;
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #5A6474;
    margin-bottom: 0.35rem;
}

.kassa-rabatt-row[b-hkjhqvgz08] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}

.kassa-rabatt-input[b-hkjhqvgz08] {
    flex: 1 1 auto;
    min-width: 0;
    border: 1px solid #EDE7DD;
    border-radius: 0.5rem;
    padding: 0.6rem 0.85rem;
    font-size: 0.95rem;
    color: #1B2A4A;
    background: #FCFBF8;
    text-transform: uppercase;
}

.kassa-rabatt-input:focus[b-hkjhqvgz08] {
    outline: none;
    border-color: #C4875A;
    box-shadow: 0 0 0 1px #C4875A inset;
}

.kassa-rabatt-input:disabled[b-hkjhqvgz08] {
    opacity: 0.6;
}

.kassa-rabatt-btn[b-hkjhqvgz08] {
    flex: 0 0 auto;
    justify-content: center;
    min-width: 6rem;
}

.kassa-rabatt-feedback[b-hkjhqvgz08] {
    margin: 0.5rem 0 0;
    font-size: 0.85rem;
    line-height: 1.4;
}

.kassa-rabatt-feedback.is-ok[b-hkjhqvgz08] {
    color: #6B8F71;
}

.kassa-rabatt-feedback.is-error[b-hkjhqvgz08] {
    color: #CC372C;
}

/* ── Summering ── */
.kassa-summary[b-hkjhqvgz08] {
    border-top: 1px solid #EDE7DD;
    padding-top: 1rem;
    margin-bottom: 1rem;
}

.kassa-summary-sub[b-hkjhqvgz08] {
    font-weight: 500;
    font-size: 0.92rem;
    color: #5A6474;
    margin-bottom: 0.3rem;
}

.kassa-summary-rabatt[b-hkjhqvgz08] {
    color: #6B8F71;
}

.kassa-summary-row[b-hkjhqvgz08] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-weight: 600;
    color: #1B2A4A;
    font-size: 1.05rem;
}

.kassa-total[b-hkjhqvgz08] {
    font-size: 1.5rem;
    font-weight: 600;
}

.kassa-vat[b-hkjhqvgz08] {
    text-align: right;
    font-size: 0.8rem;
    color: #5A6474;
    margin-top: 0.15rem;
}

.kassa-note[b-hkjhqvgz08] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background: #F5F0EA;
    border-radius: 0.5rem;
    padding: 0.7rem 0.85rem;
    margin: 0 0 1rem;
    font-size: 0.85rem;
    line-height: 1.45;
    color: #5A6474;
}

.kassa-note i[b-hkjhqvgz08] {
    color: #C4875A;
    margin-top: 0.1rem;
    flex: 0 0 auto;
}

/* ── Knappar ── */
.btn-kassa-primary[b-hkjhqvgz08] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    border: 0;
    background: #1B2A4A;
    color: #FCFBF8;
    font-weight: 600;
    font-size: 1rem;
    padding: 0.75rem 1.25rem;
    border-radius: 0.5rem;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 200ms ease;
}

.btn-kassa-primary:hover:not(:disabled)[b-hkjhqvgz08] {
    background: #C4875A;
    color: #FCFBF8;
}

.btn-kassa-primary:disabled[b-hkjhqvgz08] {
    opacity: 0.55;
    cursor: not-allowed;
}

.kassa-cta[b-hkjhqvgz08] {
    margin-top: 0.25rem;
}

.btn-kassa-secondary[b-hkjhqvgz08] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #FCFBF8;
    color: #1B2A4A;
    border: 1px solid #EDE7DD;
    padding: 0.6rem 1.25rem;
    border-radius: 0.5rem;
    text-decoration: none;
    font-weight: 500;
}

.btn-kassa-secondary:hover[b-hkjhqvgz08] {
    background: #F5F0EA;
    color: #1B2A4A;
}

.kassa-cancel[b-hkjhqvgz08] {
    display: block;
    text-align: center;
    margin-top: 0.75rem;
    color: #5A6474;
    font-size: 0.9rem;
    text-decoration: none;
}

.kassa-cancel:hover[b-hkjhqvgz08] {
    color: #C4875A;
    text-decoration: underline;
}

/* ── Trygghet ── */
.kassa-trust[b-hkjhqvgz08] {
    list-style: none;
    margin: 1.25rem 0 0;
    padding: 1rem 0 0;
    border-top: 1px solid #EDE7DD;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.25rem;
    justify-content: center;
    font-size: 0.82rem;
    color: #5A6474;
}

.kassa-trust li[b-hkjhqvgz08] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.kassa-trust i[b-hkjhqvgz08] {
    color: #6B8F71;
}

.kassa-testbadge[b-hkjhqvgz08] {
    margin-top: 1rem;
    text-align: center;
    font-size: 0.8rem;
    color: #1B2A4A;
    background: #F0B84B;
    border-radius: 999px;
    padding: 0.2rem 0.7rem;
    display: inline-block;
    width: auto;
}

/* ── Alert ── */
.kassa-alert[b-hkjhqvgz08] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background: #FCEEEC;
    border: 1px solid #CC372C;
    color: #CC372C;
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

/* ── Tomt/klart ── */
.kassa-checkmark[b-hkjhqvgz08] {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: #6B8F71;
    color: #FCFBF8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.75rem;
}

.kassa-center .kassa-title[b-hkjhqvgz08] {
    margin-top: 0.25rem;
}

.kassa-center .btn-kassa-primary[b-hkjhqvgz08],
.kassa-center .btn-kassa-secondary[b-hkjhqvgz08] {
    width: auto;
    margin-top: 0.5rem;
}
/* /Components/Shared/ArvingarListView.razor.rz.scp.css */
/* ArvingarListView – scoped styles */

.arvingar-listview .table thead th[b-gslwiyiwk0] {
    border-bottom-width: 2px;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
    user-select: none;
}

.arvingar-listview .table thead th:hover[b-gslwiyiwk0] {
    background-color: rgba(0, 0, 0, 0.04);
}

.arvingar-listview .table tbody tr:hover[b-gslwiyiwk0] {
    background-color: rgba(196, 135, 90, 0.08);
}

.arvingar-listview .table td[b-gslwiyiwk0] {
    font-size: 0.9rem;
    vertical-align: middle;
}

/* ── Mobile (< 576px) ── */
@media (max-width: 575.98px) {
    .arvingar-listview .table td[b-gslwiyiwk0],
    .arvingar-listview .table thead th[b-gslwiyiwk0] {
        font-size: 0.82rem;
        padding: 0.4rem 0.35rem;
    }

    .arvingar-listview .badge[b-gslwiyiwk0] {
        font-size: 0.68rem;
        padding: 0.2em 0.45em;
    }
}
/* /Components/Shared/AttSatsComponent.razor.rz.scp.css */
/* Base styles */
.att-sats-item[b-865ymmhdal] {
    transition: background-color 0.3s ease;
    position: relative;
}

    .att-sats-item:hover[b-865ymmhdal] {
        background-color: #f8f9fa;
    }

/* Dragging state */
.dragging[b-865ymmhdal] {
    opacity: 0.6;
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
    background-color: #fff8e1 !important;
}

/* Drag handle styles */
.drag-handle[b-865ymmhdal] {
    cursor: grab;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    margin-right: 6px;
    border-radius: 4px;
    user-select: none;
    background-color: #f0f0f0;
    transition: all 0.2s ease;
}

    .drag-handle:hover[b-865ymmhdal] {
        background-color: #e0e0e0;
        transform: scale(1.05);
    }

    .drag-handle:active[b-865ymmhdal],
    .dragging .drag-handle[b-865ymmhdal] {
        cursor: grabbing;
        background-color: #d0d0d0;
    }

    .drag-handle .bi-grip-vertical[b-865ymmhdal] {
        font-size: 1.1rem;
    }

/* Divider styling */
.divider[b-865ymmhdal] {
    position: relative;
    background-color: #f8f9fa;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    margin: 12px 0;
    padding: 10px;
    transition: all 0.3s ease;
}

/* Divider drop target styling */
.divider-drop-target[b-865ymmhdal] {
    background-color: #e9ecef;
    border: 2px dashed #0d6efd;
}

.att-text[b-865ymmhdal] {
    user-select: text;
}

.att-sats-item td[b-865ymmhdal] {
    padding: 12px 8px;
}

/* Style for active dragging state */
body.dragging-active .att-sats-item[b-865ymmhdal] {
    transition: padding 0.15s ease;
}

    body.dragging-active .att-sats-item:hover[b-865ymmhdal] {
        background-color: rgba(13, 110, 253, 0.05);
    }

/* Make the divider row a valid drop target */
.divider-row[b-865ymmhdal] {
    cursor: default;
    position: relative;
}

body.dragging-active .divider-row[b-865ymmhdal] {
    position: relative;
}

    body.dragging-active .divider-row:hover .divider[b-865ymmhdal] {
        background-color: #e9ecef;
    }

/* Drop indicator styling - DASHED LINE */
.blazor-drag-indicator[b-865ymmhdal] {
    position: fixed;
    height: 0;
    border-top: 3px dashed #0d6efd;
    z-index: 1000;
    pointer-events: none;
    box-shadow: 0 0 8px rgba(13, 110, 253, 0.5);
    width: 100%;
}

    /* Add animation to make the indicator more visible */
    .blazor-drag-indicator[b-865ymmhdal]::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: -5px;
        height: 10px;
        background: linear-gradient(to bottom, transparent, rgba(13, 110, 253, 0.1), transparent);
        pointer-events: none;
    }

.drop-indicator[b-865ymmhdal] {
    position: absolute;
    height: 3px;
    background-color: #0d6efd;
    z-index: 1000;
    border-radius: 1.5px;
    box-shadow: 0 0 5px rgba(13, 110, 253, 0.5);
    pointer-events: none;
    animation: pulse-blue-b-865ymmhdal 1.5s infinite;
}

@keyframes pulse-blue-b-865ymmhdal {
    0% {
        box-shadow: 0 0 0 0 rgba(13, 110, 253, 0.4);
    }

    70% {
        box-shadow: 0 0 0 5px rgba(13, 110, 253, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(13, 110, 253, 0);
    }
}
/* /Components/Shared/CompanyLogoPlate.razor.rz.scp.css */
/* Företagslogotyp i den mörka ärendemenyn (klickbar länk till Mina ärenden).

   Två lägen (väljs i komponenten):
     .is-dark – mörk-lägeslogga (ljus/vit variant) direkt på det marinblå, utan
                ruta. Ingen ombearbetning – den är gjord för mörk bakgrund.
     .is-band – vanlig logga på ett varmvitt band som kommer ner från menyns
                topp (kant-i-kant, rundade nedre hörn), för papperloggor.

   Gemensamt: object-fit: contain + max-mått gör att vilken storlek/proportion
   som helst skalas in utan beskärning eller förvrängning; små loggor blåses
   inte upp till suddiga pixlar (endast max-, inte fasta, mått). */

.company-logo-plate[b-vzderfuwu1] {
    --logo-max-h: 42px;

    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    text-decoration: none;
}

/* ── Mörk-lägeslogga: direkt på den marinblå menyn ───────────────────────── */
.company-logo-plate.is-dark[b-vzderfuwu1] {
    --logo-max-h: 96px; /* större logga – maxhöjden hindrar att den växer för mycket */
    --logo-max-w: 170px; /* avlånga loggor begränsas på bredden så de inte spänner hela menyn */

    margin: 10px 0 0.4rem; /* 10px luft ovanför loggan */
    padding: 0.2rem 0.6rem; /* minimal luft, ingen onödig tomyta */
    background: transparent;
    /* ingen avdelarlinje – whitespace räcker som separation mot menyn */
}

.company-logo-plate.is-dark .company-logo-img[b-vzderfuwu1] {
    transition: opacity 0.18s ease;
}

.company-logo-plate.is-dark:hover .company-logo-img[b-vzderfuwu1] {
    opacity: 0.85; /* diskret återkoppling på att bandet är klickbart */
}

.company-logo-plate.is-dark:focus-visible[b-vzderfuwu1] {
    outline: none;
    border-radius: 0.5rem;
    box-shadow: 0 0 0 3px rgba(196, 135, 90, 0.5); /* koppartonad fokusring */
}

/* ── Band: varmvitt fält som kommer ner från menyns topp ─────────────────── */
.company-logo-plate.is-band[b-vzderfuwu1] {
    /* width: auto (i stället för 100%) så att marginalen styr båda sidorna lika.
       Loggan ligger numera i .case-nav-shell, utanför scrollytan, så lika
       sidomarginal ger verkligt lika navy-kant (ingen scrollbar stör). */
    width: auto;
    min-height: 66px;

    /* Sitter högst upp i skalet (flush mot menyns topp), lika marginal sidorna. */
    margin: 0 0.7rem 0.7rem;
    padding: 0.9rem 1.1rem;

    background-color: #FCFBF8;
    border-radius: 0 0 0.75rem 0.75rem; /* mjuka endast nedre hörn */
    overflow: hidden; /* loggor med egen bakgrund respekterar de rundade hörnen */

    /* Mjuk skugga tonad mot menyns marinblå (ej svart, ej prestige-skugga). */
    box-shadow: 0 3px 8px rgba(10, 16, 30, 0.28);
    transition: box-shadow 0.18s ease;
}

.company-logo-plate.is-band:hover[b-vzderfuwu1] {
    box-shadow: 0 5px 14px rgba(10, 16, 30, 0.40);
}

.company-logo-plate.is-band:focus-visible[b-vzderfuwu1] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(196, 135, 90, 0.50); /* koppartonad fokusring */
}

/* ── Gemensam bildskalning ──────────────────────────────────────────────── */
.company-logo-img[b-vzderfuwu1] {
    display: block;
    width: auto;
    height: auto;
    max-width: var(--logo-max-w, 100%);
    max-height: var(--logo-max-h);
    object-fit: contain;
    object-position: center;
}
/* /Components/Shared/Hjalp/ArendeMeddelandeTrad.razor.rz.scp.css */
.hjalp-trad[b-9drjc85gou] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.hjalp-trad-meddelanden[b-9drjc85gou] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    max-height: 340px;
    overflow-y: auto;
    padding-right: .25rem;
}

.hjalp-trad-rad[b-9drjc85gou] {
    display: flex;
    justify-content: flex-start;
}

.hjalp-trad-rad--egen[b-9drjc85gou] {
    justify-content: flex-end;
}

.hjalp-trad-bubbla[b-9drjc85gou] {
    max-width: 85%;
    background: #f1f5f9;
    border-radius: .75rem;
    padding: .55rem .8rem;
}

.hjalp-trad-rad--egen .hjalp-trad-bubbla[b-9drjc85gou] {
    background: #e0e7ff;
}

.hjalp-trad-bubbla--intern[b-9drjc85gou] {
    background: #fff8e1;
    border: 1px dashed #f0ad4e;
}

.hjalp-trad-avsandare[b-9drjc85gou] {
    display: flex;
    align-items: center;
    gap: .25rem;
    font-size: .8rem;
    margin-bottom: .15rem;
}

.hjalp-trad-tid[b-9drjc85gou] {
    margin-left: auto;
    font-size: .72rem;
}

.hjalp-trad-text[b-9drjc85gou] {
    white-space: pre-wrap;
    color: #1e293b;
}

.hjalp-trad-skriv[b-9drjc85gou] {
    border-top: 1px solid #e2e8f0;
    padding-top: .6rem;
}

.hjalp-trad-bilagor[b-9drjc85gou] {
    border-top: 1px solid #e2e8f0;
    padding-top: .5rem;
}

.hjalp-trad-bilagor-rubrik[b-9drjc85gou] {
    font-size: .8rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: .3rem;
}

.hjalp-trad-bilagelista[b-9drjc85gou] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.hjalp-trad-bilaga[b-9drjc85gou] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .85rem;
}

.hjalp-trad-bilaga-lank[b-9drjc85gou] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-width: 0;
    text-decoration: none;
    color: #1d4ed8;
}

.hjalp-trad-bilaga-lank:hover[b-9drjc85gou] {
    text-decoration: underline;
}

.hjalp-trad-bilaga-namn[b-9drjc85gou] {
    max-width: 18rem;
    display: inline-block;
}

.hjalp-trad-bilaga-storlek[b-9drjc85gou] {
    font-size: .72rem;
    white-space: nowrap;
}

.hjalp-trad-actions[b-9drjc85gou] {
    gap: .75rem;
}

.hjalp-trad-bifoga[b-9drjc85gou] {
    max-width: 22rem;
}

@media (max-width: 575.98px) {
    .hjalp-trad-bilaga-namn[b-9drjc85gou] {
        max-width: 11rem;
    }

    .hjalp-trad-bifoga[b-9drjc85gou] {
        max-width: none;
    }
}
/* /Components/Shared/Hjalp/FeedbackTab.razor.rz.scp.css */
.hjalp-tab[b-5s9zf7ppds] {
    display: flex;
    flex-direction: column;
}

.hjalp-tab-intro[b-5s9zf7ppds] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    padding: .85rem 1rem;
}

.hjalp-card[b-5s9zf7ppds] {
    border: 1px solid #e2e8f0;
    border-radius: .85rem;
    padding: 1.1rem 1.2rem;
    background: #fff;
}

.hjalp-betyg[b-5s9zf7ppds] {
    display: flex;
    align-items: center;
    gap: .15rem;
}

.hjalp-betyg-stjarna[b-5s9zf7ppds] {
    background: none;
    border: 0;
    font-size: 1.6rem;
    line-height: 1;
    color: #cbd5e1;
    padding: .1rem .15rem;
    cursor: pointer;
    transition: color .1s ease, transform .1s ease;
}

.hjalp-betyg-stjarna:hover[b-5s9zf7ppds] {
    transform: scale(1.1);
}

.hjalp-betyg-stjarna--vald[b-5s9zf7ppds] {
    color: #f59e0b;
}

.hjalp-betyg-rensa[b-5s9zf7ppds] {
    margin-left: .35rem;
}
/* /Components/Shared/Hjalp/ForetagAvtalsbekraftelse.razor.rz.scp.css */
.hjalp-bekraftelse[b-1cfyoqx2b7] {
    display: flex;
    flex-direction: column;
}

.hjalp-bekraftelse-head[b-1cfyoqx2b7] {
    margin-bottom: .5rem;
}

.hjalp-bekraftelse-lista[b-1cfyoqx2b7] {
    display: flex;
    flex-direction: column;
    gap: .9rem;
}

.hjalp-bekraftelse-rad[b-1cfyoqx2b7] {
    border: 1px solid #e2e8f0;
    border-radius: .85rem;
    padding: 1rem 1.1rem;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: .65rem;
}

.hjalp-bekraftelse-rad-head[b-1cfyoqx2b7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
}

.hjalp-bekraftelse-offertdata[b-1cfyoqx2b7] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .25rem 1rem;
}

.hjalp-bekraftelse-pris[b-1cfyoqx2b7] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1B2A4A;
}

.hjalp-bekraftelse-modell[b-1cfyoqx2b7] {
    font-size: .85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: .2rem;
}

.hjalp-bekraftelse-notis[b-1cfyoqx2b7] {
    background: #f1f5f9;
    border-radius: .5rem;
    padding: .5rem .7rem;
    font-size: .85rem;
    color: #475569;
}

.hjalp-bekraftelse-chatt[b-1cfyoqx2b7] {
    border-top: 1px solid #e2e8f0;
    padding-top: .7rem;
}

.hjalp-bekraftelse-actions[b-1cfyoqx2b7] {
    display: flex;
    justify-content: flex-end;
}
/* /Components/Shared/Hjalp/ForetagHemSektion.razor.rz.scp.css */
.hjalp-foretag-hem[b-lmm8ghnaux] {
    margin-top: 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.hjalp-foretag-block[b-lmm8ghnaux] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.25rem 1.35rem;
}

.hjalp-foretag-namn[b-lmm8ghnaux] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1B2A4A;
    margin: 0 0 .9rem;
}

.hjalp-aktiva-lista[b-lmm8ghnaux] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    margin-top: .5rem;
}

.hjalp-aktiva-rad[b-lmm8ghnaux] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    padding: .75rem .9rem;
}
/* /Components/Shared/Hjalp/ForetagOffertInkorg.razor.rz.scp.css */
.hjalp-inkorg[b-xpxmsmz9uw] {
    display: flex;
    flex-direction: column;
}

.hjalp-inkorg-head[b-xpxmsmz9uw] {
    margin-bottom: .5rem;
}

.hjalp-inkorg-lista[b-xpxmsmz9uw] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.hjalp-inkorg-rad[b-xpxmsmz9uw] {
    border: 1px solid #e2e8f0;
    border-radius: .8rem;
    padding: .9rem 1rem;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.hjalp-inkorg-rad-head[b-xpxmsmz9uw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
}

.hjalp-inkorg-kategorier[b-xpxmsmz9uw] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.hjalp-inkorg-beskrivning[b-xpxmsmz9uw] {
    white-space: pre-wrap;
    color: #334155;
    margin: 0;
}

.hjalp-inkorg-actions[b-xpxmsmz9uw] {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}
/* /Components/Shared/Hjalp/JuridiskHjalpTab.razor.rz.scp.css */
.hjalp-tab[b-jn57l6yy5e] {
    display: flex;
    flex-direction: column;
}

.hjalp-tab-intro[b-jn57l6yy5e] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    padding: .85rem 1rem;
}

.hjalp-card[b-jn57l6yy5e] {
    border: 1px solid #e2e8f0;
    border-radius: .85rem;
    padding: 1.1rem 1.2rem;
    background: #fff;
}

.hjalp-kat-grid[b-jn57l6yy5e] {
    display: grid;
    grid-template-columns: 1fr;
    gap: .5rem;
}

@media (min-width: 576px) {
    .hjalp-kat-grid[b-jn57l6yy5e] {
        grid-template-columns: 1fr 1fr;
    }
}

.hjalp-kat-val[b-jn57l6yy5e] {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    border: 1px solid #e2e8f0;
    border-radius: .6rem;
    padding: .6rem .75rem;
    cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}

.hjalp-kat-val:hover[b-jn57l6yy5e] {
    border-color: #c7d2fe;
}

.hjalp-kat-val--vald[b-jn57l6yy5e] {
    border-color: #4f46e5;
    background: #eef2ff;
}

.hjalp-kat-val input[b-jn57l6yy5e] {
    margin-top: .2rem;
}

.hjalp-kat-namn[b-jn57l6yy5e] {
    display: block;
    font-weight: 600;
    color: #1e293b;
}

.hjalp-kat-beskrivning[b-jn57l6yy5e] {
    display: block;
    font-size: .8rem;
    color: #64748b;
}

.hjalp-gdpr[b-jn57l6yy5e] {
    background: #f1f5f9;
    border-radius: .6rem;
    padding: .7rem .85rem;
}

.hjalp-egen-arende[b-jn57l6yy5e] {
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    padding: .9rem 1rem;
    margin-top: .75rem;
}

.hjalp-egen-arende-head[b-jn57l6yy5e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .4rem;
}

.hjalp-egen-arende-beskrivning[b-jn57l6yy5e] {
    white-space: pre-wrap;
    color: #334155;
    margin-bottom: .6rem;
}

.hjalp-offert-lista[b-jn57l6yy5e] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.hjalp-egen-arende-trad[b-jn57l6yy5e] {
    border-top: 1px solid #e2e8f0;
    padding-top: .75rem;
}
/* /Components/Shared/Hjalp/KonsumentOffertSektion.razor.rz.scp.css */
.hjalp-hem-sektion[b-dvb19xbnim] {
    margin-top: 1.5rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.25rem 1.35rem;
}

.hjalp-hem-head[b-dvb19xbnim] {
    margin-bottom: .9rem;
}

.hjalp-hem-titel[b-dvb19xbnim] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1B2A4A;
    margin: 0;
}

.hjalp-hem-lead[b-dvb19xbnim] {
    color: #64748b;
    margin: .35rem 0 0;
    font-size: .92rem;
}

.hjalp-hem-lista[b-dvb19xbnim] {
    display: flex;
    flex-direction: column;
    gap: .85rem;
}

.hjalp-hem-arende[b-dvb19xbnim] {
    border: 1px solid #e2e8f0;
    border-radius: .8rem;
    padding: .9rem 1rem;
}

.hjalp-hem-arende-head[b-dvb19xbnim] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .4rem;
}

.hjalp-hem-beskrivning[b-dvb19xbnim] {
    white-space: pre-wrap;
    color: #334155;
    margin-bottom: .6rem;
}

.hjalp-hem-offerter[b-dvb19xbnim] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.hjalp-hem-uppdrag-actions[b-dvb19xbnim] {
    margin-top: .75rem;
    display: flex;
    justify-content: flex-end;
}

.hjalp-hem-omdome[b-dvb19xbnim] {
    margin-top: .85rem;
    padding-top: .85rem;
    border-top: 1px solid #e2e8f0;
}

.hjalp-hem-omdome-rubrik[b-dvb19xbnim] {
    font-weight: 600;
    color: #334155;
    margin-bottom: .35rem;
}

.hjalp-betyg[b-dvb19xbnim] {
    display: flex;
    align-items: center;
    gap: .15rem;
}

.hjalp-betyg-stjarna[b-dvb19xbnim] {
    background: none;
    border: 0;
    font-size: 1.5rem;
    line-height: 1;
    color: #cbd5e1;
    padding: .1rem .15rem;
    cursor: pointer;
    transition: color .1s ease, transform .1s ease;
}

.hjalp-betyg-stjarna:hover[b-dvb19xbnim] {
    transform: scale(1.1);
}

.hjalp-betyg-stjarna--vald[b-dvb19xbnim] {
    color: #f59e0b;
}

.hjalp-hem-omdome-actions[b-dvb19xbnim] {
    display: flex;
    justify-content: flex-end;
}
/* /Components/Shared/Hjalp/OffertFormular.razor.rz.scp.css */
.hjalp-offert-form[b-vix0dtej8d] {
    display: flex;
    flex-direction: column;
}

.hjalp-offert-villkor[b-vix0dtej8d] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .7rem;
    padding: .85rem 1rem;
    margin-top: 1rem;
}

.hjalp-offert-villkor ul[b-vix0dtej8d] {
    padding-left: 1.1rem;
    color: #475569;
}
/* /Components/Shared/Hjalp/OffertKort.razor.rz.scp.css */
.hjalp-offert-kort[b-cwtbkj5oem] {
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: .75rem;
    padding: 1rem 1.1rem;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.hjalp-offert-kort--accepterad[b-cwtbkj5oem],
.hjalp-offert-kort--aktiv[b-cwtbkj5oem] {
    border-color: #198754;
    box-shadow: 0 0 0 1px rgba(25, 135, 84, .15);
}

.hjalp-offert-kort--inaktiv[b-cwtbkj5oem] {
    opacity: .65;
}

.hjalp-offert-kort-head[b-cwtbkj5oem] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.hjalp-offert-foretag[b-cwtbkj5oem] {
    display: flex;
    align-items: center;
    min-width: 0;
    flex-wrap: wrap;
    gap: .15rem .25rem;
}

.hjalp-offert-betyg[b-cwtbkj5oem] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .85rem;
    color: #f59e0b;
    white-space: nowrap;
}

.hjalp-offert-betyg-varde[b-cwtbkj5oem] {
    font-weight: 600;
    color: #334155;
}

.hjalp-offert-betyg-tomt[b-cwtbkj5oem] {
    font-size: .8rem;
}

.hjalp-offert-pris-belopp[b-cwtbkj5oem] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1B2A4A;
}

.hjalp-offert-pris-modell[b-cwtbkj5oem] {
    font-size: .85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: .25rem;
}

.hjalp-offert-meddelande[b-cwtbkj5oem] {
    margin: 0;
    white-space: pre-wrap;
    color: #334155;
}

.hjalp-offert-actions[b-cwtbkj5oem] {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .25rem;
}
/* /Components/Shared/Hjalp/SupportTab.razor.rz.scp.css */
.hjalp-tab[b-4hxocnk8n1] {
    display: flex;
    flex-direction: column;
}

.hjalp-tab-intro[b-4hxocnk8n1] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    padding: .85rem 1rem;
}

.hjalp-card[b-4hxocnk8n1] {
    border: 1px solid #e2e8f0;
    border-radius: .85rem;
    padding: 1.1rem 1.2rem;
    background: #fff;
}

.hjalp-support-arende[b-4hxocnk8n1] {
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    margin-top: .6rem;
    overflow: hidden;
}

.hjalp-support-arende-head[b-4hxocnk8n1] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    background: #f8fafc;
    border: 0;
    padding: .7rem .9rem;
    cursor: pointer;
}

.hjalp-support-arende-head:hover[b-4hxocnk8n1] {
    background: #f1f5f9;
}

.hjalp-support-arende-body[b-4hxocnk8n1] {
    padding: .85rem .9rem;
}

/* Ursprunglig beskrivning som kunden skrev när ärendet skapades. */
.hjalp-support-beskrivning[b-4hxocnk8n1] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .6rem;
    padding: .6rem .75rem;
}

.hjalp-support-desc[b-4hxocnk8n1] {
    white-space: pre-wrap;
    word-break: break-word;
}

/* Kort förhandsvisning av beskrivningen i den hopfällda raden. */
.hjalp-support-preview[b-4hxocnk8n1] {
    max-width: 100%;
}
/* /Components/Shared/TimeTracking/TimeTrackingPanel.razor.rz.scp.css */
.tt-collapsed-bar[b-ppt562pscz] {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 36px;
    background-color: #1e293b;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    cursor: pointer;
    z-index: 1040;
    transition: background-color 0.2s, width 0.2s;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.12);
}

.tt-collapsed-bar:hover[b-ppt562pscz] {
    background-color: #334155;
    width: 40px;
}

.tt-collapsed-arrow[b-ppt562pscz] {
    font-size: 0.85rem;
    opacity: 0.6;
    transition: opacity 0.2s, transform 0.2s;
}

.tt-collapsed-bar:hover .tt-collapsed-arrow[b-ppt562pscz] {
    opacity: 1;
    transform: translateX(-2px);
}

.tt-collapsed-icon[b-ppt562pscz] {
    font-size: 1rem;
    opacity: 0.9;
}

.tt-collapsed-time[b-ppt562pscz] {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    opacity: 0.85;
    font-variant-numeric: tabular-nums;
}

.tt-collapsed-label[b-ppt562pscz] {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    opacity: 0.4;
}

.tt-bar-btn-group[b-ppt562pscz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.tt-bar-btn[b-ppt562pscz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    background: transparent;
    color: #fff;
    font-size: 0.7rem;
    cursor: pointer;
    padding: 0;
    transition: background-color 0.2s, border-color 0.2s;
}

.tt-bar-btn:hover[b-ppt562pscz] {
    background-color: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.6);
}

.tt-pulse[b-ppt562pscz] {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #3b82f6;
    animation: tt-pulse-anim-b-ppt562pscz 1.5s ease-in-out infinite;
}

@keyframes tt-pulse-anim-b-ppt562pscz {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.7); }
}

.tt-panel[b-ppt562pscz] {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 400px;
    max-width: 95vw;
    background-color: #fff;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    animation: tt-slide-in-b-ppt562pscz 0.25s ease-out;
    border-left: 1px solid #e2e8f0;
}

@keyframes tt-slide-in-b-ppt562pscz {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

.tt-panel-header[b-ppt562pscz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background-color: #1e293b;
    color: #fff;
    flex-shrink: 0;
}

.tt-panel-body[b-ppt562pscz] {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
}

@media (max-width: 767.98px) {
    .tt-collapsed-bar[b-ppt562pscz] {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 32px;
        flex-direction: row;
        justify-content: center;
        gap: 8px;
    }

    .tt-collapsed-bar:hover[b-ppt562pscz] {
        width: 100%;
    }

    .tt-collapsed-time[b-ppt562pscz],
    .tt-collapsed-label[b-ppt562pscz] {
        writing-mode: horizontal-tb;
        text-orientation: initial;
    }

    .tt-collapsed-arrow[b-ppt562pscz] {
        transform: rotate(90deg);
    }

    .tt-collapsed-bar:hover .tt-collapsed-arrow[b-ppt562pscz] {
        transform: rotate(90deg) translateX(-2px);
    }

    .tt-bar-btn-group[b-ppt562pscz] {
        flex-direction: row;
    }

    .tt-panel[b-ppt562pscz] {
        width: 100vw;
        max-width: 100vw;
    }
}