/**
 * Home page — corporate layer (2026-10-02). Spec: docs/HOMEPAGE_MASTER_PROMPT.md
 * Presentation only, loaded last on the home page. One palette, one button, one card,
 * calm alternating backgrounds, no decorative blobs/waves. Remove its <link> in
 * includes/hp-head-assets.php to roll back.
 *
 * `html:root body…` is used throughout so these rules outrank the older !important layers.
 */
:root {
    --c-navy: #0b1f3a;
    --c-navy-2: #132c50;
    --c-royal: #1a4a8c;
    --c-gold: #c4a35a;
    --c-ink: #101828;
    --c-body: #475467;
    --c-line: #e4e7ec;
    --c-surface: #ffffff;
    --c-alt: #f6f8fb;
    --c-radius: 12px;
    --c-btn-radius: 8px;
    --c-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .06);
    --c-shadow-hover: 0 4px 8px -2px rgba(16, 24, 40, .08), 0 12px 24px -8px rgba(16, 24, 40, .12);
    --c-font: "Segoe UI", Figtree, system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
}

/* ===== 1. Header: white, hairline border, logo fixed at 44px at every width ===== */
html:root body.hp-home-page .hp-site-chrome,
html:root body.hp-home-page #hpSiteChrome.hp-site-chrome,
html:root body.hp-home-page #hpSiteChrome {
    background: rgba(255, 255, 255, .97) !important;
    background-color: rgba(255, 255, 255, .97) !important;
    border-bottom: 1px solid var(--c-line) !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04) !important;
}
html:root body.hp-home-page #siteHeader .hp-logo {
    background: transparent !important;
}
html:root body.hp-home-page .hp-logo-mark--img,
html:root body.hp-home-page #siteHeader .hp-logo-mark--img {
    width: auto !important;
    height: 44px !important;
    max-width: 68px !important;
    max-height: 44px !important;
    object-fit: contain !important;
    flex: 0 0 auto !important;
}
html:root body.hp-home-page .hp-footer-brand-lockup img {
    width: auto !important;
    height: auto !important;
    max-width: 180px !important;
    max-height: 72px !important;
    object-fit: contain !important;
}
@media (min-width: 901px) {
    html:root body.hp-home-page #siteHeader .hp-nav-link-top.is-active,
    html:root body.hp-home-page #siteHeader .hp-nav-cluster-toggle.is-active {
        background: var(--c-alt) !important;
        box-shadow: none !important;
        color: var(--c-navy) !important;
    }
    html:root body.hp-home-page #siteHeader .hp-nav-utility .hp-btn {
        border-radius: var(--c-btn-radius) !important;
    }
    html:root body.hp-home-page #siteHeader .hp-nav-utility .hp-btn-nav-signup {
        background: var(--c-navy) !important;
        border-color: var(--c-navy) !important;
        color: #fff !important;
    }
}

