/* ============================================================
   components.css — content blocks for every template (design system overhaul)
   Loads on every page, after layout.css and before the template stylesheet.
   Holds: in-text links, quote, quick facts, table, callouts, formula,
   takeaways, lists, FAQ, related-tool cards, step cards, sources.
   Colors and sizes come only from var(--gpa-*) tokens.

   Selectors start with #page (GeneratePress's page wrapper) so these rules
   win over the older template files that load after this one, without
   each rule needing to know which template it is on. Nothing inside a
   calculator (#root, .gpacalc-mount) is touched.
   ============================================================ */

/* ---------- 1. In-text links ----------
   Plain links in text only; buttons, cards, TOC, breadcrumb, FAQ
   questions, nav and footer keep their own treatment. */
#page .entry-content :is(p, li, td, dd) > a:not([class]):not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .rx-relcard h3 *, .gpa-sources *, .gpa-scale-nav *, .gpa-cta *, .wp-block-button *) {
    color: var(--gpa-link) !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
    text-decoration-color: var(--gpa-link-underline) !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 4px !important;
}
#page .entry-content :is(p, li, td, dd) > a:not([class]):not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .rx-relcard h3 *, .gpa-sources *, .gpa-scale-nav *, .gpa-cta *, .wp-block-button *):hover {
    color: var(--gpa-link) !important;
    text-decoration-color: var(--gpa-primary) !important;
}

/* ---------- 2. Lists ----------
   Bullets: 6px primary dots, 12px from the text, items 10px apart.
   Numbered: 24px tinted circles with the number in the accent color. */
#page .entry-content ul:not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .gpa-takeaways *, .is-style-gpa-takeaways *, .gpa-jumpto-list, .gpa-breadcrumb__list, .blocks-gallery-grid, .wp-block-gallery, .wp-block-social-links, .rank-math-list, nav *) {
    list-style: none !important;
    padding-left: 18px !important;
}
#page .entry-content ul:not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .gpa-takeaways *, .is-style-gpa-takeaways *, .gpa-jumpto-list, .gpa-breadcrumb__list, .blocks-gallery-grid, .wp-block-gallery, .wp-block-social-links, .rank-math-list, nav *) > li {
    position: relative;
    display: list-item;
    list-style: none !important;
    margin-bottom: var(--gpa-li-gap) !important;
}
#page .entry-content ul:not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .gpa-takeaways *, .is-style-gpa-takeaways *, .gpa-jumpto-list, .gpa-breadcrumb__list, .blocks-gallery-grid, .wp-block-gallery, .wp-block-social-links, .rank-math-list, nav *) > li::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: -18px;
    top: calc(0.85em - 3px);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--gpa-primary);
}
#page .entry-content ol:not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .gpa-sources *, nav *) {
    list-style: none !important;
    padding-left: 36px !important;
    counter-reset: gpa-ol;
}
#page .entry-content ol:not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .gpa-sources *, nav *) > li {
    position: relative;
    display: list-item;
    list-style: none !important;
    counter-increment: gpa-ol;
    margin-bottom: var(--gpa-li-gap) !important;
}
#page .entry-content ol:not(#root *, .gpacalc-mount *, .wp-block-rank-math-toc-block *, .gpa-sources *, nav *) > li::before {
    content: counter(gpa-ol) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -36px;
    top: calc(0.85em - 12px);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--gpa-tint-indigo);
    color: var(--gpa-accent);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}
#page .entry-content :is(ul, ol) > li > :is(ul, ol) { margin-top: var(--gpa-li-gap) !important; }

/* ---------- 3. Quote, quick facts and notes ----------
   Blockquotes do three jobs on this site:
   - with an attribution (<cite> or <footer>): a real quote. No box, a large
     quote mark, 21px navy text.
   - with a list: the "quick facts" box the content rules ask for near the
     top of a page. Light blue card.
   - otherwise: a side note. Same look as the Note callout. */
