/* PREPON Blog Importer v1.4.2 — reusable editorial component system
 * Core stylesheet only. No article/import-ID-specific selectors are permitted here.
 */


:root {
    --prepon-yellow: #FCC509;
    --prepon-ink: #263746;
    --prepon-heading: #111827;
    --prepon-muted: #596775;
    --prepon-border: rgba(17, 24, 39, 0.18);
    --prepon-table-rule: #111827;
    --prepon-soft: rgba(252, 197, 9, 0.10);
}

/* White editorial canvas for imported PREPON posts. */
body.prepon-imported-post {
    background: #fff;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* -------------------------------------------------------------------------
   LOCKED TYPOGRAPHY
   H2 = Poppins 700 / 20px
   H3 = Poppins 700 / 17px
   H4 = Poppins 700 / 14px
   H5/H6 = Poppins 700 / 11px
   Body = Inter 400 / 14px
   ------------------------------------------------------------------------- */
body.prepon-imported-post .elementor-widget-theme-post-content .elementor-widget-container,
body.prepon-imported-post .entry-content,
.editor-styles-wrapper {
    font-family: Inter, Arial, sans-serif !important;
    color: var(--prepon-ink);
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
    text-align: left;
}

body.prepon-imported-post .elementor-widget-theme-post-content p,
body.prepon-imported-post .elementor-widget-theme-post-content li,
body.prepon-imported-post .entry-content p,
body.prepon-imported-post .entry-content li,
.editor-styles-wrapper p,
.editor-styles-wrapper li {
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content p,
body.prepon-imported-post .entry-content p,
.editor-styles-wrapper p {
    margin-top: 0 !important;
    margin-bottom: 16px !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content h2,
body.prepon-imported-post .entry-content h2,
.editor-styles-wrapper h2 {
    margin: 30px 0 20px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 20px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    color: var(--prepon-heading) !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content h3,
body.prepon-imported-post .entry-content h3,
.editor-styles-wrapper h3 {
    margin: 30px 0 20px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    color: var(--prepon-heading) !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content h4,
body.prepon-imported-post .entry-content h4,
.editor-styles-wrapper h4 {
    margin: 30px 0 20px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    color: var(--prepon-heading) !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content h5,
body.prepon-imported-post .elementor-widget-theme-post-content h6,
body.prepon-imported-post .entry-content h5,
body.prepon-imported-post .entry-content h6,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
    margin: 30px 0 20px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    color: var(--prepon-heading) !important;
}

/* RC5 typography hardening: stable wrapping, list/index geometry and emphasis. */
body.prepon-imported-post .elementor-widget-theme-post-content :is(h2,h3,h4,h5,h6),
body.prepon-imported-post .entry-content :is(h2,h3,h4,h5,h6),
.editor-styles-wrapper :is(h2,h3,h4,h5,h6),
.prepon-blog-card__title,
.prepon-blog-flowchart__title,
.prepon-callout-title,
.prepon-image-text__title {
    text-wrap: balance;
    overflow-wrap: break-word;
    word-break: normal;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(p,li),
body.prepon-imported-post .entry-content :is(p,li),
.editor-styles-wrapper :is(p,li),
.prepon-blog-card__body,
.prepon-blog-flowchart__text,
.prepon-callout-body,
.prepon-image-text__body {
    overflow-wrap: break-word;
    word-break: normal;
    text-wrap: pretty;
    hyphens: none;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(ul,ol),
body.prepon-imported-post .entry-content :is(ul,ol),
.editor-styles-wrapper :is(ul,ol),
.prepon-blog-card__body :is(ul,ol),
.prepon-blog-flowchart__text :is(ul,ol),
.prepon-callout-body :is(ul,ol),
.prepon-image-text__body :is(ul,ol) {
    box-sizing: border-box;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    padding-inline-start: 1.5rem !important;
    list-style-position: outside !important;
    text-align: left !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(ul,ol) :is(ul,ol),
body.prepon-imported-post .entry-content :is(ul,ol) :is(ul,ol),
.editor-styles-wrapper :is(ul,ol) :is(ul,ol),
.prepon-blog-card__body :is(ul,ol) :is(ul,ol),
.prepon-blog-flowchart__text :is(ul,ol) :is(ul,ol) {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    padding-inline-start: 1.25rem !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(ul,ol) > li,
body.prepon-imported-post .entry-content :is(ul,ol) > li,
.editor-styles-wrapper :is(ul,ol) > li,
.prepon-blog-card__body :is(ul,ol) > li,
.prepon-blog-flowchart__text :is(ul,ol) > li,
.prepon-callout-body :is(ul,ol) > li,
.prepon-image-text__body :is(ul,ol) > li {
    margin: 0 0 6px !important;
    padding-left: 0.1rem !important;
    text-align: left !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(ul,ol) > li:last-child,
body.prepon-imported-post .entry-content :is(ul,ol) > li:last-child,
.editor-styles-wrapper :is(ul,ol) > li:last-child,
.prepon-blog-card__body :is(ul,ol) > li:last-child,
.prepon-blog-flowchart__text :is(ul,ol) > li:last-child,
.prepon-callout-body :is(ul,ol) > li:last-child,
.prepon-image-text__body :is(ul,ol) > li:last-child {
    margin-bottom: 0 !important;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(ul,ol) > li::marker,
body.prepon-imported-post .entry-content :is(ul,ol) > li::marker,
.editor-styles-wrapper :is(ul,ol) > li::marker,
.prepon-blog-card__body :is(ul,ol) > li::marker,
.prepon-blog-flowchart__text :is(ul,ol) > li::marker {
    color: var(--prepon-heading);
    font-weight: 600;
}

body.prepon-imported-post .elementor-widget-theme-post-content :is(strong,b),
body.prepon-imported-post .entry-content :is(strong,b),
.editor-styles-wrapper :is(strong,b),
.prepon-blog-card__body :is(strong,b),
.prepon-blog-flowchart__text :is(strong,b),
.prepon-callout-body :is(strong,b) {
    font-weight: 700;
}

/* Keep 30px before a heading even after body copy/components. */
body.prepon-imported-post .elementor-widget-theme-post-content p + :is(h2,h3,h4,h5,h6),
body.prepon-imported-post .entry-content p + :is(h2,h3,h4,h5,h6),
.editor-styles-wrapper p + :is(h2,h3,h4,h5,h6) {
    margin-top: 30px !important;
}

/* PREPON editorial link treatment. */
body.prepon-imported-post .elementor-widget-theme-post-content a:not(.wp-block-button__link),
body.prepon-imported-post .entry-content a:not(.wp-block-button__link),
.editor-styles-wrapper a:not(.wp-block-button__link) {
    color: var(--prepon-ink) !important;
    text-decoration-line: underline;
    text-decoration-color: var(--prepon-yellow) !important;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    font-weight: 500;
}
body.prepon-imported-post .elementor-widget-theme-post-content a:not(.wp-block-button__link):hover,
body.prepon-imported-post .entry-content a:not(.wp-block-button__link):hover,
.editor-styles-wrapper a:not(.wp-block-button__link):hover {
    color: #111 !important;
    background: var(--prepon-yellow);
    text-decoration-color: #111 !important;
}

/* -------------------------------------------------------------------------
   TABLES — narrower than desktop/tablet content, internally indented,
   and horizontally scrollable inside the visible border on mobile/overflow.
   ------------------------------------------------------------------------- */
.prepon-responsive-table {
    box-sizing: border-box;
    width: min(88%, 980px) !important;
    max-width: calc(100% - 40px) !important;
    margin: 24px auto 30px !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border: 1px solid var(--prepon-border);
    border-radius: 10px;
    background: #fff;
}

.prepon-responsive-table table {
    width: 100% !important;
    min-width: 640px;
    margin: 0 auto !important;
    border: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
}

/* Neutralise theme/Gutenberg rules that can create a thick header divider. */
.prepon-responsive-table thead,
.prepon-responsive-table thead tr,
.prepon-responsive-table tbody,
.prepon-responsive-table tbody tr {
    border: 0 !important;
    outline: 0 !important;
}

.prepon-responsive-table th,
.prepon-responsive-table td {
    box-sizing: border-box;
    vertical-align: top;
    text-align: left !important;
    padding: 11px 18px !important;
    border: 0 !important;
    border-right: 1px solid var(--prepon-border) !important;
    border-bottom: 1px solid var(--prepon-border) !important;
}
.prepon-responsive-table tr > :last-child { border-right: 0 !important; }

/* Header separator: exactly one black 1px rule, never a thick theme rule. */
.prepon-responsive-table thead th {
    border-bottom: 1px solid var(--prepon-table-rule) !important;
}

/* Keep a visible bottom rule under the final data row, including when a caption follows. */
.prepon-responsive-table tbody tr:last-child > * {
    border-bottom: 1px solid var(--prepon-border) !important;
}

.prepon-responsive-table th {
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    color: var(--prepon-heading) !important;
    background: var(--prepon-soft);
}
.prepon-responsive-table td {
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    color: var(--prepon-ink) !important;
}
.prepon-responsive-table figcaption {
    margin: 0;
    padding: 8px 18px 10px;
    border-top: 0;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    color: var(--prepon-muted);
}
.prepon-table-compact th,
.prepon-table-compact td { padding: 8px 14px !important; }

/* -------------------------------------------------------------------------
   FLOWCHART — up to four cards stay on one desktop row. Five or more cards
   are automatically split across exactly two desktop rows. Tablet/mobile use
   their governed responsive layouts. If a desktop row cannot fit, the
   component scrolls horizontally rather than crushing cards.
   ------------------------------------------------------------------------- */
.prepon-blog-flowchart {
    box-sizing: border-box;
    width: min(96%, 1280px);
    max-width: 100%;
    margin: 24px auto 30px;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    font-family: Inter, Arial, sans-serif !important;
}
.prepon-blog-flowchart__list {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: center;
    gap: 14px;
    width: max-content;
    min-width: max-content;
    margin: 0 auto !important;
    padding: 4px 2px 8px !important;
}
.prepon-blog-flowchart__step {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex: 0 0 160px;
    width: 160px;
    min-width: 160px;
    max-width: 160px;
    flex-direction: column;
    align-items: stretch;
    padding: 16px 14px 18px;
    border: 1px solid var(--prepon-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(17,24,39,0.045);
}
.prepon-blog-flowchart__step:not(:last-child)::after {
    content: "→";
    position: absolute;
    right: -13px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: var(--prepon-yellow);
    color: #111827;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}
.prepon-blog-flowchart__number {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    margin: 0 auto 14px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--prepon-yellow);
    color: #111827;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
}
.prepon-blog-flowchart__content {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    gap: 20px; /* heading to text */
}
.prepon-blog-flowchart__title {
    display: block;
    margin: 0;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    color: var(--prepon-heading) !important;
    text-align: center;
}
.prepon-blog-flowchart__text {
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    color: var(--prepon-ink) !important;
    text-align: left;
}

/* -------------------------------------------------------------------------
   CARD GRID
   ------------------------------------------------------------------------- */
.prepon-blog-card-grid {
    display: grid;
    gap: 16px;
    margin: 24px 0 30px;
    font-family: Inter, Arial, sans-serif !important;
}
.prepon-blog-card-grid--cols-1 { grid-template-columns: minmax(0,1fr); }
.prepon-blog-card-grid--cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.prepon-blog-card-grid--cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.prepon-blog-card-grid--cols-4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
.prepon-blog-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--prepon-border);
    border-radius: 12px;
    background: #fff;
}
.prepon-blog-card__eyebrow,
.prepon-image-text__eyebrow {
    display: inline-block;
    margin-bottom: 20px;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--prepon-yellow);
    color: #111827;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}
.prepon-blog-card__title,
.prepon-image-text__title,
.prepon-direct-answer__title {
    margin: 0 0 20px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    color: var(--prepon-heading) !important;
}
.prepon-blog-card__body,
.prepon-image-text__body,
.prepon-direct-answer__body {
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
    color: var(--prepon-ink) !important;
}
.prepon-blog-card__body > :first-child,
.prepon-image-text__body > :first-child { margin-top: 0 !important; }
.prepon-blog-card__body > :last-child,
.prepon-image-text__body > :last-child { margin-bottom: 0 !important; }

/* -------------------------------------------------------------------------
   CALLOUT / DIRECT ANSWER
   ------------------------------------------------------------------------- */
.prepon-blog-callout {
    margin: 24px 0 30px;
    padding: 18px 20px;
    border: 1px solid rgba(252,197,9,0.38);
    border-left: 4px solid var(--prepon-yellow);
    border-radius: 10px;
    background: var(--prepon-soft);
    font-family: Inter, Arial, sans-serif !important;
}
.prepon-callout-title {
    margin: 0 0 20px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    color: var(--prepon-heading) !important;
}
.prepon-callout-body {
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
    color: var(--prepon-ink) !important;
}

/* -------------------------------------------------------------------------
   STANDALONE INFOGRAPHICS
   ------------------------------------------------------------------------- */
figure.prepon-blog-image {
    float: none !important;
    clear: both;
    margin: 24px auto 30px !important;
}
figure.prepon-blog-image--contained { width: min(78%,820px) !important; }
figure.prepon-blog-image--compact { width: min(62%,620px) !important; }
figure.prepon-blog-image--wide { width: min(92%,1040px) !important; }
figure.prepon-blog-image--full { width: 100% !important; max-width: none !important; }
figure.prepon-blog-image img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto;
    border-radius: 10px;
}
figure.prepon-blog-image figcaption {
    margin: 9px auto 0;
    max-width: 92%;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    color: var(--prepon-muted);
    text-align: center;
}

/* -------------------------------------------------------------------------
   EDITORIAL IMAGE + TEXT — desktop/tablet 65% text + 35% image.
   image-right = text 65 / image 35. image-left = image 35 / text 65.
   ------------------------------------------------------------------------- */
.prepon-image-text {
    display: grid;
    grid-template-columns: minmax(0,35fr) minmax(0,65fr);
    grid-template-areas: "media copy";
    gap: 28px;
    align-items: center;
    margin: 20px 0 30px;
    padding: 0;
    border: 0;
    background: #fff;
    box-shadow: none;
}
.prepon-image-text--image-right {
    grid-template-columns: minmax(0,65fr) minmax(0,35fr);
    grid-template-areas: "copy media";
}
.prepon-image-text__media {
    grid-area: media;
    margin: 0 !important;
    min-width: 0;
}
.prepon-image-text__media img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain;
    border-radius: 10px;
}
.prepon-image-text__media figcaption {
    margin-top: 7px;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    color: var(--prepon-muted);
}
.prepon-image-text__copy {
    grid-area: copy;
    min-width: 0;
    align-self: center;
}

/* Buttons */
body.prepon-imported-post .elementor-widget-theme-post-content .wp-block-button__link,
body.prepon-imported-post .entry-content .wp-block-button__link,
.editor-styles-wrapper .wp-block-button__link {
    background: var(--prepon-yellow) !important;
    color: #111827 !important;
    border-radius: 8px;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    text-align: center !important;
    text-decoration: none !important;
}

/* -------------------------------------------------------------------------
   AUTHOR BOX
   ------------------------------------------------------------------------- */

/* Elementor author box on imported PREPON posts */
.elementor-author-box__name,
.elementor-author-box__name a {
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
}
.elementor-author-box__bio {
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
}

/* -------------------------------------------------------------------------
   SEMANTIC CARD VARIANTS
   ------------------------------------------------------------------------- */

/* Number badge emitted when card.number is present in a manifest. */
.prepon-blog-card__number {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin: 0 0 12px;
    border-radius: 999px;
    background: var(--prepon-yellow);
    color: #111827;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 12px rgba(252,197,9,0.20);
}

/* Reusable enhanced card-grid variants. */
.prepon-blog-card-grid[class*="prepon-card-grid-"] {
    gap: 18px;
    align-items: stretch;
}
.prepon-blog-card-grid[class*="prepon-card-grid-"] .prepon-blog-card {
    position: relative;
    display: flex;
    min-height: 0;
    height: auto;
    flex-direction: column;
    padding: 18px 18px 20px;
    border: 1px solid rgba(17,24,39,0.14);
    border-top: 4px solid var(--prepon-yellow);
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(252,197,9,0.075) 0, rgba(252,197,9,0.025) 58px, #fff 58px);
    box-shadow: 0 7px 22px rgba(17,24,39,0.055);
}
.prepon-blog-card-grid[class*="prepon-card-grid-"] .prepon-blog-card__title {
    margin-bottom: 12px !important;
}
.prepon-blog-card-grid[class*="prepon-card-grid-"] .prepon-blog-card__body {
    line-height: 1.52 !important;
}
.prepon-card-grid-personas .prepon-blog-card__title,
.prepon-card-grid-time .prepon-blog-card__title,
.prepon-card-grid-options .prepon-blog-card__title {
    font-size: 15px !important;
    line-height: 1.4 !important;
}
.prepon-card-grid-errors .prepon-blog-card,
.prepon-card-grid-mistakes .prepon-blog-card {
    background: #fff;
}
.prepon-card-grid-errors .prepon-blog-card__number,
.prepon-card-grid-mistakes .prepon-blog-card__number {
    margin-bottom: 10px;
}

/* Shared upgraded flowchart card treatment for explicitly styled flows. */
.prepon-blog-flowchart[class*="prepon-flowchart-"] {
    overflow: visible;
}
.prepon-blog-flowchart[class*="prepon-flowchart-"] .prepon-blog-flowchart__step {
    border: 1px solid rgba(17,24,39,0.14);
    border-top: 4px solid var(--prepon-yellow);
    background: linear-gradient(180deg, rgba(252,197,9,0.07), #fff 62px);
    box-shadow: 0 7px 22px rgba(17,24,39,0.055);
}
.prepon-blog-flowchart[class*="prepon-flowchart-"] .prepon-blog-flowchart__title {
    line-height: 1.35 !important;
}
.prepon-blog-flowchart[class*="prepon-flowchart-"] .prepon-blog-flowchart__text {
    line-height: 1.48 !important;
    text-align: center;
}

/* Main diagnose-to-retest framework. */
.prepon-flowchart-framework .prepon-blog-flowchart__step {
    flex-basis: 150px;
    width: 150px;
    min-width: 150px;
    max-width: 150px;
}

.prepon-flowchart-roadmap .prepon-blog-flowchart__list {
    gap: 16px;
}

.prepon-flowchart-roadmap .prepon-blog-flowchart__number {
    width: 40px;
    height: 40px;
    box-shadow: 0 5px 16px rgba(252,197,9,0.24);
}

/* Compact 3–4 stage progressions. */

.prepon-flowchart-compact .prepon-blog-flowchart__step {
    flex: 0 0 220px;
    width: 220px;
    min-width: 220px;
    max-width: 220px;
}

/* -------------------------------------------------------------------------
   ROADMAP FLOWCHART — self-contained rich phase cards
   ------------------------------------------------------------------------- */

.prepon-flowchart-roadmap .prepon-blog-flowchart__step {
    flex: 0 0 232px;
    width: 232px;
    min-width: 232px;
    max-width: 232px;
    padding: 18px 18px 20px;
}
.prepon-flowchart-roadmap .prepon-blog-flowchart__content {
    gap: 10px;
}
.prepon-flowchart-roadmap .prepon-blog-flowchart__text {
    text-align: left !important;
    line-height: 1.45 !important;
}
.prepon-flowchart-roadmap .prepon-blog-flowchart__text > strong {
    display: block;
    margin: 0 0 10px;
    color: var(--prepon-heading);
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    text-align: center;
}
.prepon-flowchart-roadmap .prepon-blog-flowchart__text ul {
    margin: 0 !important;
    padding-left: 18px !important;
}
.prepon-flowchart-roadmap .prepon-blog-flowchart__text li {
    margin: 0 0 5px !important;
    padding: 0 !important;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.42 !important;
    text-align: left !important;
}
.prepon-flowchart-roadmap .prepon-blog-flowchart__text li:last-child {
    margin-bottom: 0 !important;
}

/* -------------------------------------------------------------------------
   CIRCULAR ANALYSIS LOOP — exactly six steps on desktop.
   Tablet/mobile fall back to an ordered grid.
   ------------------------------------------------------------------------- */
.prepon-flowchart-loop {
    position: relative;
    width: min(100%, 820px);
    min-height: 610px;
    margin: 28px auto 34px;
    padding: 10px 0;
    overflow: visible;
}
.prepon-flowchart-loop .prepon-blog-flowchart__list {
    position: relative;
    display: block;
    width: 100%;
    max-width: 820px;
    height: 590px;
    min-width: 0;
    margin: 0 auto !important;
    padding: 0 !important;
}
.prepon-flowchart-loop .prepon-blog-flowchart__list::before {
    content: attr(data-label);
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    display: grid;
    place-items: center;
    width: 170px;
    height: 170px;
    padding: 18px;
    transform: translate(-50%, -50%);
    border: 6px solid rgba(252,197,9,0.32);
    border-radius: 999px;
    background: #111827;
    color: #fff;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 700;
    text-align: center;
    box-shadow: 0 12px 34px rgba(17,24,39,0.14);
}
.prepon-flowchart-loop .prepon-blog-flowchart__step {
    position: absolute;
    z-index: 2;
    flex: none;
    width: 182px;
    min-width: 182px;
    max-width: 182px;
    min-height: 142px;
    padding: 14px 15px 16px;
}
.prepon-flowchart-loop .prepon-blog-flowchart__number {
    width: 30px;
    height: 30px;
    margin-bottom: 9px;
}
.prepon-flowchart-loop .prepon-blog-flowchart__step::after {
    display: grid !important;
    place-items: center;
    width: 26px !important;
    height: 26px !important;
    border-radius: 999px;
    background: var(--prepon-yellow) !important;
    color: #111827 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(1) { left: 50%; top: 0; transform: translateX(-50%); }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(2) { right: 8px; top: 82px; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(3) { right: 8px; bottom: 82px; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(4) { left: 50%; bottom: 0; transform: translateX(-50%); }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(5) { left: 8px; bottom: 82px; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(6) { left: 8px; top: 82px; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(1)::after { content: "↘"; right: -22px; top: 63%; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(2)::after { content: "↓"; right: 50%; top: auto; bottom: -24px; transform: translateX(50%); }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(3)::after { content: "↙"; right: auto; left: -22px; top: 63%; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(4)::after { content: "↖"; right: auto; left: -22px; top: 15%; }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(5)::after { content: "↑"; right: 50%; top: -24px; transform: translateX(50%); }
.prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(6)::after { content: "↗"; right: -22px; top: 15%; }


/* -------------------------------------------------------------------------
   DECISION FLOW
   ------------------------------------------------------------------------- */

.prepon-flowchart-decision {
    width: min(100%, 860px);
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
}
.prepon-flowchart-decision .prepon-blog-flowchart__list {
    display: grid;
    grid-template-columns: 1fr;
    width: min(100%, 760px);
    min-width: 0;
    gap: 20px;
    margin: 0 auto !important;
    padding: 4px 0 8px !important;
}
.prepon-flowchart-decision .prepon-blog-flowchart__step {
    display: grid;
    grid-template-columns: 44px minmax(0,1fr);
    column-gap: 16px;
    align-items: center;
    width: 100%;
    min-width: 0;
    max-width: none;
    padding: 16px 18px;
    border-top: 1px solid rgba(17,24,39,0.14);
    border-left: 5px solid var(--prepon-yellow);
    background: #fff;
}
.prepon-flowchart-decision .prepon-blog-flowchart__number {
    width: 38px;
    height: 38px;
    margin: 0;
}
.prepon-flowchart-decision .prepon-blog-flowchart__content {
    gap: 7px;
}
.prepon-flowchart-decision .prepon-blog-flowchart__title,
.prepon-flowchart-decision .prepon-blog-flowchart__text {
    max-width: none;
    text-align: left !important;
}
.prepon-flowchart-decision .prepon-blog-flowchart__step:not(:last-child)::after {
    content: "↓";
    right: 50%;
    top: auto;
    bottom: -24px;
    transform: translateX(50%);
}
.prepon-flowchart-decision .prepon-blog-flowchart__step:last-child {
    border: 1px solid rgba(252,197,9,0.55);
    border-left: 5px solid var(--prepon-yellow);
    background: rgba(252,197,9,0.13);
}

/* -------------------------------------------------------------------------
   CTA VARIANTS + FINAL CTA COPY
   ------------------------------------------------------------------------- */

body.prepon-imported-post .elementor-widget-theme-post-content .prepon-button-secondary .wp-block-button__link,
body.prepon-imported-post .entry-content .prepon-button-secondary .wp-block-button__link,
.editor-styles-wrapper .prepon-button-secondary .wp-block-button__link {
    background: #fff !important;
    color: #111827 !important;
    border: 2px solid var(--prepon-yellow) !important;
}
body.prepon-imported-post .elementor-widget-theme-post-content .prepon-button-secondary .wp-block-button__link:hover,
body.prepon-imported-post .entry-content .prepon-button-secondary .wp-block-button__link:hover,
.editor-styles-wrapper .prepon-button-secondary .wp-block-button__link:hover {
    background: rgba(252,197,9,0.12) !important;
}
.prepon-brand-tagline {
    margin-top: 18px !important;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    color: #111827 !important;
}

.prepon-final-cta-copy {
    line-height: 1.68 !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
}
.prepon-final-cta-copy + .wp-block-buttons {
    margin-top: 12px !important;
    margin-bottom: 14px !important;
}


/* -------------------------------------------------------------------------
   SYLLABUS CARDS
   ------------------------------------------------------------------------- */

.prepon-card-grid-syllabus {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.prepon-card-grid-syllabus .prepon-blog-card {
    border-top: 4px solid var(--prepon-yellow);
    background: linear-gradient(180deg, rgba(252,197,9,0.08), #fff 38%);
}
.prepon-card-grid-syllabus .prepon-blog-card__title {
    margin-bottom: 14px !important;
    text-align: left;
}
.prepon-card-grid-syllabus .prepon-blog-card__body {
    text-align: left;
}
.prepon-card-grid-syllabus .prepon-blog-card__body ul {
    margin: 0 !important;
    padding-left: 20px !important;
}
.prepon-card-grid-syllabus .prepon-blog-card__body li {
    margin: 0 0 7px !important;
    line-height: 1.48 !important;
}
.prepon-card-grid-syllabus .prepon-blog-card__body li:last-child {
    margin-bottom: 0 !important;
}



/* RC5 visual-rhythm contract: when the importer encounters two consecutive
   visual/graphic blocks, it inserts this semantic spacer. 72px is roughly three
   lines of PREPON body copy and prevents visually crowded back-to-back graphics. */
.prepon-consecutive-visual-gap {
    height: 72px !important;
    min-height: 72px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* RC5 table contract: all cell content is vertically centred, including header
   and first-column header cells, on desktop, tablet and mobile. */
.prepon-responsive-table th,
.prepon-responsive-table td,
body.prepon-imported-post .wp-block-table th,
body.prepon-imported-post .wp-block-table td,
.editor-styles-wrapper .wp-block-table th,
.editor-styles-wrapper .wp-block-table td {
    vertical-align: middle !important;
}

/* -------------------------------------------------------------------------
   FAQ ACCORDION — FINAL v1.4.1
   Native <details>/<summary> keeps the component accessible and resilient.
   ------------------------------------------------------------------------- */
.prepon-faq-accordion {
    width: 100%;
    margin: 24px 0 30px;
    display: grid;
    gap: 12px;
}
.prepon-faq-accordion__item {
    border: 1px solid rgba(17,24,39,0.15);
    border-top: 4px solid var(--prepon-yellow);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(17,24,39,0.05);
}
.prepon-faq-accordion__question {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: 34px minmax(0,1fr) 22px;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
    color: #111827 !important;
    text-align: left !important;
}
.prepon-faq-accordion__question::-webkit-details-marker { display: none; }
.prepon-faq-accordion__question::marker { content: ''; }
.prepon-faq-accordion__question::after {
    content: '+';
    justify-self: end;
    font-family: Poppins, Arial, sans-serif;
    font-size: 20px;
    line-height: 1;
    font-weight: 700;
    color: #111827;
}
.prepon-faq-accordion__item[open] > .prepon-faq-accordion__question::after { content: '−'; }
.prepon-faq-accordion__index {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--prepon-yellow);
    color: #111827;
    font-family: Poppins, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
}
.prepon-faq-accordion__answer {
    padding: 0 18px 17px 64px;
    font-family: Inter, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
    color: #263548 !important;
    text-align: left !important;
}
.prepon-faq-accordion__answer > :first-child { margin-top: 0 !important; }
.prepon-faq-accordion__answer > :last-child { margin-bottom: 0 !important; }
.prepon-faq-accordion__answer :is(ul,ol) { text-align: left !important; }

/* v1.5.2 desktop readability rule: every flowchart with more than four
   cards is exactly two rows. The importer sets the balanced column count to
   ceil(step_count / 2). Numbering preserves sequence; the misleading arrow
   at the end of the first row is suppressed. */
@media (min-width: 1025px) {
    .prepon-blog-flowchart--two-row-desktop {
        position: relative !important;
        width: min(96%, 1280px) !important;
        max-width: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
    }
    .prepon-blog-flowchart--two-row-desktop .prepon-blog-flowchart__list {
        position: relative !important;
        display: grid !important;
        grid-template-columns: repeat(var(--prepon-flowchart-desktop-columns), 160px) !important;
        grid-template-rows: repeat(var(--prepon-flowchart-desktop-rows, 2), auto) !important;
        grid-auto-flow: row !important;
        align-items: stretch !important;
        justify-content: center !important;
        gap: 18px 14px !important;
        width: max-content !important;
        max-width: none !important;
        min-width: max-content !important;
        height: auto !important;
        margin: 0 auto !important;
        padding: 4px 2px 8px !important;
    }
    .prepon-blog-flowchart--two-row-desktop .prepon-blog-flowchart__list::before {
        display: none !important;
        content: none !important;
    }
    .prepon-blog-flowchart--two-row-desktop .prepon-blog-flowchart__step,
    .prepon-blog-flowchart--two-row-desktop .prepon-blog-flowchart__step:nth-child(n) {
        position: relative !important;
        display: flex !important;
        flex: none !important;
        flex-direction: column !important;
        align-items: stretch !important;
        grid-template-columns: none !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: 160px !important;
        min-width: 160px !important;
        max-width: 160px !important;
        min-height: 0 !important;
        height: auto !important;
    }
    .prepon-blog-flowchart--two-row-desktop .prepon-blog-flowchart__step:not(.prepon-blog-flowchart__step--desktop-row-end):not(:last-child)::after {
        content: "→" !important;
        position: absolute !important;
        right: -13px !important;
        left: auto !important;
        top: 50% !important;
        bottom: auto !important;
        transform: translateY(-50%) !important;
        display: grid !important;
        place-items: center !important;
        width: 24px !important;
        height: 24px !important;
        border-radius: 999px !important;
        background: var(--prepon-yellow) !important;
        color: #111827 !important;
        font-size: 12px !important;
        line-height: 1 !important;
    }
    .prepon-blog-flowchart--two-row-desktop .prepon-blog-flowchart__step--desktop-row-end::after {
        display: none !important;
        content: none !important;
    }
}


/* -------------------------------------------------------------------------
   RESPONSIVE SEMANTIC COMPONENTS — FINAL v1.4.1

   Desktop: > 1024px
   Tablet:  721–1024px
   Mobile:  <= 720px

   Tablet/mobile are intentionally content-driven: no forced equal-height
   cards, no max-content flow rows, no desktop circular positioning, and no
   connector geometry that can overlap wrapped copy.
   ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    .prepon-faq-accordion { gap: 10px; margin: 22px 0 28px; }
    .prepon-faq-accordion__question { grid-template-columns: 32px minmax(0,1fr) 20px; padding: 14px 15px; gap: 10px; }
    .prepon-faq-accordion__index { width: 32px; height: 32px; }
    .prepon-faq-accordion__answer { padding: 0 15px 15px 57px; }
    /* General cards: preserve compact, content-driven height on tablet. */
    .prepon-blog-card-grid,
    .prepon-blog-card-grid[class*="prepon-card-grid-"] {
        align-items: start;
    }
    .prepon-blog-card-grid--cols-4,
    .prepon-blog-card-grid--cols-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .prepon-blog-card-grid[class*="prepon-card-grid-"] .prepon-blog-card {
        min-height: 0;
        height: auto;
        align-self: start;
        padding: 16px 16px 18px;
    }
    .prepon-card-grid-syllabus {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* RC5 alignment rule: card copy is centred on tablet/mobile unless the
       content is an actual bulleted or numbered list. */
    .prepon-blog-card-grid .prepon-blog-card,
    .prepon-blog-card-grid[class*="prepon-card-grid-"] .prepon-blog-card {
        text-align: center;
    }
    .prepon-blog-card__number {
        margin-left: auto;
        margin-right: auto;
    }
    .prepon-blog-card__eyebrow,
    .prepon-blog-card__title,
    .prepon-blog-card__body,
    .prepon-card-grid-syllabus .prepon-blog-card__title,
    .prepon-card-grid-syllabus .prepon-blog-card__body {
        text-align: center !important;
    }
    .prepon-blog-card__body ul,
    .prepon-blog-card__body ol,
    .prepon-blog-card__body menu,
    .prepon-blog-card__body li,
    .prepon-card-grid-syllabus .prepon-blog-card__body ul,
    .prepon-card-grid-syllabus .prepon-blog-card__body ol,
    .prepon-card-grid-syllabus .prepon-blog-card__body li {
        text-align: left !important;
    }

    /* Generic/framework/compact/roadmap flows become a two-column grid.
       This explicitly removes max-content sizing and fixed card widths. */
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) {
        width: 100%;
        max-width: 100%;
        overflow: visible;
    }
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) .prepon-blog-flowchart__list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        max-width: 100%;
        min-width: 0;
        gap: 18px;
        margin: 0 auto !important;
        padding: 4px 0 8px !important;
    }
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) .prepon-blog-flowchart__step,
    .prepon-flowchart-framework .prepon-blog-flowchart__step,
    .prepon-flowchart-compact .prepon-blog-flowchart__step,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__step {
        position: relative;
        flex: none;
        width: 100%;
        min-width: 0;
        max-width: none;
        min-height: 0;
        height: auto;
        align-self: start;
    }
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) .prepon-blog-flowchart__step::after {
        display: none !important;
    }
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) .prepon-blog-flowchart__content {
        flex: 0 1 auto;
        min-height: 0;
    }

    /* Centre responsive flow-card copy. Keep true lists left aligned. */
    .prepon-blog-flowchart__number {
        margin-left: auto;
        margin-right: auto;
    }
    .prepon-blog-flowchart__content {
        align-items: center;
    }
    .prepon-blog-flowchart__title,
    .prepon-blog-flowchart__text,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text,
    .prepon-flowchart-decision .prepon-blog-flowchart__title,
    .prepon-flowchart-decision .prepon-blog-flowchart__text {
        text-align: center !important;
    }
    .prepon-blog-flowchart__text ul,
    .prepon-blog-flowchart__text ol,
    .prepon-blog-flowchart__text menu,
    .prepon-blog-flowchart__text li,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text ul,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text ol,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text li,
    .prepon-flowchart-decision .prepon-blog-flowchart__text ul,
    .prepon-flowchart-decision .prepon-blog-flowchart__text ol,
    .prepon-flowchart-decision .prepon-blog-flowchart__text li {
        text-align: left !important;
    }

    /* Six-node loop: abandon absolute/circular geometry on tablet. */
    .prepon-flowchart-loop {
        min-height: 0;
        width: 100%;
        max-width: 100%;
        overflow: visible;
    }
    .prepon-flowchart-loop .prepon-blog-flowchart__list {
        position: relative;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto;
        gap: 18px;
        margin: 0 auto !important;
    }
    .prepon-flowchart-loop .prepon-blog-flowchart__list::before {
        display: none;
    }
    .prepon-flowchart-loop .prepon-blog-flowchart__step,
    .prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(n) {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        min-width: 0;
        max-width: none;
        min-height: 0;
        height: auto;
        align-self: start;
        transform: none;
    }
    .prepon-flowchart-loop .prepon-blog-flowchart__step::after,
    .prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(n)::after {
        display: none !important;
    }

    /* Decision flows remain vertical but become fully width-safe. */
    .prepon-flowchart-decision,
    .prepon-flowchart-decision .prepon-blog-flowchart__list {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
    .prepon-flowchart-decision .prepon-blog-flowchart__step {
        grid-template-columns: 1fr;
        justify-items: center;
        row-gap: 10px;
        min-height: 0;
        height: auto;
    }
    .prepon-flowchart-decision .prepon-blog-flowchart__number {
        margin: 0 auto;
    }

    /* Keep the canonical 65/35 image-text relationship on tablet, but tighten
       the gap so neither column is needlessly squeezed. */
    .prepon-image-text,
    .prepon-image-text--image-right {
        gap: 20px;
    }
    .prepon-responsive-table {
        width: 92% !important;
        max-width: 92% !important;
    }

    /* RC5 TABLET TYPOGRAPHY CONTRACT — reasserted so theme/Elementor responsive
       rules cannot silently change PREPON type at 721–1024px. */
    body.prepon-imported-post .elementor-widget-theme-post-content .elementor-widget-container,
    body.prepon-imported-post .entry-content,
    body.prepon-imported-post .elementor-widget-theme-post-content :is(p,li),
    body.prepon-imported-post .entry-content :is(p,li),
    .editor-styles-wrapper,
    .editor-styles-wrapper :is(p,li) {
        font-family: Inter, Arial, sans-serif !important;
        font-size: 14px !important;
        line-height: 1.65 !important;
        font-weight: 400 !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content h2,
    body.prepon-imported-post .entry-content h2, .editor-styles-wrapper h2 {
        font-family: Poppins, Arial, sans-serif !important; font-size: 20px !important; line-height: 1.35 !important; font-weight: 700 !important; text-align: left !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content h3,
    body.prepon-imported-post .entry-content h3, .editor-styles-wrapper h3 {
        font-family: Poppins, Arial, sans-serif !important; font-size: 17px !important; line-height: 1.4 !important; font-weight: 700 !important; text-align: left !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content h4,
    body.prepon-imported-post .entry-content h4, .editor-styles-wrapper h4 {
        font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 700 !important; text-align: left !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content :is(h5,h6),
    body.prepon-imported-post .entry-content :is(h5,h6), .editor-styles-wrapper :is(h5,h6) {
        font-family: Poppins, Arial, sans-serif !important; font-size: 11px !important; line-height: 1.45 !important; font-weight: 700 !important; text-align: left !important;
    }
    .prepon-blog-card__eyebrow { font-family: Poppins, Arial, sans-serif !important; font-size: 11px !important; line-height: 1.4 !important; font-weight: 700 !important; }
    .prepon-blog-card__title, .prepon-image-text__title, .prepon-direct-answer__title, .prepon-callout-title, .prepon-blog-flowchart__title {
        font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 700 !important;
    }
    .prepon-blog-card__body, .prepon-image-text__body, .prepon-direct-answer__body, .prepon-callout-body {
        font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.65 !important; font-weight: 400 !important;
    }
    .prepon-blog-flowchart__text { font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.6 !important; font-weight: 400 !important; }
    .prepon-responsive-table table, .prepon-responsive-table td { font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.6 !important; font-weight: 400 !important; }
    .prepon-responsive-table th { font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 700 !important; }
    figure.prepon-blog-image figcaption, .prepon-image-text__media figcaption { font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.5 !important; font-weight: 400 !important; }
    body.prepon-imported-post .elementor-widget-theme-post-content .wp-block-button__link,
    body.prepon-imported-post .entry-content .wp-block-button__link, .editor-styles-wrapper .wp-block-button__link {
        font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.4 !important; font-weight: 700 !important; text-align: center !important;
    }

}

@media (max-width: 720px) {
    .prepon-faq-accordion { gap: 9px; margin: 20px 0 26px; }
    .prepon-faq-accordion__question { grid-template-columns: 30px minmax(0,1fr) 18px; padding: 13px 13px; gap: 9px; }
    .prepon-faq-accordion__index { width: 30px; height: 30px; }
    .prepon-faq-accordion__answer { padding: 0 13px 14px 52px; }
    /* All card grids become one content-driven column. */
    .prepon-blog-card-grid--cols-4,
    .prepon-blog-card-grid--cols-3,
    .prepon-blog-card-grid--cols-2,
    .prepon-card-grid-syllabus {
        grid-template-columns: 1fr;
    }
    .prepon-blog-card-grid,
    .prepon-blog-card-grid[class*="prepon-card-grid-"] {
        gap: 14px;
        align-items: start;
    }
    .prepon-blog-card-grid[class*="prepon-card-grid-"] .prepon-blog-card,
    .prepon-blog-card {
        min-height: 0;
        height: auto;
        align-self: start;
        padding: 14px 15px 16px;
    }
    .prepon-blog-card__eyebrow {
        margin-bottom: 12px;
    }
    .prepon-blog-card__title {
        margin-bottom: 10px !important;
    }
    .prepon-blog-card__eyebrow,
    .prepon-blog-card__title,
    .prepon-blog-card__body,
    .prepon-card-grid-syllabus .prepon-blog-card__title,
    .prepon-card-grid-syllabus .prepon-blog-card__body {
        text-align: center !important;
    }
    .prepon-blog-card__number {
        margin-left: auto;
        margin-right: auto;
    }
    .prepon-blog-card__body ul,
    .prepon-blog-card__body ol,
    .prepon-blog-card__body menu,
    .prepon-blog-card__body li,
    .prepon-card-grid-syllabus .prepon-blog-card__body ul,
    .prepon-card-grid-syllabus .prepon-blog-card__body ol,
    .prepon-card-grid-syllabus .prepon-blog-card__body li {
        text-align: left !important;
    }

    /* All non-decision flowcharts become a single vertical sequence. */
    .prepon-blog-flowchart,
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) {
        width: 100%;
        max-width: 100%;
        overflow: visible;
    }
    .prepon-blog-flowchart__list,
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) .prepon-blog-flowchart__list,
    .prepon-flowchart-loop .prepon-blog-flowchart__list {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto;
        gap: 14px;
        margin: 0 auto !important;
        padding: 4px 0 8px !important;
    }
    .prepon-blog-flowchart__step,
    .prepon-blog-flowchart:not(.prepon-flowchart-loop):not(.prepon-flowchart-decision) .prepon-blog-flowchart__step,
    .prepon-flowchart-loop .prepon-blog-flowchart__step,
    .prepon-flowchart-loop .prepon-blog-flowchart__step:nth-child(n) {
        width: 100%;
        max-width: none;
        min-width: 0;
        min-height: 0;
        height: auto;
        margin: 0;
        padding: 14px 15px 16px;
        align-self: start;
    }
    .prepon-blog-flowchart__step:not(:last-child)::after,
    .prepon-blog-flowchart[class*="prepon-flowchart-"] .prepon-blog-flowchart__step::after {
        display: none !important;
    }
    .prepon-blog-flowchart__number {
        width: 34px;
        height: 34px;
        margin-bottom: 10px;
    }
    .prepon-blog-flowchart__content {
        width: 100%;
        min-width: 0;
        flex: 0 1 auto;
        gap: 10px;
        align-items: center;
    }
    .prepon-blog-flowchart__title,
    .prepon-blog-flowchart__text {
        width: 100%;
        max-width: 34ch;
        margin-left: auto;
        margin-right: auto;
        text-align: center !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: normal;
    }
    /* Lists remain left aligned even though surrounding card copy is centred. */
    .prepon-blog-flowchart__text ul,
    .prepon-blog-flowchart__text ol,
    .prepon-blog-flowchart__text menu,
    .prepon-blog-flowchart__text li,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text ul,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text ol,
    .prepon-flowchart-roadmap .prepon-blog-flowchart__text li,
    .prepon-flowchart-decision .prepon-blog-flowchart__text ul,
    .prepon-flowchart-decision .prepon-blog-flowchart__text ol,
    .prepon-flowchart-decision .prepon-blog-flowchart__text li {
        text-align: left !important;
    }

    .prepon-flowchart-decision .prepon-blog-flowchart__step {
        grid-template-columns: 1fr;
        justify-items: center;
        row-gap: 9px;
        padding: 13px 14px;
    }
    .prepon-flowchart-decision .prepon-blog-flowchart__number {
        margin: 0 auto;
    }
    .prepon-flowchart-decision .prepon-blog-flowchart__title,
    .prepon-flowchart-decision .prepon-blog-flowchart__text {
        max-width: 34ch;
        margin-left: auto;
        margin-right: auto;
        text-align: center !important;
    }

    /* Stack editorial image/text on mobile. */
    .prepon-image-text,
    .prepon-image-text--image-right {
        grid-template-columns: 1fr;
        grid-template-areas: "copy" "media";
        gap: 18px;
        align-items: stretch;
    }
    .prepon-image-text--mobile-image-first,
    .prepon-image-text--image-right.prepon-image-text--mobile-image-first {
        grid-template-areas: "media" "copy";
    }

    .prepon-responsive-table {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .prepon-responsive-table th,
    .prepon-responsive-table td {
        padding: 10px 12px !important;
    }
    figure.prepon-blog-image--contained,
    figure.prepon-blog-image--compact,
    figure.prepon-blog-image--wide {
        width: 100% !important;
    }

    /* RC5 MOBILE TYPOGRAPHY CONTRACT — exact PREPON sizes/leading retained at <=720px. */
    body.prepon-imported-post .elementor-widget-theme-post-content .elementor-widget-container,
    body.prepon-imported-post .entry-content,
    body.prepon-imported-post .elementor-widget-theme-post-content :is(p,li),
    body.prepon-imported-post .entry-content :is(p,li),
    .editor-styles-wrapper,
    .editor-styles-wrapper :is(p,li) {
        font-family: Inter, Arial, sans-serif !important;
        font-size: 14px !important;
        line-height: 1.65 !important;
        font-weight: 400 !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content h2,
    body.prepon-imported-post .entry-content h2, .editor-styles-wrapper h2 {
        font-family: Poppins, Arial, sans-serif !important; font-size: 20px !important; line-height: 1.35 !important; font-weight: 700 !important; text-align: left !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content h3,
    body.prepon-imported-post .entry-content h3, .editor-styles-wrapper h3 {
        font-family: Poppins, Arial, sans-serif !important; font-size: 17px !important; line-height: 1.4 !important; font-weight: 700 !important; text-align: left !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content h4,
    body.prepon-imported-post .entry-content h4, .editor-styles-wrapper h4 {
        font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 700 !important; text-align: left !important;
    }
    body.prepon-imported-post .elementor-widget-theme-post-content :is(h5,h6),
    body.prepon-imported-post .entry-content :is(h5,h6), .editor-styles-wrapper :is(h5,h6) {
        font-family: Poppins, Arial, sans-serif !important; font-size: 11px !important; line-height: 1.45 !important; font-weight: 700 !important; text-align: left !important;
    }
    .prepon-blog-card__eyebrow { font-family: Poppins, Arial, sans-serif !important; font-size: 11px !important; line-height: 1.4 !important; font-weight: 700 !important; }
    .prepon-blog-card__title, .prepon-image-text__title, .prepon-direct-answer__title, .prepon-callout-title, .prepon-blog-flowchart__title {
        font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 700 !important;
    }
    .prepon-blog-card__body, .prepon-image-text__body, .prepon-direct-answer__body, .prepon-callout-body {
        font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.65 !important; font-weight: 400 !important;
    }
    .prepon-blog-flowchart__text { font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.6 !important; font-weight: 400 !important; }
    .prepon-responsive-table table, .prepon-responsive-table td { font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.6 !important; font-weight: 400 !important; }
    .prepon-responsive-table th { font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 700 !important; }
    figure.prepon-blog-image figcaption, .prepon-image-text__media figcaption { font-family: Inter, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.5 !important; font-weight: 400 !important; }
    body.prepon-imported-post .elementor-widget-theme-post-content .wp-block-button__link,
    body.prepon-imported-post .entry-content .wp-block-button__link, .editor-styles-wrapper .wp-block-button__link {
        font-family: Poppins, Arial, sans-serif !important; font-size: 14px !important; line-height: 1.4 !important; font-weight: 700 !important; text-align: center !important;
    }

}


/* =========================================================================
   PREPON BLOG IMPORTER v1.4.1 — GOVERNED RESPONSIVE CONTRACTS
   These generic component rules supersede global breakpoint assumptions
   without adding any article/import-ID-specific selectors.
   ========================================================================= */

/* Editorial links must remain inline even if a theme/plugin changes generic
   anchor display behaviour. Buttons/navigation keep their own component rules. */
body.prepon-imported-post .elementor-widget-theme-post-content :is(p,li,blockquote,figcaption) a:not(.wp-block-button__link),
body.prepon-imported-post .entry-content :is(p,li,blockquote,figcaption) a:not(.wp-block-button__link),
.editor-styles-wrapper :is(p,li,blockquote,figcaption) a:not(.wp-block-button__link),
.prepon-blog-card__body a,
.prepon-blog-flowchart__text a,
.prepon-callout-body a,
.prepon-image-text__body a,
.prepon-faq-accordion__answer a {
    display: inline !important;
    width: auto !important;
    max-width: none !important;
}

/* Article headings always own the full available content width and cannot
   inherit narrow component max-widths. */
body.prepon-imported-post .elementor-widget-theme-post-content :is(h2,h3,h4,h5,h6),
body.prepon-imported-post .entry-content :is(h2,h3,h4,h5,h6),
.editor-styles-wrapper :is(h2,h3,h4,h5,h6) {
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

/* Table width contract. Standard tables retain the editorial constrained width;
   content-full tables deliberately use all available article width. */
.prepon-responsive-table.prepon-table-width-content-full {
    width: 100% !important;
    max-width: 100% !important;
}

/* Desktop card-grid contract. */
.prepon-blog-card-grid.prepon-grid-d-1 { grid-template-columns: minmax(0,1fr) !important; }
.prepon-blog-card-grid.prepon-grid-d-2 { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
.prepon-blog-card-grid.prepon-grid-d-3 { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
.prepon-blog-card-grid.prepon-grid-d-4 { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }

/* Explicit tablet typography applies only to importer-managed live components,
   not to the theme's global article body typography. */
@media (min-width: 721px) and (max-width: 1024px) {
    .prepon-blog-card__body,
    .prepon-blog-flowchart__text,
    .prepon-callout-body,
    .prepon-image-text__body,
    .prepon-faq-accordion__answer,
    .prepon-responsive-table td {
        font-family: Inter, Arial, sans-serif !important;
        font-size: 15px !important;
        line-height: 1.6 !important;
        font-weight: 400 !important;
    }

    .prepon-responsive-table th,
    .prepon-blog-card__title,
    .prepon-blog-flowchart__title,
    .prepon-faq-accordion__question {
        font-family: Poppins, Arial, sans-serif !important;
    }

    /* Manifest-owned tablet columns override legacy/global defaults. */
    .prepon-blog-card-grid.prepon-grid-t-1 { grid-template-columns: minmax(0,1fr) !important; }
    .prepon-blog-card-grid.prepon-grid-t-2 { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .prepon-blog-card-grid.prepon-grid-t-3 { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
    .prepon-blog-card-grid.prepon-grid-t-4 { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }

    .prepon-responsive-table.prepon-table-width-content-full {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 720px) {
    /* Manifest-owned mobile columns override the legacy one-column fallback.
       PREPON production defaults to one column, but the contract supports 1–4. */
    .prepon-blog-card-grid.prepon-grid-m-1 { grid-template-columns: minmax(0,1fr) !important; }
    .prepon-blog-card-grid.prepon-grid-m-2 { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .prepon-blog-card-grid.prepon-grid-m-3 { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
    .prepon-blog-card-grid.prepon-grid-m-4 { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }

    /* Mobile table-to-card mode keeps one semantic table in the DOM. Each row
       becomes a live-text card and each cell displays its governed header label
       through data-label, avoiding duplicated article copy. */
    .prepon-responsive-table.prepon-table-mobile-cards {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards table,
    .prepon-responsive-table.prepon-table-mobile-cards tbody,
    .prepon-responsive-table.prepon-table-mobile-cards tr,
    .prepon-responsive-table.prepon-table-mobile-cards th,
    .prepon-responsive-table.prepon-table-mobile-cards td {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box;
    }

    /* Keep column headings available to assistive technology while removing the
       visual desktop header from the card layout. */
    .prepon-responsive-table.prepon-table-mobile-cards thead {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        padding: 0 !important;
        overflow: hidden !important;
        clip: rect(0 0 0 0) !important;
        clip-path: inset(50%) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody {
        display: grid !important;
        gap: 14px;
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody tr {
        margin: 0 !important;
        padding: 14px 15px !important;
        border: 1px solid var(--prepon-border) !important;
        border-top: 4px solid var(--prepon-yellow) !important;
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 7px 22px rgba(17,24,39,0.05);
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody :is(th,td) {
        display: grid !important;
        grid-template-columns: minmax(105px, 34%) minmax(0,1fr) !important;
        gap: 10px !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 9px 0 !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(17,24,39,0.10) !important;
        font-family: Inter, Arial, sans-serif !important;
        font-size: 14px !important;
        line-height: 1.55 !important;
        font-weight: 400 !important;
        text-align: left !important;
        vertical-align: middle !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody :is(th,td)::before {
        content: attr(data-label);
        min-width: 0;
        font-family: Poppins, Arial, sans-serif !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
        font-weight: 700 !important;
        color: var(--prepon-heading);
        text-align: left;
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody :is(th,td):last-child {
        border-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody :is(th,td):first-child {
        grid-template-columns: 1fr !important;
        padding-top: 0 !important;
        padding-bottom: 10px !important;
        font-family: Poppins, Arial, sans-serif !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
        font-weight: 700 !important;
        color: var(--prepon-heading) !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards tbody :is(th,td):first-child::before {
        display: none !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards colgroup {
        display: none !important;
    }

    .prepon-responsive-table.prepon-table-mobile-cards figcaption {
        margin-top: 10px !important;
    }
}

/* v1.5.3 compact short-label mobile grid rule.
   Title-only compact card grids automatically receive
   .prepon-blog-card-grid--compact-mobile-two from the renderer. This is a
   narrow exception to the normal one-column mobile rule: short labels stay
   two-up, while explanatory cards with body copy remain one column. */
@media (max-width: 720px) {
    .prepon-blog-card-grid.prepon-blog-card-grid--compact-mobile-two {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .prepon-blog-card-grid.prepon-blog-card-grid--compact-mobile-two .prepon-blog-card {
        min-width: 0 !important;
        padding: 12px 10px 13px !important;
    }

    .prepon-blog-card-grid.prepon-blog-card-grid--compact-mobile-two .prepon-blog-card__title {
        margin-bottom: 0 !important;
        overflow-wrap: anywhere;
    }
}

/* v1.5.5: Optional canonical H2 rendered by the FAQ component itself. */
.prepon-faq-accordion__heading {
    width: 100%;
    max-width: none;
    margin: 30px 0 20px;
    color: var(--prepon-heading) !important;
}