/* Semantic compatibility, not a new visual theme. All existing colours, cards,
 * responsive layout, fonts, spacing and imagery remain in knowledge/layout.html.
 */
.eq-guides-page .content-container > article,
.eq-guides-page .content-container > aside { min-width: 0; }

/* Section headings were h3s. Preserve their exact typography after promotion. */
.eq-guides-page .guide-article h2.guide-section-title {
    font-size: clamp(1.58rem, 2.55vw, 2.15rem);
}
.eq-guides-page .guide-article h2.guide-section-title::before {
    content: "";
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--eq-blue), var(--eq-sky));
    box-shadow: 0 0 0 6px rgba(0, 203, 239, 0.12);
    vertical-align: 0.08em;
}

/* Promoted p.job-title descendants must not inherit browser h3/h4 font weights. */
.eq-guides-page .guide-article h3.job-title:not(.link-text):not(.boldened),
.eq-guides-page .guide-article h3.title-texting:not(.link-text):not(.boldened),
.eq-guides-page .guide-article h3.larger:not(.link-text):not(.boldened),
.eq-guides-page .guide-article h4.less-large:not(.link-text):not(.boldened) { font-weight: 400; }

.eq-guides-page a.courses-sidebar { text-decoration: none; }
@media (max-width: 768px) {
    .eq-guides-page .guide-article h2.guide-section-title { font-size: 1.45rem !important; }
}

/* Conversion components reuse existing EverythingQuant cards, links and colours.
   They are not fixed overlays and never hide article text or lock the page. */
#eqx-quantdrop-popup { display: none !important; }
.eq-guides-page .guide-next-action { margin-top: 2.5rem; }
.eq-guides-page .guide-next-action h2,
.eq-guides-page .guide-next-action h3,
.eq-guides-page .guide-secondary-resources h2 { font-size: 1.2rem; line-height: 1.45; }
.eq-guides-page .guide-access-label { font-size: .85rem; font-weight: 700; margin: .65rem 0 .3rem; }
.eq-guides-page .guide-access-note { font-size: .9rem; line-height: 1.65; margin: .3rem 0 .9rem; }
.eq-guides-page .guide-secondary-item + .guide-secondary-item { margin-top: 1.3rem; padding-top: 1.3rem; border-top: 1px solid var(--eq-border, rgba(128,128,128,.25)); }
.eq-guides-page .guide-secondary-item h3 { font-size: 1rem; line-height: 1.5; margin: 0; }
.eq-guides-page .guide-next-action .take-me-there { white-space: normal; text-align: center; }
.eq-guides-page .guide-premium-continuation { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--eq-border, rgba(128,128,128,.25)); }
.eq-guides-page .guide-premium-continuation h2 { font-size: 1.15rem; line-height: 1.5; }
.eq-guides-page .guide-pricing-link { margin-top: 2rem; font-size: .85rem; }
.eq-guides-page [data-guide-action]:focus-visible { outline: 2px solid var(--eq-blue); outline-offset: 4px; }
.eq-guides-page .guide-handoff { margin: 2rem auto; max-width: 50rem; }

/* Editorial content only: retain existing fonts, colours and article shell. */
.eq-guides-page .guide-review-line,
.eq-guides-page .guide-breadcrumbs { font-size: .85rem; line-height: 1.6; margin-bottom: 1rem; }
.eq-guides-page .guide-evidence-note { font-size: .9rem; line-height: 1.7; }
.eq-guides-page .guide-inline-action { margin: 1.5rem 0 2rem; padding-left: 1rem; border-left: 3px solid var(--eq-blue); }
.eq-guides-page .guide-inline-action > p { margin-top: .35rem; margin-bottom: .35rem; }
.eq-guides-page .guide-worked-example { margin: 1.5rem 0; padding: 1.2rem; border: 1px solid var(--eq-border, rgba(128,128,128,.25)); border-radius: 10px; }
.eq-guides-page .guide-article .guide-equation { font-family: inherit; font-size: 1rem; overflow-wrap: anywhere; }
.eq-guides-page .guide-paths { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin: 1.25rem 0 2rem; }
.eq-guides-page .guide-article .guide-compat-anchor { display: block; scroll-margin-top: 150px; }
.eq-guides-page .guide-article h2, .eq-guides-page .guide-article h3 { scroll-margin-top: 150px; }
.eq-guides-page .guide-article a { overflow-wrap: anywhere; }

/* These three articles place recommendations at the relevant stage rather than
   duplicating them in a sidebar. Keep the same article width and visual style. */