#page .entry-content blockquote:not(#root *, .gpacalc-mount *) {
    position: relative;
    margin: 0 auto var(--gpa-p-gap) !important;
    padding: 16px 18px !important;
    background: var(--gpa-gray-50) !important;
    border: 1px solid var(--gpa-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-style: normal !important;
}
#page .entry-content blockquote:not(#root *, .gpacalc-mount *) > p {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    color: var(--gpa-text) !important;
}
#page .entry-content blockquote:not(#root *, .gpacalc-mount *) > :last-child { margin-bottom: 0 !important; }
/* Quick facts */
#page .entry-content blockquote:has(> :is(ul, ol)):not(#root *, .gpacalc-mount *) {
    padding: 18px 24px !important;
    background: var(--gpa-tint-blue) !important;
    border-color: var(--gpa-blue-100) !important;
}
#page .entry-content blockquote:has(> :is(ul, ol)):not(#root *, .gpacalc-mount *) :is(p, li) {
    font-size: var(--gpa-body-size) !important;
    line-height: var(--gpa-body-line) !important;
}
/* Real quotes */
#page .entry-content blockquote:has(cite, footer):not(#root *, .gpacalc-mount *) {
    padding: 36px 0 0 !important;
    background: none !important;
    border: 0 !important;
    border-radius: 0 !important;
}
#page .entry-content blockquote:has(cite, footer):not(#root *, .gpacalc-mount *)::before {
    content: "\201C";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 56px;
    line-height: 1;
    font-weight: 700;
    color: var(--gpa-calc-border);
}
#page .entry-content blockquote:has(cite, footer):not(#root *, .gpacalc-mount *) > p {
    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    color: var(--gpa-heading) !important;
}
#page .entry-content blockquote:not(#root *, .gpacalc-mount *) :is(cite, footer) {
    display: block;
    margin-top: 8px;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    color: var(--gpa-text-muted) !important;
}

/* ---------- 4. Tables ----------
   White box with a 1px border and 12px corners; grey header row; rows
   divided by 1px lines; numbers line up (tabular). Wide tables scroll
   inside their own box. */
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) {
    background: var(--gpa-surface) !important;
    border: 1px solid var(--gpa-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    margin: 0 auto var(--gpa-hdr-below) !important;
}
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) table {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-collapse: collapse !important;
    background: transparent !important;
    font-variant-numeric: tabular-nums;
}
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) thead {
    background: var(--gpa-gray-50) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--gpa-border) !important;
}
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) th {
    background: var(--gpa-gray-50) !important;
    color: var(--gpa-text-strong) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 11px 18px !important;
    border: 0 !important;
    text-align: center !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *, .gpa-scale-table) td {
    color: var(--gpa-text) !important;
    font-weight: 400 !important;
}
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) td {
    font-size: 16px !important;
    line-height: 1.45 !important;
    padding: 11px 18px !important;
    border: 0 !important;
    border-top: 1px solid var(--gpa-divider) !important;
    text-align: center !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) tbody tr:first-child td { border-top: 0 !important; }
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) tbody tr:hover { background: transparent !important; }
#page .entry-content .rx-table:not(#root *, .rx-scale) :is(th, td):first-child { text-align: left !important; }
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) figcaption {
    margin: 0 !important;
    padding: 10px 18px !important;
    border-top: 1px solid var(--gpa-divider);
    font-size: 13px !important;
    font-style: normal !important;
    color: var(--gpa-text-muted) !important;
    text-align: center;
}
/* Highlighted row: the page's own GPA on scale pages, totals, or .is-highlight */
#page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *) tr:is(.is-highlight, .is-current-gpa) td,
#page .entry-content .rx-table:not(#root *, .rx-scale) tbody tr:last-child td {
    background: var(--gpa-tint-blue) !important;
    color: var(--gpa-heading) !important;
    font-weight: 600 !important;
}
/* GPA scale tables: keep their letter-grade band colors and the "Your GPA" tag */
#page .entry-content .gpa-scale-table tr.is-current-gpa td:first-child::after {
    background: var(--gpa-primary);
    color: var(--gpa-white);
}
@media (max-width: 768px) {
    #page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) :is(th, td) {
        padding: 10px 12px !important;
    }
    #page .entry-content :is(figure.wp-block-table, .rx-table, .content-table):not(#root *, .gpacalc-mount *) td { font-size: 15px !important; }
}