/* ===== 2. Remove decorative noise ===== */
html:root body.hp-home-page.hp-dynamics-ui :is(.hp-dyn-hero-wash, .hp-dyn-blob, .nl-halo-bg, .nl-loop-blobs, .nl-halo,
    .hp-dyn-usecase-arc, .hp-dyn-resources-wash, .hp-dyn-demo-wash, .hp-demo-bg-decor, .hp-modules-bg-decor,
    .hp-partner-bg-decor, .hp-glass-card-shine) {
    display: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > .hp-dyn-bridge {
    display: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui .hp-section-divider { display: none !important; }

/* ===== 3. Section rhythm: alternate white / alt, one rail ===== */
html:root body.hp-home-page.hp-dynamics-ui,
html:root body.hp-home-page.hp-arc {
    background: var(--c-surface) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#how-it-works, #benefits, #apps, #solutions, #testimonials, #demo-register, #partner-register) {
    background: var(--c-surface) !important;
    background-image: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#before-after, #modules, #resources, #home-faq) {
    background: var(--c-alt) !important;
    background-image: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#how-it-works, #before-after, #benefits, #modules, #apps, #solutions, #testimonials, #resources, #demo-register, #home-faq, #partner-register) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: clamp(3.5rem, 7vw, 5.5rem) !important;
    padding-bottom: clamp(3.5rem, 7vw, 5.5rem) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
/* full-bleed backgrounds; content stays on the rail via the inner containers */
@media (min-width: 901px) {
    html:root body.hp-home-page.hp-dynamics-ui main > :is(#modules, #partner-register, #demo-register) {
        max-width: none !important;
        width: 100% !important;
    }
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#modules, #partner-register, #demo-register) > :is(.hp-modules-wrap, .container) {
    max-width: 1240px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===== 4. Typography ===== */
html:root body.hp-home-page.hp-dynamics-ui main :is(h1, h2, h3) {
    font-family: var(--c-font) !important;
    font-style: normal !important;
}
html:root body.hp-home-page.hp-dynamics-ui main h2:not(.visually-hidden) {
    font-size: clamp(1.75rem, 2.6vw + .5rem, 2.5rem) !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    letter-spacing: -.02em !important;
}
html:root body.hp-home-page.hp-dynamics-ui main section:not(#onboarding):not(#streamline) h2:not(.visually-hidden) {
    color: var(--c-ink) !important;
    -webkit-text-fill-color: var(--c-ink) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-dyn-eyebrow, .hp-modules-kicker, .hp-intl-eyebrow, .hp-dyn-usecase-eyebrow, .nl-kicker, .hp-sx-eyebrow) {
    color: var(--c-royal) !important;
    font-size: .75rem !important;
    letter-spacing: .14em !important;
}
html:root body.hp-home-page.hp-dynamics-ui main #onboarding .hp-sx-eyebrow { color: var(--c-gold) !important; }

/* ===== 5. One button system ===== */
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-sx-btn, .hp-btn, .nl-btn, .btn, .demo-submit, .hp-dyn-usecase-cta,
    .hp-dyn-story-browse, .hp-dyn-demo-chat, .hp-dyn-streamline .hp-btn) {
    border-radius: var(--c-btn-radius) !important;
    min-height: 48px;
    font-family: var(--c-font) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}
/* primary: navy fill */
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-sx-btn--primary, .nl-btn--demo, .hp-btn-primary, .btn-primary, .demo-submit, .hp-dyn-demo-chat) {
    background: var(--c-navy) !important;
    border: 1px solid var(--c-navy) !important;
    color: #fff !important;
}
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-sx-btn--primary, .nl-btn--demo, .hp-btn-primary, .btn-primary, .demo-submit, .hp-dyn-demo-chat):hover {
    background: var(--c-navy-2) !important;
    border-color: var(--c-navy-2) !important;
}
/* secondary: white + hairline */
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-sx-btn--ghost, .nl-btn--overview, .hp-btn-outline, .hp-dyn-story-browse) {
    background: #fff !important;
    border: 1px solid #d0d5dd !important;
    color: var(--c-navy) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-sx-btn--ghost, .nl-btn--overview, .hp-btn-outline, .hp-dyn-story-browse):hover {
    border-color: var(--c-navy) !important;
    background: var(--c-alt) !important;
}
/* on dark bands */
html:root body.hp-home-page.hp-dynamics-ui main :is(#onboarding .hp-sx-btn--gold, #streamline .hp-btn-primary) {
    background: var(--c-gold) !important;
    border-color: var(--c-gold) !important;
    color: var(--c-navy) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main #onboarding .hp-sx-btn--onDark {
    border-radius: var(--c-btn-radius) !important;
}

