/* Pexody shared theme — current appearance, no palette change.
 * Change brand tokens here; component layouts remain in their own stylesheets.
 * Page-specific detail shades preserve the existing designs deliberately.
 * Load this file BEFORE the page stylesheet.
 */
:root {
  --px-font-body: "Inter", sans-serif;
  --px-font-heading: "Poppins", sans-serif;
  --px-font-course: Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  /* Shared brand and states */
  --px-brand: #3a8dff;
  --px-accent: #d7f205;
  --px-surface: #ffffff;
  --px-brand-dark: #1758bd;
  --px-brand-deep: #082d69;
  --px-brand-ink: #061c42;
  --px-brand-surface: #edf4ff;
  --px-surface-soft: #f8fbff;
  --px-success: #23704e;
  --px-danger: #9c3a3a;
  --px-warning-surface: #fff3df;


  /* Home detail shades */
  --px-home-detail-background: #f4f7fb;
  --px-home-detail-text: #42506a;
  --px-home-detail-heading: #10223f;
  --px-home-detail-muted: #6c7890;
  --px-home-detail-border: #dce5f2;
  --px-home-detail-border-strong: #cbd8e9;
  --px-home-detail-shadow: rgba(15, 45, 95, 0.09);
  --px-home-detail-shadow-strong: rgba(8, 45, 105, 0.16);
  --px-home-a-focus-visible-outline: color-mix(in srgb, var(--px-accent) 72%, transparent);
  --px-home-navigation-site-header-background: rgba(7, 28, 66, 0.97);
  --px-home-navigation-site-header-background-2: rgba(12, 65, 145, 0.97);
  --px-home-navigation-site-header-border-bottom: color-mix(in srgb, var(--px-surface) 10%, transparent);
  --px-home-navigation-site-header-box-shadow: rgba(4, 24, 57, 0.16);
  --px-home-nav-a-color: color-mix(in srgb, var(--px-surface) 80%, transparent);
  --px-home-primary-button-box-shadow: color-mix(in srgb, var(--px-brand) 26%, transparent);
  --px-home-primary-button-hover-box-shadow: rgba(5, 28, 66, 0.18);
  --px-home-hero-hero-background: #fbfdff;
  --px-home-hero-tag-border: color-mix(in srgb, var(--px-brand) 16%, transparent);
  --px-home-hero-tag-background: color-mix(in srgb, var(--px-brand) 8%, transparent);
  --px-home-hero-text-color: #52627d;
  --px-home-hero-orb-one-background: color-mix(in srgb, var(--px-brand) 22%, transparent);
  --px-home-hero-orb-two-background: rgba(65, 184, 255, 0.15);
  --px-home-symptom-summary-border: color-mix(in srgb, var(--px-brand) 14%, transparent);
  --px-home-evidence-framework-foundations-section-background: #0b55b8;
  --px-home-foundations-heading-section-intro-color: color-mix(in srgb, var(--px-surface) 76%, transparent);
  --px-home-evidence-card-border: color-mix(in srgb, var(--px-surface) 15%, transparent);
  --px-home-evidence-card-background: color-mix(in srgb, var(--px-surface) 8%, transparent);
  --px-home-evidence-card-p-color: color-mix(in srgb, var(--px-surface) 82%, transparent);
  --px-home-evidence-card-span-color: color-mix(in srgb, var(--px-surface) 56%, transparent);
  --px-home-maturity-framework-before-background: color-mix(in srgb, var(--px-accent) 18%, transparent);
  --px-home-maturity-framework-before-background-2: color-mix(in srgb, var(--px-accent) 78%, transparent);
  --px-home-maturity-marker-border: color-mix(in srgb, var(--px-accent) 70%, transparent);
  --px-home-maturity-stage-p-color: color-mix(in srgb, var(--px-surface) 68%, transparent);
  --px-home-framework-summary-color: color-mix(in srgb, var(--px-surface) 78%, transparent);
  --px-home-assessment-assessment-background: color-mix(in srgb, var(--px-brand) 9%, transparent);
  --px-home-assessment-preview-assessment-preview-border: color-mix(in srgb, var(--px-brand) 18%, transparent);
  --px-home-assessment-preview-assessment-preview-background: color-mix(in srgb, var(--px-surface) 94%, transparent);
  --px-home-preview-bar-background: #dbe6f4;
  --px-home-preview-bar-span-background: #74b3ff;
  --px-home-preview-row-priority-preview-bar-span-background: #b9d400;
  --px-home-preview-row-priority-small-background: color-mix(in srgb, var(--px-accent) 50%, transparent);
  --px-home-newsletter-insights-card-background: #0b4da8;
  --px-home-insights-card-p-not-section-tag-color: color-mix(in srgb, var(--px-surface) 75%, transparent);
  --px-home-insights-form-input-border: color-mix(in srgb, var(--px-surface) 20%, transparent);
  --px-home-insights-form-input-background: color-mix(in srgb, var(--px-surface) 97%, transparent);
  --px-home-insights-form-input-placeholder-color: #8a96aa;
  --px-home-final-cta-final-cta-background: #0a3478;
  --px-home-final-cta-final-cta-background-2: #0d5dc8;
  --px-home-final-cta-primary-button-box-shadow: rgba(6, 28, 66, 0.22);
  --px-home-contact-line-color: color-mix(in srgb, var(--px-surface) 64%, transparent);
  --px-home-footer-container-p-color: color-mix(in srgb, var(--px-surface) 66%, transparent);
  --px-home-footer-links-a-color: color-mix(in srgb, var(--px-surface) 74%, transparent);
  --px-home-footer-bottom-color: color-mix(in srgb, var(--px-surface) 48%, transparent);
  --px-home-privacy-cookies-preserved-for-privacy-html-pr-background: color-mix(in srgb, var(--px-brand) 10%, transparent);
  --px-home-cookie-banner-box-shadow: rgba(6, 28, 66, 0.2);
  --px-home-cookie-button-secondary-border: color-mix(in srgb, var(--px-brand) 34%, transparent);
  --px-home-cookie-button-primary-hover-box-shadow: color-mix(in srgb, var(--px-brand) 28%, transparent);
  --px-home-maturity-framework-before-background-3: color-mix(in srgb, var(--px-accent) 26%, transparent);
  --px-home-maturity-framework-before-background-4: color-mix(in srgb, var(--px-accent) 80%, transparent);


  /* Assessment detail shades */
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-primary-dark: #2c74d8;
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-primary-deep: #123f75;
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-background: #f5f8fc;
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-text: #162033;
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-text-muted: #647085;
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-border: #dfe7f1;
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-shadow-large: rgba(25, 59, 102, 0.13);
  --px-assessment-import-url-https-fonts-googleapis-com-css2-fa-shadow-medium: rgba(25, 59, 102, 0.09);
  --px-assessment-secondary-button-hover-border-color: color-mix(in srgb, var(--px-brand) 55%, transparent);
  --px-assessment-secondary-button-hover-box-shadow: rgba(25, 59, 102, 0.07);
  --px-assessment-shared-labels-eyebrow-background: color-mix(in srgb, var(--px-surface) 72%, transparent);
  --px-assessment-welcome-screen-welcome-screen-background: color-mix(in srgb, var(--px-accent) 12%, transparent);
  --px-assessment-welcome-screen-welcome-screen-background-2: #eef5fd;
  --px-assessment-welcome-header-border-bottom: color-mix(in srgb, var(--px-brand) 12%, transparent);
  --px-assessment-review-status-background: color-mix(in srgb, var(--px-surface) 58%, transparent);
  --px-assessment-status-icon-background: color-mix(in srgb, var(--px-accent) 65%, transparent);
  --px-assessment-meta-item-border: rgba(223, 231, 241, 0.88);
  --px-assessment-meta-item-background: color-mix(in srgb, var(--px-surface) 70%, transparent);
  --px-assessment-score-bar-background: #d7e4f5;
  --px-assessment-shape-two-background: color-mix(in srgb, var(--px-brand) 7%, transparent);
  --px-assessment-question-screen-question-screen-background: color-mix(in srgb, var(--px-brand) 13%, transparent);
  --px-assessment-question-back-button-hover-border-color: color-mix(in srgb, var(--px-brand) 50%, transparent);
  --px-assessment-question-card-question-card-border: color-mix(in srgb, var(--px-surface) 86%, transparent);
  --px-assessment-question-number-color: #9aa8ba;
  --px-assessment-answer-option-focus-visible-outline: color-mix(in srgb, var(--px-brand) 20%, transparent);
  --px-assessment-answer-option-is-selected-background: rgba(237, 244, 255, 0.98);
  --px-assessment-answer-option-is-selected-background-2: rgba(247, 250, 255, 0.98);
  --px-assessment-answer-score-border: #ced9e7;
  --px-assessment-answer-score-background: #f8fafc;
  --px-assessment-question-context-card-question-context-card-background: rgba(237, 244, 255, 0.84);
  --px-assessment-answer-review-change-hover-border-color: color-mix(in srgb, var(--px-brand) 48%, transparent);
  --px-assessment-analysis-screen-analysis-screen-background: color-mix(in srgb, var(--px-accent) 8%, transparent);
  --px-assessment-analysis-card-analysis-card-background: color-mix(in srgb, var(--px-surface) 90%, transparent);
  --px-assessment-analysis-step-is-active-background: rgba(237, 244, 255, 0.72);
  --px-assessment-analysis-message-span-box-shadow: color-mix(in srgb, var(--px-accent) 16%, transparent);
  --px-assessment-results-screen-results-screen-background: color-mix(in srgb, var(--px-accent) 7%, transparent);
  --px-assessment-overall-score-card-background: color-mix(in srgb, var(--px-surface) 92%, transparent);
  --px-assessment-maturity-stage-span-border: #d6e1ee;
  --px-assessment-category-score-fill-background: #72b2ff;
  --px-assessment-strongest-area-category-score-row-is-stronges-border-color: rgba(23, 88, 189, 0.2);
  --px-assessment-strongest-area-category-score-row-is-stronges-background: color-mix(in srgb, var(--px-brand) 5.5%, transparent);
  --px-assessment-lowest-scoring-area-class-names-remain-priori-border-color: rgba(180, 205, 0, 0.3);
  --px-assessment-category-result-badge-priority-border: rgba(180, 205, 0, 0.22);
  --px-assessment-category-score-row-is-priority-category-score-background: #b8d000;
  --px-assessment-category-score-row-is-priority-category-score-color: #718000;
  --px-assessment-report-capture-card-background: rgba(231, 241, 255, 0.99);
  --px-assessment-report-capture-card-background-2: color-mix(in srgb, var(--px-surface) 99%, transparent);
  --px-assessment-report-capture-card-box-shadow: rgba(18, 63, 117, 0.22);
  --px-assessment-report-request-row-input-background: color-mix(in srgb, var(--px-surface) 96%, transparent);
  --px-assessment-report-request-row-input-placeholder-color: #98a5b7;
  --px-assessment-cookie-banner-box-shadow: rgba(18, 63, 117, 0.18);


  /* Course detail shades */
  --px-course-detail-navy: #101d34;
  --px-course-detail-navy2: #192b47;
  --px-course-detail-ink: #17263d;
  --px-course-detail-muted: #637084;
  --px-course-detail-line: #dde3ea;
  --px-course-detail-paper: #f5f7fa;
  --px-course-sidebar-meta-color: #a8b7cd;
  --px-course-progress-label-color: #adbad0;
  --px-course-progress-label-strong-color: #edf3fd;
  --px-course-progress-track-background: #2b3b54;
  --px-course-nav-caption-color: #8194b1;
  --px-course-lesson-nav-item-color: #b6c3d8;
  --px-course-lesson-nav-item-hover-background: #182a44;
  --px-course-lesson-nav-item-active-background: #233753;
  --px-course-lesson-nav-item-active-border-color: #365277;
  --px-course-nav-number-border: #465874;
  --px-course-active-nav-number-color: #07162e;
  --px-course-done-nav-number-color: #1a2805;
  --px-course-nav-time-color: #8e9fb8;
  --px-course-active-nav-time-color: #b9c9df;
  --px-course-resource-button-color: #d6e0ef;
  --px-course-resource-button-border: #3a4b64;
  --px-course-resource-button-count-background: #30445e;
  --px-course-foundation-color: #8fa1bd;
  --px-course-breadcrumb-span-color: #b9c2cf;
  --px-course-private-badge-color: #59667a;
  --px-course-private-badge-background: #fafbfd;
  --px-course-text-button-color: #45556d;
  --px-course-avatar-background: #eaf2ff;
  --px-course-avatar-color: #2361b8;
  --px-course-eyebrow-color: #6a788e;
  --px-course-lesson-kicker-color: #2768c6;
  --px-course-lesson-duration-background: #e9eef5;
  --px-course-lesson-duration-color: #56647a;
  --px-course-video-label-color: #b3c3da;
  --px-course-video-step-tag-color: #8fa7c9;
  --px-course-video-flow-span-border: #49607c;
  --px-course-video-flow-span-color: #c3d2e7;
  --px-course-video-flow-span-background: #172d49;
  --px-course-video-flow-span-last-child-border-color: #548ce0;
  --px-course-video-flow-span-last-child-color: #d8e8ff;
  --px-course-video-flow-span-last-child-background: #1d3b61;
  --px-course-video-flow-i-color: #7f99ba;
  --px-course-video-bg-border: #2d4666;
  --px-course-video-bg-box-shadow: #1c304c55;
  --px-course-video-bg-box-shadow-2: #1b2d4633;
  --px-course-video-bottom-border-top: #2d3c54;
  --px-course-video-bottom-background: #0c172b;
  --px-course-video-bottom-p-color: #a9b9d0;
  --px-course-video-bottom-p-span-color: #e0e9f5;
  --px-course-tab-list-button-color: #768095;
  --px-course-body-intro-color: #596a80;
  --px-course-principle-number-border: #d3ddea;
  --px-course-principle-number-color: #3e78c9;
  --px-course-principle-p-color: #63718a;
  --px-course-takeaway-background: #eef2f6;
  --px-course-takeaway-strong-color: #52637a;
  --px-course-case-mark-span-color: #1e477c;
  --px-course-person-avatar-background: #d3deec;
  --px-course-person-avatar-color: #3e5f87;
  --px-course-case-person-div-span-color: #77869a;
  --px-course-small-label-color: #758398;
  --px-course-outcome-card-p-color: #4d607a;
  --px-course-download-card-p-color: #7e8ca0;
  --px-course-download-card-a-color: #266ac4;
  --px-course-download-card-a-span-color: #8a96a8;
  --px-course-primary-button-color: #071d40;
  --px-course-back-button-color: #5b6e86;
  --px-course-site-footer-color: #8590a1;
  --px-course-site-footer-button-color: #6e7d92;
  --px-course-story-note-small-label-color: #2769bf;
  --px-course-story-grid-article-border-top: #c5d6ed;
  --px-course-workflow-map-li-border: #d4deeb;
  --px-course-workflow-map-li-b-color: #316dc1;
  --px-course-workflow-loop-border-left: #cf973a;
  --px-course-workflow-loop-color: #775a2e;
  --px-course-lenses-color: #708099;
  --px-course-lenses-strong-color: #52657e;
  --px-course-save-state-color: #6f7f95;
  --px-course-exercise-field-hint-color: #748298;
  --px-course-textarea-border: #ccd8e6;
  --px-course-textarea-placeholder-color: #8c99ab;
  --px-course-secondary-button-border: #c9d5e5;
  --px-course-secondary-button-color: #36587e;
  --px-course-exercise-tip-color: #7b8b9e;
  --px-course-toast-background: #172b47;
  --px-course-toast-border: #3d5370;
  --px-course-toast-box-shadow: #07193322;
  --px-course-dialog-border: #d3dce8;
  --px-course-dialog-box-shadow: #07193340;
  --px-course-dialog-backdrop-background: #07132999;
  --px-course-dialog-p-color: #67778f;
  --px-course-resource-row-border-top: #e0e6ef;
  --px-course-file-icon-border: #ced9e9;
  --px-course-file-icon-color: #286bc3;
  --px-course-file-icon-background: #f5f8ff;
  --px-course-resource-row-div-span-color: #7b8ba0;
  --px-course-asset-note-background: #f2f5f9;
  --px-course-asset-note-p-color: #667990;
  --px-course-resource-bottom-color: #8290a3;
  --px-course-danger-button-background: #ad3444;
  --px-course-complete-banner-background: #eef4d8;
  --px-course-complete-banner-border: #d0e39a;
  --px-course-complete-banner-check-color: #34522c;
  --px-course-complete-banner-p-color: #607044;
  --px-course-demo-label-color: #76869b;
  --px-course-snapshot-options-button-border: #d0dae7;
  --px-course-snapshot-options-button-color: #63738b;
  --px-course-snapshot-options-button-selected-background: #e6f0ff;
  --px-course-snapshot-options-button-selected-color: #235fae;
  --px-course-demo-input-border: #d6e0ec;
  --px-course-demo-input-p-color: #6a7e98;
  --px-course-demo-status-background: #eaf4ef;
  --px-course-demo-status-color: #286345;
  --px-course-demo-status-failed-background: #fceeed;
  --px-course-demo-status-neutral-background: #edf2f9;
  --px-course-demo-status-neutral-color: #4b668c;
  --px-course-metric-border-right: #e2e7ef;
  --px-course-metric-span-color: #79899e;
  --px-course-demo-caption-color: #72849c;
  --px-course-exception-table-th-border-bottom: #edf0f5;
  --px-course-exception-table-th-color: #647991;
  --px-course-stale-warning-background: #fff6e7;
  --px-course-stale-warning-color: #8c631f;
  --px-course-demo-explanation-color: #6c7c92;
  --px-course-noscript-background: #fff3cc;
  --px-course-sidebar-close-color: #b7c6db;
  --px-course-menu-scrim-background: #07132988;
  --px-course-download-card-blueprint-progress-color: #637792;
  --px-course-blueprint-prompt-background: #eaf0f8;
  --px-course-blueprint-prompt-border: #d6e1ef;
  --px-course-blueprint-toolbar-border-bottom: #d5dfec;
  --px-course-blueprint-explanation-color: #667a94;
  --px-course-blueprint-details-label-color: #445d7e;
  --px-course-blueprint-details-input-border: #cbd7e6;
  --px-course-blueprint-actions-span-color: #75869d;
  --px-course-blueprint-status-color: #506a8c;
  --px-course-blueprint-status-background: #f0f5fc;
  --px-course-blueprint-edit-color: #486181;
  --px-course-blueprint-edit-link-border: #d7e1ef;
  --px-course-blueprint-edit-link-background: #fafcfe;
  --px-course-blueprint-edit-link-b-color: #6b7e98;
  --px-course-blueprint-paper-bp-document-box-shadow: #17263d10;
  --px-course-blueprint-bottom-span-color: #6b7d94;
  --px-course-quiz-count-color: #526984;
  --px-course-quiz-number-color: #2868ba;
  --px-course-quiz-option-border: #d2dce8;
  --px-course-quiz-option-input-accent-color: #286ac5;
  --px-course-quiz-option-is-correct-border-color: #7faf96;
  --px-course-quiz-option-is-incorrect-background: #fff1ef;
  --px-course-quiz-option-is-incorrect-border-color: #c68a83;
  --px-course-answer-tag-color: #236345;
  --px-course-quiz-feedback-background: #edf5f0;
  --px-course-quiz-feedback-border-left: #71a98c;
  --px-course-quiz-feedback-color: #2f6048;
  --px-course-quiz-feedback-needs-review-color: #81512c;
  --px-course-quiz-feedback-needs-review-background: #fff5e7;
  --px-course-quiz-feedback-needs-review-border-color: #c69a55;
  --px-course-quiz-save-note-color: #728299;
  --px-course-quiz-result-background: #eaf0f9;
  --px-course-quiz-result-border: #ccdbef;
  --px-course-quiz-score-color: #205ca8;
  --px-course-quiz-score-small-color: #6b7c93;
  --px-course-quiz-result-p-color: #576c86;


  /* Resource detail shades */
  --px-resource-meta-color: #687c94;
  --px-resource-note-background: #f1f5fa;
  --px-resource-answer-border: #d7e0eb;
  --px-resource-answer-color: #71849d;
  --px-resource-button-color: #10213c;
  --px-resource-td-border: #d5dfeb;


  /* Blueprint detail shades */
  --px-blueprint-bp-eyebrow-color: #6a7d98;
  --px-blueprint-bp-cover-bp-eyebrow-color: #b3c8e7;
  --px-blueprint-bp-meta-border-top: #35455e;
  --px-blueprint-bp-meta-color: #e4ebf6;
  --px-blueprint-bp-meta-b-color: #94a9c7;
  --px-blueprint-bp-introduction-p-color: #61738c;
  --px-blueprint-bp-section-heading-border-bottom: #d6dfeb;
  --px-blueprint-bp-section-heading-span-color: #2868b8;
  --px-blueprint-bp-field-h3-color: #466487;
  --px-blueprint-bp-missing-bp-response-border: #c9d4e3;
  --px-blueprint-bp-missing-bp-response-color: #7b8799;
  --px-blueprint-bp-review-background: #f0f4f9;
  --px-blueprint-bp-review-p-bp-review-note-color: #6e7f95;
  --px-blueprint-bp-footer-border-top: #d9e1eb;
  --px-blueprint-bp-footer-color: #7a899e;
  --px-blueprint-bp-footer-b-color: #38577e;

}