/* ---------- 5. Callouts ----------
   Three kinds only: tip, note, heads-up. Use the block styles on a Group or
   Paragraph block (is-style-gpa-callout-*) or the .gpa-callout--* classes.
   The first heading or bold line is the title. */
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip, .gpa-callout--note, .is-style-gpa-callout-note, .gpa-callout--warn, .is-style-gpa-callout-warn) {
    position: relative;
    padding: 16px 18px 16px 50px !important;
    border-radius: 12px !important;
    border: 1px solid var(--gpa-blue-100);
    background: var(--gpa-tint-blue);
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: var(--gpa-text);
}
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip, .gpa-callout--note, .is-style-gpa-callout-note, .gpa-callout--warn, .is-style-gpa-callout-warn)::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 18px;
    width: 20px;
    height: 20px;
    background: var(--gpa-primary);
    -webkit-mask: var(--gpa-callout-icon) center / contain no-repeat;
    mask: var(--gpa-callout-icon) center / contain no-repeat;
}
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip) {
    --gpa-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5'/%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3C/svg%3E");
}
#page .entry-content :is(.gpa-callout--note, .is-style-gpa-callout-note) {
    --gpa-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
    background: var(--gpa-gray-50);
    border-color: var(--gpa-border);
}
#page .entry-content :is(.gpa-callout--note, .is-style-gpa-callout-note)::before { background: var(--gpa-gray-600); }
#page .entry-content :is(.gpa-callout--warn, .is-style-gpa-callout-warn) {
    --gpa-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
    background: var(--gpa-amber-50);
    border-color: var(--gpa-amber-200);
}
#page .entry-content :is(.gpa-callout--warn, .is-style-gpa-callout-warn)::before { background: var(--gpa-warning); }
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip, .gpa-callout--note, .is-style-gpa-callout-note, .gpa-callout--warn, .is-style-gpa-callout-warn) :is(p, li) {
    font-size: 16px !important;
    line-height: 1.6 !important;
}
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip, .gpa-callout--note, .is-style-gpa-callout-note, .gpa-callout--warn, .is-style-gpa-callout-warn) > :is(h3, h4, .gpa-callout__title):first-child,
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip, .gpa-callout--note, .is-style-gpa-callout-note, .gpa-callout--warn, .is-style-gpa-callout-warn) > p:first-child > strong:first-child {
    display: block;
    margin: 0 0 4px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    color: var(--gpa-heading) !important;
}
#page .entry-content :is(.gpa-callout--note, .is-style-gpa-callout-note) > :is(h3, h4, .gpa-callout__title):first-child,
#page .entry-content :is(.gpa-callout--note, .is-style-gpa-callout-note) > p:first-child > strong:first-child { color: var(--gpa-text-strong) !important; }
#page .entry-content :is(.gpa-callout--warn, .is-style-gpa-callout-warn) > :is(h3, h4, .gpa-callout__title):first-child,
#page .entry-content :is(.gpa-callout--warn, .is-style-gpa-callout-warn) > p:first-child > strong:first-child { color: var(--gpa-amber-800) !important; }
#page .entry-content :is(.gpa-callout--tip, .is-style-gpa-callout-tip, .gpa-callout--note, .is-style-gpa-callout-note, .gpa-callout--warn, .is-style-gpa-callout-warn) > :last-child { margin-bottom: 0 !important; }

/* ---------- 6. Formula / worked example ---------- */
#page .entry-content :is(.content-formula, .content-result, .rx-formula):not(#root *) {
    padding: 20px 22px !important;
    background: var(--gpa-calc-result-bg) !important;
    border: 1px solid var(--gpa-calc-result-line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}
#page .entry-content :is(.content-formula, .rx-formula) :is(.content-formula__label, .rx-formula-label) {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--gpa-accent) !important;
}
#page .entry-content .content-formula > p,
#page .entry-content .rx-formula .rx-pill {
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: var(--gpa-heading) !important;
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
}
#page .entry-content .content-result > p {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: var(--gpa-gray-600) !important;
}
#page .entry-content .content-result :is(.content-result-big, strong) {
    font-size: inherit !important;
    font-weight: 600 !important;
    color: var(--gpa-heading) !important;
}