/* ===== 6. Hero: clean white, framed media, solid two-tone title ===== */
html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero {
    background:
        linear-gradient(180deg, #ffffff 0%, var(--c-alt) 100%) !important;
    border-bottom: 1px solid var(--c-line);
    padding-top: clamp(3rem, 6vw, 5rem) !important;
    padding-bottom: clamp(3rem, 6vw, 5rem) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero h1 .hp-dyn-hero-title-a {
    color: var(--c-navy) !important;
    -webkit-text-fill-color: var(--c-navy) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero h1 .hp-dyn-hero-title-b {
    background: none !important;
    background-image: none !important;
    color: var(--c-royal) !important;
    -webkit-text-fill-color: var(--c-royal) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero .hp-hero-desc {
    color: var(--c-body) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home .hp-dyn-hero-glass {
    padding: 0 !important;
    background: #fff !important;
    border: 1px solid var(--c-line) !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 48px -16px rgba(11, 31, 58, .22) !important;
    backdrop-filter: none !important;
    overflow: hidden;
}
html:root body.hp-home-page.hp-dynamics-ui #home .hp-dyn-hero-glass::before,
html:root body.hp-home-page.hp-dynamics-ui #home .hp-dyn-hero-glass::after {
    display: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home .hp-dyn-hero-glass-inner {
    border-radius: 16px !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home .hp-dyn-hero-media-badge {
    background: rgba(11, 31, 58, .88) !important;
    color: #fff !important;
    border-radius: 6px !important;
    backdrop-filter: none !important;
}
html:root body.hp-home-page .hp-sx-hero-trust li {
    background: #fff !important;
    border-color: var(--c-line) !important;
    border-radius: 6px !important;
}

/* ===== 7. Numbers strip: navy band ===== */
html:root body.hp-home-page.hp-dynamics-ui main > #proof {
    background: var(--c-navy) !important;
    padding: clamp(1.75rem, 3.5vw, 2.5rem) 0 !important;
    margin: 0 !important;
}
html:root body.hp-home-page #proof .hp-sx-stats-grid {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}
html:root body.hp-home-page #proof .hp-sx-stat + .hp-sx-stat { border-left-color: rgba(255, 255, 255, .14) !important; }
html:root body.hp-home-page #proof .hp-sx-stat strong { color: #fff !important; }
html:root body.hp-home-page #proof .hp-sx-stat strong::first-letter { color: inherit; }
html:root body.hp-home-page #proof .hp-sx-stat > span { color: rgba(255, 255, 255, .72) !important; }

/* ===== 8. How it works loop: brand palette instead of purple ===== */
html:root body.hp-home-page.hp-dynamics-ui .nl-loop {
    --s1: #1a4a8c;
    --s2: #2f6bc2;
    --s3: #0b1f3a;
}
html:root body.hp-home-page.hp-dynamics-ui .nl-trust-icon {
    background: var(--c-alt) !important;
    color: var(--c-royal) !important;
    border-radius: 8px !important;
}

/* ===== 9. Cards: one style everywhere ===== */
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-module-card, .hp-dyn-benefit-card, .hp-sx-app, .hp-sx-review:not(.hp-sx-review--lead),
    .hp-dyn-resource-card, .hp-faq-item, .hp-demo-panel, .hp-partner-form-panel) {
    background: var(--c-surface) !important;
    background-image: none !important;
    border: 1px solid var(--c-line) !important;
    border-radius: var(--c-radius) !important;
    box-shadow: var(--c-shadow) !important;
    backdrop-filter: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui main :is(.hp-module-card, .hp-sx-app, .hp-dyn-resource-card):hover {
    box-shadow: var(--c-shadow-hover) !important;
    transform: translateY(-2px);
}
html:root body.hp-home-page.hp-dynamics-ui #benefits .hp-dyn-benefit-card {
    border-left: 3px solid var(--c-royal) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #benefits .hp-dyn-benefit-card i {
    color: var(--c-royal) !important;
}
html:root body.hp-home-page .hp-sx-app::before { display: none !important; }
html:root body.hp-home-page .hp-sx-app-icon { border-radius: 10px !important; }
html:root body.hp-home-page .hp-sx-review--lead { border-radius: var(--c-radius) !important; }
html:root body.hp-home-page.hp-dynamics-ui #modules .hp-modules-wrap {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui #modules .hp-module-icon {
    color: var(--c-royal) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #modules .hp-module-link {
    color: var(--c-royal) !important;
    background: none !important;
    border: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
html:root body.hp-home-page.hp-dynamics-ui #modules .hp-modules-tagline {
    border: 0 !important;
    padding-left: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}
html:root body.hp-home-page .hp-sx-ba-icon { background: var(--c-royal) !important; }

/* ===== 10. Use case: light band (keeps the only dark band below it = onboarding) ===== */
html:root body.hp-home-page.hp-dynamics-ui #solutions.hp-dyn-usecase {
    background: var(--c-surface) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #solutions :is(h2, p, li, .hp-dyn-usecase-copy, .hp-dyn-usecase-copy h2, .hp-dyn-usecase-copy p, .hp-dyn-usecase-copy li) {
    color: var(--c-body) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #solutions h2 { color: var(--c-ink) !important; }
html:root body.hp-home-page.hp-dynamics-ui #solutions .hp-dyn-usecase-eyebrow { color: var(--c-royal) !important; }
html:root body.hp-home-page.hp-dynamics-ui #solutions li::marker,
html:root body.hp-home-page.hp-dynamics-ui #solutions li::before { color: var(--c-royal) !important; background-color: var(--c-royal) !important; }
html:root body.hp-home-page.hp-dynamics-ui #solutions .hp-dyn-usecase-cta {
    display: inline-flex;
    align-items: center;
    background: var(--c-navy) !important;
    border: 1px solid var(--c-navy) !important;
    color: #fff !important;
}
html:root body.hp-home-page.hp-dynamics-ui #solutions .hp-dyn-usecase-card {
    border: 1px solid var(--c-line) !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 48px -20px rgba(11, 31, 58, .25) !important;
    background: #fff !important;
}

/* ===== 11. Onboarding & streamline: single navy treatment ===== */
html:root body.hp-home-page #onboarding.hp-sx-steps {
    background: var(--c-navy) !important;
    border-radius: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > #streamline {
    background: var(--c-surface) !important;
    padding-top: 0 !important;
    padding-bottom: clamp(2.5rem, 5vw, 3.5rem) !important;
}
html:root body.hp-home-page.hp-dynamics-ui .hp-dyn-streamline-inner {
    background: linear-gradient(120deg, var(--c-navy) 0%, var(--c-royal) 100%) !important;
    border-radius: var(--c-radius) !important;
}