/* Home compatibility aliases and existing geometry */
html[data-pexody-page="home"] {
    --primary: var(--px-brand);
    --primary-dark: var(--px-brand-dark);
    --primary-deep: var(--px-brand-deep);
    --primary-ink: var(--px-brand-ink);

    --accent: var(--px-accent);

    --background: var(--px-home-detail-background);
    --surface: var(--px-surface);
    --surface-blue: var(--px-brand-surface);
    --surface-soft: var(--px-surface-soft);

    --text: var(--px-home-detail-text);
    --heading: var(--px-home-detail-heading);
    --muted: var(--px-home-detail-muted);

    --border: var(--px-home-detail-border);
    --border-strong: var(--px-home-detail-border-strong);

    --radius-small: 16px;
    --radius: 24px;
    --radius-large: 34px;

    --shadow:
        0 18px 45px var(--px-home-detail-shadow);

    --shadow-strong:
        0 28px 70px var(--px-home-detail-shadow-strong);

    --container: 1200px;
}

/* Assessment compatibility aliases and existing geometry */
html[data-pexody-page="assessment"] {
    --primary: var(--px-brand);
    --primary-dark: var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-primary-dark);
    --primary-deep: var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-primary-deep);
    --accent: var(--px-accent);

    --background: var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-background);
    --surface: var(--px-surface);
    --surface-soft: var(--px-brand-surface);

    --text: var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-text);
    --text-muted: var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-text-muted);
    --border: var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-border);

    --shadow-large:
        0 30px 80px var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-shadow-large);

    --shadow-medium:
        0 18px 45px var(--px-assessment-import-url-https-fonts-googleapis-com-css2-fa-shadow-medium);

    --radius-large: 30px;
    --radius-medium: 20px;
    --radius-small: 12px;
}

/* Course compatibility aliases and existing geometry */
html[data-pexody-page="course"] {--navy:var(--px-course-detail-navy);--navy2:var(--px-course-detail-navy2);--blue:var(--px-brand);--ink:var(--px-course-detail-ink);--muted:var(--px-course-detail-muted);--line:var(--px-course-detail-line);--paper:var(--px-course-detail-paper);--lime:var(--px-accent);--green:var(--px-success);--radius:12px}