/* ---------- 7. Key takeaways ---------- */
#page .entry-content :is(.gpa-takeaways, .is-style-gpa-takeaways) {
    padding: 20px 24px !important;
    background: var(--gpa-surface) !important;
    border: 1px solid var(--gpa-border) !important;
    border-radius: 12px !important;
}
#page .entry-content :is(.gpa-takeaways, .is-style-gpa-takeaways) > :is(h2, h3, h4, p):first-child {
    margin: 0 0 10px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    color: var(--gpa-heading) !important;
}
#page .entry-content :is(.gpa-takeaways, .is-style-gpa-takeaways) ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
#page .entry-content :is(.gpa-takeaways, .is-style-gpa-takeaways) li {
    position: relative;
    margin: 0 0 8px !important;
    padding-left: 28px !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
}
#page .entry-content :is(.gpa-takeaways, .is-style-gpa-takeaways) li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 18px;
    height: 18px;
    background: var(--gpa-accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- 8. FAQ (Rank Math FAQ block) ----------
   One white card; each question a row with a divider and a chevron.
   functions.php (gpa_faq_accordion) makes it an accordion with the first
   item open; without JavaScript every answer shows. The FAQ schema and the
   answer HTML are untouched. */
#page .entry-content .rank-math-block:not(#root *) {
    max-width: var(--gpa-text-max);
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
    background: var(--gpa-surface) !important;
    border: 1px solid var(--gpa-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    overflow: hidden;
}
#page .entry-content .rank-math-block .rank-math-list {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}
#page .entry-content .rank-math-block .rank-math-list-item {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    border-top: 1px solid var(--gpa-divider) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
#page .entry-content .rank-math-block .rank-math-list-item:first-child { border-top: 0 !important; }
#page .entry-content .rank-math-block .rank-math-question {
    position: relative;
    display: flex !important;
    align-items: center;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 14px 52px 14px 20px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
    color: var(--gpa-text-strong) !important;
    background: none !important;
    border: 0 !important;
    text-align: left !important;
}
#page .entry-content .rank-math-block .rank-math-question::before { content: none !important; display: none !important; }
#page .entry-content .rank-math-block .rank-math-question::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    background: var(--gpa-accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
    transition: transform .2s ease;
}
#page .entry-content .rank-math-block .rank-math-list-item.is-open .rank-math-question::after { transform: rotate(180deg); }
#page .entry-content .rank-math-block.gpa-faq-ready .rank-math-question { cursor: pointer; }
#page .entry-content .rank-math-block.gpa-faq-ready .rank-math-question:hover { color: var(--gpa-primary) !important; }
#page .entry-content .rank-math-block .rank-math-answer {
    margin: 0 !important;
    padding: 0 20px 18px !important;
    border: 0 !important;
    background: none !important;
}
#page .entry-content .rank-math-block .rank-math-answer,
#page .entry-content .rank-math-block .rank-math-answer :is(p, li) {
    font-size: 17px !important;
    line-height: var(--gpa-body-line) !important;
    color: var(--gpa-text) !important;
}
#page .entry-content .rank-math-block .rank-math-answer p { margin: 0 0 10px !important; padding: 0 !important; }
#page .entry-content .rank-math-block .rank-math-answer > :last-child { margin-bottom: 0 !important; }
#page .entry-content .rank-math-block.gpa-faq-ready .rank-math-list-item:not(.is-open) .rank-math-answer { display: none !important; }

/* Calculator pages' FAQ (details blocks inside .rx-faqwrap): same card */
#page .entry-content .rx-faqwrap {
    max-width: var(--gpa-text-max);
    margin: 0 auto !important;
    background: var(--gpa-surface);
    border: 1px solid var(--gpa-border);
    border-radius: 12px;
    overflow: hidden;
}
#page .entry-content .rx-faqwrap .rx-faq {
    margin: 0 !important;
    border: 0 !important;
    border-top: 1px solid var(--gpa-divider) !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}
#page .entry-content .rx-faqwrap .rx-faq:first-child { border-top: 0 !important; }
#page .entry-content .rx-faqwrap .rx-faq summary {
    display: flex;
    align-items: center;
    min-height: 56px;
    padding: 14px 52px 14px 20px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: var(--gpa-text-strong) !important;
    background: none !important;
}
#page .entry-content .rx-faqwrap .rx-faq summary:hover { color: var(--gpa-primary) !important; }
#page .entry-content .rx-faqwrap .rx-faq summary::before { content: none !important; display: none !important; }
#page .entry-content .rx-faqwrap .rx-faq summary::after {
    right: 20px;
    top: 50%;
    margin-top: -9px;
    background: var(--gpa-accent) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
}
#page .entry-content .rx-faqwrap .rx-faq > :not(summary) {
    padding: 0 20px 18px !important;
    font-size: 17px !important;
    line-height: var(--gpa-body-line) !important;
    color: var(--gpa-text) !important;
}