/* ===== 12. Credentials & testimonials polish ===== */
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-visual {
    background: var(--c-alt) !important;
    border-radius: 8px !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-chevron {
    background: var(--c-navy) !important;
    color: #fff !important;
}
html:root body.hp-home-page.hp-dynamics-ui #testimonials .hp-dyn-story-head {
    align-items: end;
}

/* ===== 13. Forms: corporate inputs ===== */
html:root body.hp-home-page.hp-dynamics-ui main .demo-form :is(input, select, textarea) {
    border: 1px solid #d0d5dd !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main .demo-form :is(input, select, textarea):focus {
    border-color: var(--c-royal) !important;
    outline: 3px solid rgba(26, 74, 140, .15) !important;
    outline-offset: 0 !important;
}

/* ===== 14. Mobile ===== */
@media (max-width: 640px) {
    html:root body.hp-home-page.hp-dynamics-ui main > :is(#how-it-works, #before-after, #benefits, #modules, #apps, #solutions, #testimonials, #resources, #demo-register, #home-faq, #partner-register) {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }
    html:root body.hp-home-page #proof .hp-sx-stat:nth-child(odd) { border-left: 0 !important; }
}

/* ===== 15. Fixes found in QA pass ===== */
/* main showed cream (#f3f2f1) through the gaps between sections */
html:root body.hp-home-page.hp-dynamics-ui main {
    background: var(--c-surface) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#resources, #streamline, #testimonials, #onboarding, #proof) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > #streamline {
    padding-top: clamp(2.5rem, 5vw, 3.5rem) !important;
}
/* inputs: id-scoped rules elsewhere tinted them beige */
html:root body.hp-home-page.hp-dynamics-ui main :is(#demo-register, #partner-register) .demo-form :is(input, select, textarea) {
    background: #fff !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 8px !important;
}
/* heading underline: one short gold rule instead of the blue→pink gradient */
html:root body.hp-home-page.hp-dynamics-ui main h2::after {
    background: var(--c-gold) !important;
    background-image: none !important;
}

/* ===== 16. Footer "Ready to digitize" band: removed on the home page (demo form sits right above) ===== */
html:root body.hp-home-page .hp-footer-cta {
    display: none !important;
}

/* ===== 17. Top ticker (home): taller, larger text. Per-item chip spacing lives in includes/home_ticker.php ===== */
html:root body.hp-home-page .hp-ticker {
    min-height: 44px !important;
    background: #0b1f3a !important;
}
html:root body.hp-home-page .hp-ticker .hp-ticker-inner {
    min-height: 44px !important;
    align-items: center !important;
}
html:root body.hp-home-page .hp-ticker .hp-ticker-text {
    font-size: .875rem !important;
    font-weight: 500 !important;
    letter-spacing: .01em !important;
    line-height: 44px !important;
    color: rgba(255, 255, 255, .92) !important;
}
html:root body.hp-home-page .hp-ticker .hp-ticker-badge {
    font-size: .75rem !important;
    padding: .4rem .85rem !important;
    border-radius: 6px !important;
    background: #c4a35a !important;
    color: #0b1f3a !important;
    border: 0 !important;
    font-weight: 700 !important;
}
@media (max-width: 640px) {
    html:root body.hp-home-page .hp-ticker,
    html:root body.hp-home-page .hp-ticker .hp-ticker-inner { min-height: 38px !important; }
    html:root body.hp-home-page .hp-ticker .hp-ticker-text { font-size: .8125rem !important; line-height: 38px !important; }
}

/* ===== 18. Recognitions logo strip: running marquee, uniform tiles ===== */
/* hp-head-assets.php's critical CSS set animation:none on desktop; restart it here */
html:root body.hp-home-page #partners.hp-partners {
    background: var(--c-alt) !important;
    border-top: 1px solid var(--c-line);
    padding: clamp(3rem, 6vw, 4.5rem) 0 !important;
}
html:root body.hp-home-page #partners .hp-partners-decor { display: none !important; }
html:root body.hp-home-page #partners .hp-partners-kicker {
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    color: var(--c-royal) !important;
    font: 700 .75rem/1.4 var(--c-font) !important;
    letter-spacing: .14em !important;
    text-transform: uppercase;
}
html:root body.hp-home-page #partners h3 {
    font: 700 clamp(1.6rem, 2.4vw + .4rem, 2.25rem)/1.2 var(--c-font) !important;
    color: var(--c-ink) !important;
    letter-spacing: -.02em !important;
}
html:root body.hp-home-page #partners .hp-partners-head p:not(.hp-partners-kicker) {
    color: var(--c-body) !important;
}
html:root body.hp-home-page #partners .hp-partners-fade--left {
    width: 6rem !important;
    background: linear-gradient(90deg, var(--c-alt), rgba(246, 248, 251, 0)) !important;
}
html:root body.hp-home-page #partners .hp-partners-fade--right {
    width: 6rem !important;
    background: linear-gradient(270deg, var(--c-alt), rgba(246, 248, 251, 0)) !important;
}
html:root body.hp-home-page #partners .hp-partners-scroll-container {
    overflow: hidden !important;
    padding: .75rem 0 !important;
}
html:root body.hp-home-page #partners .hp-partners-scroll {
    display: flex !important;
    gap: 0 !important;                 /* spacing via margin so the -50% loop is seamless */
    width: max-content !important;
    opacity: 1 !important;
    filter: none !important;
    animation: hp-corp-logos 38s linear infinite !important;
}
html:root body.hp-home-page #partners .hp-partners-scroll-wrap:hover .hp-partners-scroll {
    animation-play-state: paused !important;
}
@keyframes hp-corp-logos {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(-50%, 0, 0); }
}
html:root body.hp-home-page #partners .hp-partners-logo {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 188px !important;
    height: 96px !important;
    margin: 0 20px 0 0 !important;
    padding: 14px 20px !important;
    box-sizing: border-box !important;
    background: #fff !important;
    border: 1px solid var(--c-line) !important;
    border-radius: var(--c-radius) !important;
    box-shadow: var(--c-shadow) !important;
    opacity: 1 !important;
    filter: none !important;
    transition: box-shadow .2s ease, transform .2s ease;
}
html:root body.hp-home-page #partners .hp-partners-logo:hover {
    box-shadow: var(--c-shadow-hover) !important;
    transform: translateY(-2px);
}
html:root body.hp-home-page #partners .hp-partners-logo img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 64px !important;
    object-fit: contain !important;
    opacity: 1 !important;
    filter: none !important;
}
@media (max-width: 640px) {
    html:root body.hp-home-page #partners .hp-partners-logo {
        width: 148px !important;
        height: 80px !important;
        margin-right: 14px !important;
    }
    html:root body.hp-home-page #partners .hp-partners-logo img { max-height: 52px !important; }
    html:root body.hp-home-page #partners .hp-partners-scroll { animation-duration: 28s !important; }
}
@media (prefers-reduced-motion: reduce) {
    html:root body.hp-home-page #partners .hp-partners-scroll { animation: none !important; }
    html:root body.hp-home-page #partners .hp-partners-scroll-container { overflow-x: auto !important; }
}

