/* NebulaCloud Knowledge Base articles — intentionally scoped to Echo KB markup. */
:root {
    --nebula-article-navy: #102f46;
    --nebula-article-navy-deep: #0a263b;
    --nebula-article-pink: #c92f76;
    --nebula-article-pink-dark: #a92260;
    --nebula-article-cyan: #22b8c8;
    --nebula-article-ink: #243746;
    --nebula-article-muted: #637586;
    --nebula-article-border: #e1eaf0;
    --nebula-article-soft: #f4f8fa;
}

.blog-container article.single-post .post-content > .entry-title,
.blog-container article.single-post .post-content > .entry-meta {
    display: none !important;
}

.blog-container article.single-post .post-content > .post-category {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 0 18px !important;
    padding: 7px 13px !important;
    border-radius: 999px !important;
    background: #f9e7f0 !important;
    color: var(--nebula-article-pink-dark) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .06em !important;
    line-height: 1 !important;
}

#eckb-article-page-container-v2,
#eckb-article-content,
#eckb-article-content-body {
    color: var(--nebula-article-ink) !important;
}

#eckb-article-body,
#eckb-article-content {
    width: 100% !important;
    max-width: none !important;
}

#eckb-article-content {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#eckb-article-content-header-v2 {
    position: relative !important;
    overflow: hidden !important;
    margin: 0 0 30px !important;
    padding: 25px 28px 27px !important;
    border: 1px solid #dbe7ed !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, #f8fbfc 0%, #fff 65%, #fcedf4 145%) !important;
    box-shadow: 0 12px 32px rgba(16, 47, 70, .07) !important;
}

#eckb-article-content-header-v2::after {
    position: absolute;
    width: 150px;
    height: 150px;
    top: -92px;
    right: -58px;
    border-radius: 50%;
    background: rgba(201, 47, 118, .10);
    content: "";
    pointer-events: none;
}

#eckb-article-content .eckb-article-title {
    position: relative !important;
    z-index: 1 !important;
    margin: 13px 0 6px !important;
    color: var(--nebula-article-navy-deep) !important;
    font-size: clamp(30px, 3.3vw, 40px) !important;
    font-weight: 760 !important;
    line-height: 1.12 !important;
    letter-spacing: -.035em !important;
}

#eckb-article-content-header-v2 a,
#eckb-article-content-header-v2 .eckb-article-content-header-row-left-group,
#eckb-article-content-header-v2 .eckb-article-content-header-row-right-group {
    color: #687b89 !important;
}

#eckb-article-content-body {
    padding: 0 !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}

#eckb-article-content-body > p:first-child {
    margin: 0 0 24px !important;
    color: #43596b !important;
    font-size: 18px !important;
    line-height: 1.72 !important;
}

#eckb-article-content-body p {
    margin: 0 0 20px !important;
    color: #526575 !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}

#eckb-article-content-body h2,
#eckb-article-content-body h2.has-large-font-size {
    margin: 42px 0 14px !important;
    color: var(--nebula-article-navy-deep) !important;
    font-size: clamp(26px, 2.8vw, 31px) !important;
    font-weight: 760 !important;
    line-height: 1.2 !important;
    letter-spacing: -.025em !important;
}

#eckb-article-content-body h2::before {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 11px 4px 0;
    border-radius: 50%;
    background: var(--nebula-article-cyan);
    content: "";
}

#eckb-article-content-body h3 {
    margin: 30px 0 11px !important;
    color: var(--nebula-article-navy) !important;
    font-size: 21px !important;
    font-weight: 720 !important;
    line-height: 1.3 !important;
}

#eckb-article-content-body a {
    color: var(--nebula-article-pink) !important;
    font-weight: 650 !important;
    text-decoration-color: rgba(201, 47, 118, .35) !important;
    text-underline-offset: 3px !important;
}

#eckb-article-content-body a:hover,
#eckb-article-content-body a:focus-visible {
    color: var(--nebula-article-pink-dark) !important;
    text-decoration-color: currentColor !important;
}