@media (min-width: 1281px) {
    .eq-guides-page .content-container.guide-editorial-layout {
        grid-template-columns: minmax(210px, 260px) minmax(0, 770px);
        max-width: 1054px;
    }
}

.eq-guides-page .guide-mobile-toc { display: none; margin: 1rem 0 1.5rem; }
.eq-guides-page .guide-mobile-toc summary { cursor: pointer; font-weight: 600; }
.eq-guides-page .guide-mobile-toc nav { margin-top: .8rem; }
.eq-guides-page .guide-mobile-toc li { margin-bottom: .45rem; }
@media (max-width: 1280px) {
    .eq-guides-page .content-container.guide-editorial-layout {
        grid-template-columns: minmax(0, 820px);
        justify-content: center;
    }
    .eq-guides-page .guide-editorial-layout > .guide-navigation-column { display: none; }
    .eq-guides-page .guide-mobile-toc { display: block; }
}

/* Longer, descriptive titles remain readable on phones without replacing the
   existing EverythingQuant typeface, weight, accents or article card. */
.eq-guides-page .guide-editorial-layout .blog-title {
    font-size: clamp(2rem, 3.5vw, 3rem);
    line-height: 1.12;
}
.eq-guides-page .guide-editorial-layout .guide-article h3.job-title {
    font-size: 1.2rem !important;
    line-height: 1.4;
}
.eq-guides-page .guide-editorial-layout .guide-article h3.job-title::before { content: none; }

/* QA compatibility fixes. Scoped to guide assets; knowledge courses unchanged.
   JSON metadata is a sibling before the navigation column, so do not depend on
   :first-child. Let the sticky nav span the article's grid row, and let the page
   scroll rather than creating a hidden ancestor scroll container. */
.eq-guides-page { overflow: clip; }
.eq-guides-page .guide-navigation-column { align-self: stretch; min-width: 0; }
.eq-guides-page .guide-navigation-column .sidebar {
    max-height: calc(100vh - 120px);
    max-height: calc(100dvh - 120px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
@media (max-width: 1280px) {
    .eq-guides-page .content-container > .guide-navigation-column { display: none; }
}


/* Sidebar QA: contain navigation within its grid column and give it explicit
   light-surface text colours instead of inheriting the site's dark nav links.
   Course pages do not load this stylesheet. */
.eq-guides-page .guide-navigation-column #sidebar.sidebar {
    position: sticky;
    top: 120px;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 16px;
    box-sizing: border-box;
    transform: none;
    z-index: auto;
    border: 1px solid rgba(26, 96, 171, .14);
    border-radius: 14px;
    background: #ffffff;
    color: #334155;
    text-align: left;
    scrollbar-width: thin;
}
.eq-guides-page .guide-navigation-column #sidebar .guide-toc-heading {
    margin: 0 0 10px;
    color: #0f172a;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.5;
}
.eq-guides-page .guide-navigation-column #sidebar ul {
    display: grid;
    gap: 3px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.eq-guides-page .guide-navigation-column #sidebar li { margin: 0; padding: 0; }
.eq-guides-page .guide-navigation-column #sidebar a {
    display: block;
    width: auto;
    margin: 0;
    padding: 8px 10px;
    border-left: 3px solid transparent;
    border-radius: 6px;
    color: #475569;
    font-size: .85rem;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
    white-space: normal;
    overflow-wrap: anywhere;
}
.eq-guides-page .guide-navigation-column #sidebar a:hover,
.eq-guides-page .guide-navigation-column #sidebar a.active,
.eq-guides-page .guide-navigation-column #sidebar a[aria-current="location"] {
    color: #154d89;
    background: #edf4fb;
    border-left-color: #1a60ab;
}
.eq-guides-page .guide-navigation-column #sidebar a:focus-visible,
.eq-guides-page .guide-mobile-toc a:focus-visible {
    outline: 2px solid #1a60ab;
    outline-offset: 2px;
}
.eq-guides-page .guide-secondary-resources {
    color: #334155;
    background: #ffffff;
}
.eq-guides-page .guide-secondary-resources .top-courses,
.eq-guides-page .guide-secondary-resources .course-desc { color: #0f172a; }
.eq-guides-page .guide-secondary-resources .guide-access-label { color: #154d89; }
.eq-guides-page .guide-secondary-resources .guide-access-note { color: #475569; }
.eq-guides-page .guide-mobile-toc { color: #334155; }
.eq-guides-page .guide-mobile-toc a { color: #154d89; }