/* ===== 19. Header type: larger, more presence (scales with screen, fits 1024px) ===== */
@media (min-width: 901px) {
    html:root body.hp-home-page #siteHeader .hp-header-inner {
        min-height: 78px !important;
    }
    html:root body.hp-home-page #siteHeader .hp-logo-name {
        font-size: clamp(19px, .35vw + 15px, 23px) !important;
        line-height: 1.15 !important;
        color: var(--c-navy) !important;
    }
    html:root body.hp-home-page #siteHeader .hp-logo-tag {
        font-size: clamp(10px, .1vw + 9px, 11.5px) !important;
        letter-spacing: .14em !important;
    }
    html:root body.hp-home-page #siteHeader :is(.hp-nav-link-top, .hp-nav-cluster-toggle) {
        font-size: clamp(13.5px, .36vw + 9.8px, 16px) !important;
        font-weight: 600 !important;
        padding: .5rem clamp(.5rem, .45vw, .85rem) !important;
        color: var(--c-ink) !important;
    }
    html:root body.hp-home-page #siteHeader .hp-nav-utility .hp-btn {
        font-size: clamp(13px, .3vw + 9.5px, 15px) !important;
        font-weight: 600 !important;
        min-height: 42px !important;
        padding: .55rem clamp(.75rem, .7vw, 1.15rem) !important;
    }
    html:root body.hp-home-page #siteHeader .hp-logo-mark--img {
        height: 48px !important;
        max-height: 48px !important;
        max-width: 72px !important;
    }
}