#eckb-article-content-body .wp-block-group.has-background,
#eckb-article-content-body blockquote {
    margin: 26px 0 !important;
    padding: 20px 22px !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-left: 4px solid var(--nebula-article-cyan) !important;
    border-radius: 0 14px 14px 0 !important;
    background: #edf9fb !important;
    box-shadow: none !important;
}

#eckb-article-content-body .wp-block-group.has-background p,
#eckb-article-content-body blockquote p {
    margin: 0 !important;
    color: #3e5969 !important;
}

#eckb-article-content-body .wp-block-ideabox-toc {
    margin: 28px 0 34px !important;
}

#eckb-article-content-body .ib-toc-container {
    overflow: hidden !important;
    border: 1px solid #efd7e3 !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 10px 28px rgba(117, 31, 73, .06) !important;
}

#eckb-article-content-body .ib-toc-header {
    padding: 15px 19px !important;
    background: #fbf1f6 !important;
    color: var(--nebula-article-navy) !important;
}

#eckb-article-content-body .ib-toc-header-title {
    font-size: 15px !important;
    font-weight: 780 !important;
}

#eckb-article-content-body .ib-toc-separator {
    height: 1px !important;
    background: #efd7e3 !important;
}

#eckb-article-content-body .ib-toc-body {
    padding: 14px 18px 16px !important;
    background: #fff !important;
    color: #526575 !important;
}

#eckb-article-content-body .ib-toc-body ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 3px 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#eckb-article-content-body .ib-toc-body li {
    position: relative !important;
    margin: 0 !important;
    padding: 7px 0 7px 15px !important;
    border-bottom: 1px solid #f2e8ed !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

#eckb-article-content-body .ib-toc-body li::before {
    position: absolute;
    left: 0;
    top: 14px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--nebula-article-cyan);
    content: "";
}

#eckb-article-content-body .ib-toc-body a {
    color: #536575 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

#eckb-article-content-body ol.wp-block-list {
    counter-reset: nebula-step;
    margin: 22px 0 28px !important;
    padding: 0 !important;
    list-style: none !important;
}

#eckb-article-content-body ol.wp-block-list > li {
    position: relative !important;
    counter-increment: nebula-step;
    margin: 0 0 11px !important;
    padding: 14px 16px 14px 52px !important;
    border: 1px solid var(--nebula-article-border) !important;
    border-radius: 13px !important;
    background: #fff !important;
    color: #455b6b !important;
    line-height: 1.58 !important;
}

#eckb-article-content-body ol.wp-block-list > li::before {
    position: absolute;
    left: 14px;
    top: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 27px;
    height: 27px;
    border-radius: 9px;
    background: var(--nebula-article-pink);
    color: #fff;
    content: counter(nebula-step);
    font-size: 12px;
    font-weight: 800;
}

#eckb-article-content-body ul.wp-block-list {
    margin: 18px 0 26px !important;
    padding: 0 !important;
    list-style: none !important;
}

#eckb-article-content-body ul.wp-block-list > li {
    position: relative !important;
    margin: 0 0 8px !important;
    padding: 5px 0 5px 28px !important;
    color: #4b6070 !important;
    line-height: 1.62 !important;
}

#eckb-article-content-body ul.wp-block-list > li::before {
    position: absolute;
    left: 2px;
    top: 11px;
    width: 10px;
    height: 6px;
    border-bottom: 2px solid var(--nebula-article-cyan);
    border-left: 2px solid var(--nebula-article-cyan);
    content: "";
    transform: rotate(-45deg);
}

#eckb-article-content-body pre.wp-block-code {
    overflow-x: auto !important;
    margin: 22px 0 28px !important;
    padding: 21px 23px !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: var(--nebula-article-navy-deep) !important;
    box-shadow: 0 12px 28px rgba(10, 38, 59, .16) !important;
}

#eckb-article-content-body pre.wp-block-code code {
    color: #eaf7fa !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

#eckb-article-content-body :not(pre) > code {
    padding: 2px 7px !important;
    border-radius: 6px !important;
    background: #f4edf1 !important;
    color: var(--nebula-article-pink-dark) !important;
    font-size: .9em !important;
}