/* ---------- 9. Related tools and step cards ----------
   White cards, 1px border, 12px corners, a 40px tinted icon square with
   the card's icon in the accent color (the icon comes from the card's
   rx-i-* class as --rx-ico). */
#page .entry-content :is(.rx-relcard, .rx-step) {
    position: relative;
    padding: 20px !important;
    background: var(--gpa-surface) !important;
    border: 1px solid var(--gpa-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}
#page .entry-content :is(.rx-relcard, .rx-step):hover { box-shadow: none !important; }
#page .entry-content .rx-relcard > h3 {
    position: relative;
    display: flex !important;
    align-items: center;
    gap: 12px;
    min-height: 40px;
    margin: 0 0 6px !important;
    padding: 0 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: var(--gpa-heading) !important;
}
#page .entry-content .rx-relcard > h3::before,
#page .entry-content .rx-step::before {
    content: "" !important;
    display: block !important;
    position: static;
    flex: none;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--gpa-tint-indigo) !important;
    box-shadow: none !important;
}
#page .entry-content .rx-relcard > h3::after,
#page .entry-content .rx-step::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 10px;
    top: 10px;
    width: 20px;
    height: 20px;
    background: var(--gpa-accent) !important;
    -webkit-mask: var(--rx-ico) center / contain no-repeat;
    mask: var(--rx-ico) center / contain no-repeat;
}
#page .entry-content .rx-relcard > h3::after { top: 50%; margin-top: -10px; }
#page .entry-content .rx-step::after { left: 30px; top: 30px; }
#page .entry-content .rx-step::before { margin-bottom: 14px; }
#page .entry-content .rx-step { padding-top: 20px !important; }
#page .entry-content .rx-relcard .rx-relsub {
    margin: 0 0 12px !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: var(--gpa-gray-600) !important;
}
#page .entry-content .rx-relcard .rx-rellist > li { font-size: 16px !important; }
#page .entry-content .rx-relcard .rx-rellist > li > a {
    color: var(--gpa-link) !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
    text-decoration-color: var(--gpa-link-underline) !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 4px !important;
}
#page .entry-content .rx-relcard .rx-rellist > li > a:hover { text-decoration-color: var(--gpa-primary) !important; }
#page .entry-content .rx-relcard mark {
    background: var(--gpa-tint-indigo) !important;
    color: var(--gpa-accent) !important;
}

/* ---------- 10. Sources (block pattern "Sources", gpa-block-patterns.php) ---------- */
#page .entry-content .gpa-sources {
    max-width: var(--gpa-text-max);
    margin: var(--gpa-hdr-above) auto 0 !important;
    padding: 24px 0 0 !important;
    border-top: 1px solid var(--gpa-border);
}
#page .entry-content .gpa-sources > :is(h2, h3, p.gpa-sources__title):first-child {
    margin: 0 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
    color: var(--gpa-text-strong) !important;
    text-align: left !important;
}
#page .entry-content .gpa-sources .gpa-sources__meta {
    margin: 4px 0 16px !important;
    font-size: 14px !important;
    color: var(--gpa-text-muted) !important;
}
#page .entry-content .gpa-sources ol {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    counter-reset: gpa-src;
}
#page .entry-content .gpa-sources ol > li {
    position: relative;
    counter-increment: gpa-src;
    margin: 0 0 14px !important;
    padding-left: 36px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: var(--gpa-text-muted) !important;
}
#page .entry-content .gpa-sources ol > li::before {
    content: counter(gpa-src);
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--gpa-tint-blue);
    color: var(--gpa-primary-hover);
    font-size: 12px;
    font-weight: 600;
}
#page .entry-content .gpa-sources ol > li > a {
    display: block;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: var(--gpa-text-strong) !important;
    text-decoration: none !important;
}
#page .entry-content .gpa-sources ol > li > a:hover { color: var(--gpa-primary) !important; }
/* One-line rows (name + service tag) center their dot */
#page .entry-content .rx-relcard .rx-rellist > li::before { top: 50%; margin-top: -3px; }