body.page-id-288471 .product-subcard-widget.bg-30 .product-button-group__link--text {
    text-decoration: underline !important;
}
body.page-id-288471 .product-subcard-widget.bg-30 .product-button-group__link--icon {
    display: inline-block;
    text-decoration: none;
}

body.page-id-288471 .decorated-container-inner .decorated-container-wrapper,
body.page-id-288471 .decorated-container-inner .decorated-container-wrapper .decorated-container {
    background: #fff !important;
}
body.page-id-288471 .decorated-container-inner .decorated-container-square-overlay {
    display: none !important;
}

body.page-id-288471 .decorated-container-inner .decorated-container-heading__over-title,
body.page-id-288471 .decorated-container-inner .decorated-container-heading__over-title * {
    background: none !important;
    -webkit-text-fill-color: #0b1b45 !important;
    color: #0b1b45 !important;
}

body.page-id-288471 .redesign-styles__title,
body.page-id-288471 .redesign-styles__title * {
    color: #0b1b45 !important;
    font-family: Kurdis, "Kurdis Wide", Inter, sans-serif !important;
    font-weight: 700 !important;
}

body.page-id-288471 .redesign-styles__heading,
body.page-id-288471 .redesign-styles__heading * {
    color: #0b1b45 !important;
    font-family: Kurdis, "Kurdis Wide", Inter, sans-serif !important;
    font-weight: 700 !important;
    font-size: 24px !important;
    line-height: 32px !important;
    letter-spacing: 0 !important;
}
body.page-id-288471 .decorated-container .redesign-styles__heading,
body.page-id-288471 .decorated-container .redesign-styles__heading * {
    color: #2722f8 !important;
    font-family: Inter, sans-serif !important;
    font-weight: 700 !important;
    font-size: 24px !important;
    line-height: 32px !important;
    letter-spacing: 0 !important;
}

body.page-id-288471 #app .basic-br:not(.jtl-box--blue) {
    background: #ffffff !important;
    border: 0 !important;
    border-radius: 24px !important;
    box-shadow: none !important;
}
body.page-id-288471 #app .decorated-container .basic-br:not(.jtl-box--blue) {
    background: #eeeee7 !important;
    box-shadow: none !important;
}
body.page-id-288471 .basic-br,
body.page-id-288471 .basic-br p,
body.page-id-288471 .basic-br span,
body.page-id-288471 .basic-br strong,
body.page-id-288471 .basic-br li {
    color: #0b1b45 !important;
}
body.page-id-288471 .basic-br [class*="fa-"] {
    color: #2722f8 !important;
}

body.page-id-288471 .list-widget__item--icon,
body.page-id-288471 .decorated-container .list-widget .fa-arrow-right,
body.page-id-288471 .product-management-section .list-widget .fa-arrow-right,
body.page-id-288471 [style*="#814FF0"],
body.page-id-288471 [style*="#814ff0"] {
    color: #2722f8 !important;
}

body.page-id-288471 .toc-widget.purple-scheme,
body.page-id-288471 .toc-widget-scroll-to-top.purple-scheme {
    --toc-widget-primary-color: #2722f8;
    --toc-widget-secondary-color: #89d2ff;
    --toc-widget-stt-primary-color: #2722f8;
}
body.page-id-288471 .anchor-navigation-tabs.purple-scheme {
    --an-widget-primary-color: #2722f8;
    --an-widget-secondary-color: #89d2ff;
}

/* The page now renders from an Elementor document, whose own colour choices are
   author-set per element and must not be repainted by this page-wide default -
   the download panel's white copy on the navy card is the case that showed it.
   The exclusion is inert on a legacy render, where there is no Elementor
   subtree, so the rule keeps working unchanged for that markup. */
body.page-id-288471 #app :is(p, li, strong, b, em, dd, dt, td, th,
    figcaption, .figure-caption, .product-button-group__link--text):not(.elementor *) {
    color: #0b1b45 !important;
}

body.page-id-288471 #app .basic-br.themenwelten-last-card {
    background: #89d2ff !important;
    border: 0 !important;
    border-radius: 46px !important;
    box-shadow: none !important;
}
body.page-id-288471 .basic-br.themenwelten-last-card,
body.page-id-288471 .basic-br.themenwelten-last-card .redesign-styles__subtitle,
body.page-id-288471 .basic-br.themenwelten-last-card .product-button-group__link--text,
body.page-id-288471 .basic-br.themenwelten-last-card .product-button-group__link--icon {
    color: #0b1b45 !important;
}

body.page-id-288471 .basic-br.themenwelten-last-card .product-button-group__link--text {
    text-decoration: underline !important;
    text-underline-position: from-font;
}
body.page-id-288471 .basic-br.themenwelten-last-card .product-button-group__link--icon {
    text-decoration: none !important;
    margin-left: 8px;
}

body.page-id-288471 .decorated-container-wrapper:has(.product-button-group__button--with-icon),
body.page-id-288471 .decorated-container-wrapper:has(.product-button-group__button--with-icon) .decorated-container {
    background: #0b1b45 !important;
}

body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title *,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) p,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) li,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) strong,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) b,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .list-widget__item--rte,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) span:not([class*="product-button-group__button"]),
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) figcaption {
    color: #ffffff !important;
}