#eckb-article-content-body figure.wp-block-image {
    margin: 30px 0 34px !important;
}

#eckb-article-content-body figure.wp-block-image img,
#eckb-article-content-body > p > img,
#eckb-article-content-body .nebula-guide-visual img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border: 1px solid #dbe6ec !important;
    border-radius: 17px !important;
    background: #f7fafb !important;
    box-shadow: 0 14px 34px rgba(16, 47, 70, .10) !important;
}

#eckb-article-content-body figcaption {
    margin-top: 10px !important;
    color: #748694 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    text-align: center !important;
}

#eckb-article-content-body .nebula-guide-visual {
    display: grid !important;
    grid-template-columns: 104px minmax(0, 1fr) !important;
    gap: 22px !important;
    align-items: center !important;
    margin: 26px 0 32px !important;
    padding: 21px 23px !important;
    border: 1px solid var(--nebula-article-border) !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #f6fafc, #fff) !important;
    box-shadow: 0 10px 28px rgba(16, 47, 70, .06) !important;
}

#eckb-article-content-body .nebula-guide-visual img {
    width: 104px !important;
    height: 104px !important;
    border: 0 !important;
    border-radius: 24px !important;
    object-fit: cover !important;
    box-shadow: none !important;
}

#eckb-article-content-body .nebula-guide-visual strong {
    display: block !important;
    margin-bottom: 5px !important;
    color: var(--nebula-article-navy) !important;
    font-size: 18px !important;
}

#eckb-article-content-body .nebula-guide-visual p {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.58 !important;
}

#eckb-article-content-body table {
    width: 100% !important;
    margin: 24px 0 30px !important;
    overflow: hidden !important;
    border: 1px solid var(--nebula-article-border) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 14px !important;
}

#eckb-article-content-body th {
    padding: 13px 15px !important;
    background: var(--nebula-article-navy) !important;
    color: #fff !important;
    font-size: 13px !important;
    text-align: left !important;
}

#eckb-article-content-body td {
    padding: 13px 15px !important;
    border-top: 1px solid var(--nebula-article-border) !important;
    color: #4c6171 !important;
    font-size: 14px !important;
    vertical-align: top !important;
}

@media (max-width: 760px) {
    #eckb-article-content-header-v2 {
        padding: 21px 19px 23px !important;
        border-radius: 16px !important;
    }

    #eckb-article-content .eckb-article-title {
        font-size: 29px !important;
    }

    #eckb-article-content-body > p:first-child {
        font-size: 16px !important;
    }

    #eckb-article-content-body h2,
    #eckb-article-content-body h2.has-large-font-size {
        margin-top: 34px !important;
        font-size: 25px !important;
    }

    #eckb-article-content-body .ib-toc-body ul {
        grid-template-columns: 1fr !important;
    }

    #eckb-article-content-body .nebula-guide-visual {
        grid-template-columns: 72px minmax(0, 1fr) !important;
        gap: 15px !important;
        padding: 17px !important;
    }

    #eckb-article-content-body .nebula-guide-visual img {
        width: 72px !important;
        height: 72px !important;
        border-radius: 18px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #eckb-article-content-body a {
        scroll-behavior: auto !important;
    }
}

#eckb-article-content-body .nebula-related-internal {
    margin: 38px 0 8px !important;
    padding: 22px 24px !important;
    border: 1px solid #dbe7ed !important;
    border-radius: 17px !important;
    background: linear-gradient(135deg, #f3f9fb, #fff) !important;
}

#eckb-article-content-body .nebula-related-internal > strong {
    display: block !important;
    margin-bottom: 10px !important;
    color: var(--nebula-article-navy) !important;
    font-size: 17px !important;
}

#eckb-article-content-body .nebula-related-internal ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#eckb-article-content-body .nebula-related-internal li {
    margin: 0 !important;
    padding: 7px 0 !important;
    border-top: 1px solid #e5edf1 !important;
}

#eckb-article-content-body .nebula-guide-visual p:empty {
    display: none !important;
}