/* ===== 20. Certifications cards (#resources): bigger logos, equal cards, pinned links ===== */
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-panels--triple {
    align-items: stretch !important;
    gap: 1.25rem !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card {
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
    transform: none !important;
    overflow: hidden !important;
    border-top: 3px solid var(--c-navy) !important;
    padding: 0 !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card:hover {
    transform: translateY(-3px) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-visual {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 150px !important;
    min-height: 150px !important;
    margin: 0 !important;
    padding: 1.25rem 1.5rem !important;
    background: #fff !important;
    border-radius: 0 !important;
    border-bottom: 1px solid var(--c-line) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-visual img {
    width: auto !important;
    height: auto !important;
    max-width: 75% !important;
    max-height: 104px !important;
    object-fit: contain !important;
    mix-blend-mode: multiply;      /* drops the grey box baked into the MSME / DPIIT files */
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-body {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    padding: 1.4rem 1.5rem 1.5rem !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-label {
    align-self: flex-start !important;
    margin: 0 0 .75rem !important;
    padding: .25rem .6rem !important;
    border-radius: 6px !important;
    background: #eef3fb !important;
    color: var(--c-royal) !important;
    font: 700 .7rem/1.3 var(--c-font) !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-body h3 {
    margin: 0 0 .5rem !important;
    font: 700 1.2rem/1.3 var(--c-font) !important;
    color: var(--c-ink) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-body > p:not(.hp-dyn-resource-label) {
    margin: 0 0 1.25rem !important;
    font: 400 .975rem/1.6 var(--c-font) !important;
    color: var(--c-body) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-link {
    margin-top: auto !important;                 /* links line up across the three cards */
    padding-top: 1rem !important;
    border-top: 1px solid var(--c-line) !important;
    display: flex !important;
    align-items: center !important;
    gap: .6rem !important;
    font: 600 .95rem/1.2 var(--c-font) !important;
    color: var(--c-navy) !important;
    text-decoration: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-chevron {
    display: inline-grid !important;
    place-items: center !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    background: var(--c-navy) !important;
    color: #fff !important;
    font-size: .7rem !important;
    transition: transform .2s ease;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-link:hover .hp-dyn-resource-chevron {
    transform: translateX(3px);
}

/* ===== 21. Final pass ===== */
/* Hero: wider copy column so both CTAs and the credential chips sit on one line each */
@media (min-width: 1025px) {
    html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero .hp-dyn-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important;
        gap: clamp(2rem, 4vw, 4rem) !important;
        align-items: center !important;
    }
    html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero .hp-dyn-hero-copy {
        max-width: 600px !important;
    }
    html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero .hp-hero-desc {
        max-width: 52ch !important;
    }
    html:root body.hp-home-page .hp-sx-hero-cta { flex-wrap: nowrap; }
}
html:root body.hp-home-page.hp-dynamics-ui #home .hp-hero-video-el {
    background: var(--c-navy);
    object-fit: cover;
}

/* "Learn how school ERP can streamline your campus" only pointed at the demo form directly below it */
html:root body.hp-home-page.hp-dynamics-ui main > #streamline {
    display: none !important;
}

/* FAQ: corporate accordion */
html:root body.hp-home-page.hp-dynamics-ui main > #home-faq .container {
    max-width: 880px !important;
    margin: 0 auto !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-page-section-head {
    text-align: center;
    margin-bottom: 2rem;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-list {
    display: grid;
    gap: .75rem;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item {
    padding: 0 !important;
    overflow: hidden;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item summary {
    position: relative;
    display: block;
    padding: 1.15rem 3.5rem 1.15rem 1.35rem !important;
    list-style: none;
    cursor: pointer;
    font: 600 1.05rem/1.45 var(--c-font) !important;
    color: var(--c-ink) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item summary::-webkit-details-marker { display: none; }
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 1.15rem;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    margin-top: -14px;
    border-radius: 6px;
    background: var(--c-alt);
    color: var(--c-royal);
    font: 600 1.15rem/1 var(--c-font);
    transition: transform .2s ease, background-color .2s ease;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item[open] summary::after {
    content: "−";
    background: var(--c-navy);
    color: #fff;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item[open] {
    border-color: #c7d4ea !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item p {
    margin: 0 !important;
    padding: 0 1.35rem 1.25rem !important;
    font: 400 1rem/1.65 var(--c-font) !important;
    color: var(--c-body) !important;
}
html:root body.hp-home-page.hp-dynamics-ui #home-faq .hp-faq-item summary:focus-visible {
    outline: 3px solid rgba(26, 74, 140, .25);
    outline-offset: -3px;
}

/* ===== 22. Certification cards: no action links (cards are proof, not CTAs) ===== */
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-link {
    display: none !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card-body > p:not(.hp-dyn-resource-label) {
    margin-bottom: 0 !important;
}
html:root body.hp-home-page.hp-dynamics-ui #resources .hp-dyn-resource-card:hover {
    transform: none !important;
}

/* ===== 23. Light colour backgrounds (trial) — soft blue + warm ivory, alternating.
   Delete this block to go back to plain white / grey. ===== */
:root {
    --c-tint-blue: #eef4fc;
    --c-tint-ivory: #fbf7ee;
}
html:root body.hp-home-page.hp-dynamics-ui #home.hp-dyn-hero {
    background:
        radial-gradient(60% 80% at 100% 0%, rgba(196, 163, 90, .14), transparent 60%),
        linear-gradient(180deg, #f5f9ff 0%, var(--c-tint-blue) 100%) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#before-after, #modules, #testimonials, #partner-register) {
    background: var(--c-tint-blue) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#apps, #resources) {
    background: var(--c-tint-ivory) !important;
}
html:root body.hp-home-page.hp-dynamics-ui main > :is(#how-it-works, #benefits, #solutions, #demo-register, #home-faq) {
    background: #ffffff !important;
}
html:root body.hp-home-page #partners.hp-partners {
    background: var(--c-tint-ivory) !important;
}
html:root body.hp-home-page #partners .hp-partners-fade--left {
    background: linear-gradient(90deg, var(--c-tint-ivory), rgba(251, 247, 238, 0)) !important;
}
html:root body.hp-home-page #partners .hp-partners-fade--right {
    background: linear-gradient(270deg, var(--c-tint-ivory), rgba(251, 247, 238, 0)) !important;
}
/* before/after rows were pink/green on grey — keep them crisp on the blue tint */
html:root body.hp-home-page #before-after .hp-sx-ba-row > .hp-sx-ba-before { background: #fff6f4 !important; }
html:root body.hp-home-page #before-after .hp-sx-ba-row > .hp-sx-ba-after  { background: #effbf5 !important; }