body.page-id-288471 .decorated-container-wrapper:has(.product-button-group__button--with-icon) .list-widget__item--icon,
body.page-id-288471 .decorated-container-wrapper:has(.product-button-group__button--with-icon) [class*="fa-"]:not(.product-button-group__link--icon) {
    color: #89d2ff !important;
}

body.page-id-288471 #app .decorated-container .row:has(img) {
    /* Was `align-items: center` — it vertically-centred the checklist copy against
       the taller diagram. Removed so the copy top-aligns beside the diagram. */
}

body.page-id-288471 #app .decorated-container-wrapper,
body.page-id-288471 #app .decorated-container-wrapper .decorated-container {
    border-radius: 46px !important;
}

body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title * {
    font-family: Inter, sans-serif !important;
    font-size: 32px !important;
    line-height: 38px !important;
    letter-spacing: 0 !important;
}

/* JP-1374: this heading is split-weight by design - a regular base with only
   "Shopsystem-Checkliste" bold ("Die *Shopsystem-Checkliste* zum Download", and
   its EN twin "Download the *store system checklist*"). The editor marks that
   word up and the widget emits it as <span class="font-weight-bold">, but the
   font-weight:400 that used to sit in the rule above applied to the title AND
   every descendant, so it flattened that span too and the heading read as one
   uniform weight. Family/size/line-height still cascade to the span - only the
   WEIGHT must stop at the title, which is why it is split out here.

   The other six section headings on this page are fully bold by design, so the
   regular base stays confined to this box: the one .decorated-container-wrapper
   on the page carrying a CTA button. That hook is structural and identical on
   both twins, so this covers DE and EN (they share the page-id). */
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title {
    font-weight: 400 !important;
}

body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title .font-weight-bold,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .redesign-styles__title strong {
    font-weight: 700 !important;
}

body.page-id-288471 .product-subcard-widget.right-aligned {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* JP-1069: the second selector here is meant for the arrow BULLETS of prose
   lists. The "Weitere Infos & Ueberblick zum Thema Shopsystem" card authors its
   CTAs as list-widget items, so each CTA's own arrow
   (.product-button-group__link--icon) also sat inside a .list-widget and was
   swept up by it. At (1,3,1) that outranked the rule above which names those
   arrows navy explicitly at (0,4,1) - both !important, so specificity decided.
   Excluding the CTA arrow lets that navy declaration apply. Same idiom as the
   dark-container rule further up; the dark-container rule below keeps its
   light-blue arrows deliberately, which is correct on a navy background. */
body.page-id-288471 #app .list-widget__item--icon i,
body.page-id-288471 #app .list-widget .fa-arrow-right:not(.product-button-group__link--icon) {
    color: #2722f8 !important;
}
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .list-widget__item--icon i,
body.page-id-288471 #app .decorated-container-wrapper:has(.product-button-group__button--with-icon) .list-widget .fa-arrow-right {
    color: #89d2ff !important;
}

/* Two purple bands drop their top padding:
     of-type(3) "So gehst du bei der Auswahl eines Shopsystems vor"
     of-type(7) "Technische, rechtliche & Sicherheitsaspekte"

   The sections' .container inherits `section > .container { padding-top: 4rem }`
   from the theme (app.css:76107, inside the >=576px media query, no !important).
   A page-scoped selector at (1,2,2) beats that (0,1,1) outright, so no !important
   is needed here.

   Keyed by :nth-of-type, NOT the nth-child(4)/nth-child(8) of the original report:
   WPBakery emits inline <style> siblings between the sections, so #content has 13
   children for 11 sections and the nth-child index shifts whenever those styles
   move. The section-1570 class is also unsafe on its own - all four purple bands
   share it, and WPBakery renumbers that id on editor save.

   The page's two other .purple.section-1570 bands - of-type(5) "Systemtypen &
   Architektur" and of-type(9) "Die Shopsystem-Checkliste zum Download" - keep
   their padding deliberately.

   Verified: 2 matches on the DE page and 2 on its EN twin, leaving the page's
   other 9 section containers untouched. Both twins carry page-id-288471. */
body.page-id-288471 #content > section.purple.section-1570:nth-of-type(3) > div.container,
body.page-id-288471 #content > section.purple.section-1570:nth-of-type(7) > div.container {
    padding-top: 0;
}

/* Closing "Weitere Infos & Überblick zum Thema Shopsystem" band - drop its top
   padding. This is the last section on the page.

   Same inherited source as the two purple bands above: the theme's
   `section > .container { padding-top: 4rem }` (app.css:76107, >=576px, no
   !important), so the page-scoped selector wins on specificity alone.

   A separate block rather than another selector on the rule above, because this is
   a different section family - .product-management-section.purple, not
   .purple.section-1570 - and the page has four more bands in that family whose
   padding must not change.

   :last-of-type, not the nth-child(13) of the original report and not
   nth-of-type(11): the nth-child index shifts with WPBakery's inline <style>
   siblings, and a hard type index would silently move onto the wrong band if a
   section is ever added. :last-of-type also survives footer.php appending overlay
   <div>s inside main#content, which would break :last-child.

   Verified: 1 match on the DE page and 1 on its EN twin, resolving to this band in
   both. Both twins carry page-id-288471. */
body.page-id-288471 #content > section.product-management-section.purple:last-of-type > div.container {
    padding-top: 0;
}