/* Staging QA sweep, 2026-11-02. Design 3.1 corrections only.
 * Kept separate from design.css while the legacy-demo patch is uncommitted.
 * No content, links or redirect destinations are changed here.
 */
/* The same stale sage-on literals also occur in the native Kaufen/Tutorial
 * layouts; their existing section structure and content stay untouched. */
body.postid-4373 #page-container :is(.et_pb_text_34,.et_pb_text_35,.et_pb_text_36,.et_pb_text_38,.et_pb_text_39,.et_pb_text_41,.et_pb_text_42,.et_pb_text_44,.et_pb_text_45) p,
body.page-id-4462 #page-container :is(.et_pb_text_43,.et_pb_text_44) p {
  color: var(--dw-sage-on) !important;
}

/* Native plugin outputs need child selectors rather than builder attributes. */
body #page-container .et_pb_post_content a,
body #page-container .et_pb_post_content code {
  overflow-wrap: anywhere;
}
body #page-container .et_pb_post_content code {
  white-space: pre-wrap;
}
body #page-container .enlighter-default,
body #page-container .enlighter-default .enlighter-code {
  max-width: 100%;
  overflow-x: auto !important;
}
body #page-container .et-box.et-warning .et-box-content {
  color: var(--dw-ink) !important;
  background-color: var(--dw-sand) !important;
}
/* Existing shared confirmation blurb is sand but still declares dark layout. */
body:is(.page-id-3938,.page-id-3945,.page-id-3971,.page-id-6115) #page-container .et_pb_blurb.et_pb_bg_layout_dark :is(.et_pb_module_header,.et_pb_blurb_description,.et_pb_blurb_description span) {
  color: var(--dw-ink) !important;
}
/* Fluent Forms legacy orange/green submit buttons predate the 3.1 palette.
 * Primary controls use ink/cream; no behavior or submission settings change. */
body #page-container .fluentform .ff-btn-submit {
  background: var(--dw-ink) !important;
  border-color: var(--dw-ink) !important;
  color: var(--dw-creme) !important;
  font-family: "DM Sans", sans-serif !important;
}
body #page-container .fluentform .ff-btn-submit:hover {
  background: #3d2b22 !important;
}
body #page-container .fluentform a {
  color: var(--dw-clay-dark) !important;
}
/* Old news feature headings remain editable; ink is required on their light
 * legacy color panels. A new layout for these old landing pages is not invented. */
body.postid-4805 #page-container .et_pb_blurb :is(.et_pb_module_header,.et_pb_blurb_description),
body.postid-4805 #page-container .et_pb_text:not(.et_pb_text_26):not(.et_pb_text_27) :is(h2,h3,h4),
body.page-id-3022 #page-container .et_pb_number_counter .percent,
body.page-id-3022 #page-container .et_pb_number_counter .percent :is(p,span) {
  color: var(--dw-ink) !important;
}

/* Artboard readback: Main hero is a 1440 band; Blog featured image precedes
 * copy; Kaufen price cards stretch to a common baseline; Test score max 460. */
body.blog #page-container .dw-featured .et_pb_post {
  grid-template-areas: "image" "title" "meta" "excerpt";
  background: var(--dw-sand);
  border-radius: 32px;
  padding: 20px;
}
@media (min-width: 981px) {
  body.home #page-container .et_pb_section_0 > .et_pb_row_0 {
    max-width: 1440px !important;
    width: 100% !important;
  }
  body.blog #page-container .dw-featured .et_pb_post {
    grid-template-areas: "image ." "image title" "image meta" "image excerpt" "image .";
    background: var(--dw-sand);
    border-radius: 32px;
    padding: 20px;
    column-gap: 40px;
  }
  body.postid-4373 #page-container .et_pb_row_2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: stretch;
  }
  body.postid-4373 #page-container .et_pb_row_2 > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
    height: auto !important;
  }
  body.postid-7001 #page-container .dw-score-card {
    width: 100%;
    max-width: 460px;
    margin-left: auto !important;
    align-self: center;
  }
}
/* The new sidebar/mobile TOCs already cover the same anchors. Do not show the
 * old auto-inserted Table of Contents Plus control a second time in articles. */
body.single-post #page-container .et_pb_post_content #toc_container {
  /* TOC+ writes display:table inline after load; retain the native sidebar TOC. */
  display: none !important;
}

/* Existing webcast white-surface copy and native orange CTAs: use the same
 * ink/text roles as every other surface. Gradient/banner art stays untouched. */
body.page-id-6123 #page-container .et_pb_text_29 h2,
body.page-id-6123 #page-container .et_pb_blurb .et_pb_module_header,
body #page-container .fluentform :is(h2,h3) {
  color: var(--dw-ink) !important;
}
body.page-id-6123 #page-container .et_pb_text_30 p,
body.page-id-6123 #page-container .et_pb_blurb .et_pb_blurb_description {
  color: var(--dw-text, #4a423f) !important;
}
body.page-id-6123 #page-container :is(.et_pb_button_9,.et_pb_button_10) {
  background: var(--dw-ink) !important;
  color: var(--dw-creme) !important;
  border-color: var(--dw-ink) !important;
}

/* Thrive's embedded legacy signup forms are separate from Fluent Forms. */
body #page-container .tve-leads-conversion-object #tve_editor .tve_lg_submit button,
body #page-container .tve-leads-conversion-object #tve_editor .tve-form-button .tcb-button-link {
  background: var(--dw-ink) !important;
  border-color: var(--dw-ink) !important;
}
body #page-container .tve-leads-conversion-object #tve_editor .tve_lg_submit button span,
body #page-container .tve-leads-conversion-object #tve_editor .tve-form-button :is(.tcb-button-text,.tcb-button-texts) {
  color: var(--dw-creme) !important;
  font-family: "DM Sans", sans-serif !important;
}
body #page-container .tve-leads-conversion-object #tve_editor .thrv_text_element a {
  color: var(--dw-clay-dark) !important;
}
body #page-container .tve-leads-conversion-object #tve_editor .thrv_text_element :is(h2,h3) {
  color: var(--dw-ink) !important;
}

/* Earlier 3.1 attrs were still overridden by pre-3.1 child CSS (72/88/92px
 * H1 and 34/26px section headings). Enforce the approved semantic scale. */
body #page-container #main-content h1 {
  font-size: 64px !important;
  line-height: 1 !important;
  letter-spacing: -0.045em !important;
}
body.home #page-container #main-content h1 {
  font-size: 96px !important;
  line-height: 0.95 !important;
  letter-spacing: -0.05em !important;
}
body #page-container .et_pb_heading h2 {
  font-size: 44px !important;
  line-height: 1.05 !important;
  letter-spacing: -0.04em !important;
}
body #page-container .et_pb_heading h3 {
  font-size: 24px !important;
  line-height: 1.2 !important;
  letter-spacing: -0.03em !important;
}
body #page-container .et_pb_post_content h2:not(.et_pb_module_header) {
  font-size: 30px !important;
  line-height: 1.15 !important;
}
body #page-container .dw-score__number {
  font-size: 60px !important;
  line-height: 0.8 !important;
}
@media (max-width: 767px) {
  body #page-container #main-content h1 { font-size: 36px !important; }
  body.home #page-container #main-content h1 { font-size: 48px !important; }
  body #page-container .et_pb_heading h2 { font-size: 32px !important; }
  body #page-container .et_pb_heading h3 { font-size: 20px !important; }
  body #page-container .et_pb_post_content h2:not(.et_pb_module_header) { font-size: 26px !important; }
  body #page-container .dw-score__number { font-size: 44px !important; }
}
@media (min-width: 981px) {
  body.postid-7001 #page-container .et_pb_row_0 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 48px;
  }
  body.postid-7001 #page-container .et_pb_row_0 > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
  body.postid-7001 #page-container .dw-score-card { justify-self: end; }
}

body.postid-4373 #page-container :is(.et_pb_text_4,.et_pb_text_11) p {
  font-size: 60px !important;
  line-height: 0.8 !important;
}
body.postid-4373 #page-container :is(.et_pb_text_4,.et_pb_text_11) p span {
  font-family: "DM Sans", sans-serif !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
}
@media (max-width: 767px) {
  body.postid-4373 #page-container :is(.et_pb_text_4,.et_pb_text_11) p { font-size: 44px !important; }
}

:root { --dw-sage-on: #f2fbf6; }

/* Divi's legacy pricing group is flex/nowrap. A width on children alone
 * shrinks all three cards into the phone column and clips their content. */
@media (max-width: 767px) {
  body #page-container .et_pb_pricing_tables {
    flex-wrap: wrap !important;
  }
  body #page-container .et_pb_pricing_tables .et_pb_pricing_table {
    flex: 0 0 100% !important;
    min-width: 0;
  }
}

/* Tip labels on sage-light must be ink, not sage (4.0:1). */
body #page-container .et_pb_post_content .et_pb_alert .et_pb_alert_heading,
body #page-container .et_pb_post_content .rank-math-notice strong,
body #page-container .et_pb_post_content .wp-block-alert strong,
body #page-container .et_pb_post_content .et-box.et-info .et-box-content em {
  color: var(--dw-ink) !important;
}

/* Existing sage blocks use two pre-3.1 almost-white literals. Match the
 * sage-on token without changing the buttons nested in those blocks. */
body #page-container .dw-sidebar .et_pb_group_1_tb_body .et_pb_text,
body #page-container .dw-sidebar .et_pb_group_1_tb_body .et_pb_text p,
body.postid-7001 #page-container .et_pb_text_21,
body.postid-7001 #page-container .et_pb_text_21 p,
body.postid-7001 #page-container .et_pb_text_22,
body.postid-7001 #page-container .et_pb_text_22 p,
body.home #page-container .dw-sage-copy .et_pb_text,
body.home #page-container .dw-sage-copy .et_pb_text p {
  color: var(--dw-sage-on) !important;
}

/* Design 3.1 code token: IBM Plex Mono 15, cream on ink; comments sage-light.
 * Enlighter otherwise imposes 12px and low-contrast teal numeric tokens. */
body #page-container .enlighter-default,
body #page-container .enlighter-default div,
body #page-container .enlighter-default span {
  font-family: "IBM Plex Mono", monospace !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: var(--dw-creme) !important;
  background-color: var(--dw-ink) !important;
}
body #page-container .enlighter-default .enlighter-c0,
body #page-container .enlighter-default .enlighter-c1 {
  color: var(--dw-sage-light) !important;
}

/* ---------------------------------------------------------------------------
 * V1 (2026-11-03): homepage against artboard Main (desktop) and Mobil 03.
 * Values are the artboard's own: hero 32/96 with a balanced 20ch display
 * line and a 40ch lead on the same 1440 rail; sections 96/64/64/64 apart on
 * the 1280 rail; path cards 32 padding/32 radius; sage band inset to 1216
 * with a 4:3 visual; comparison header one continuous ink band.
 */
body.home #page-container .et_pb_section_0 .et_pb_heading_0 h1 {
  max-width: 20ch;
  text-wrap: balance;
}
body.home #page-container .et_pb_section_0 .et_pb_heading_0 {
  padding-bottom: 32px !important;
}
body.home #page-container .et_pb_section_0 .et_pb_text_0 {
  max-width: 40ch !important;
}
/* Rows turned into flex/grid containers: Divi's clearfix pseudo-elements
 * would otherwise become an extra item (gap) or an extra grid row. */
body.home #page-container :is(.dw-path-cards, .dw-sage-block)::before,
body.home #page-container :is(.dw-path-cards, .dw-sage-block)::after {
  display: none !important;
}
body.home #page-container .dw-path-cards > .et_pb_column .et_pb_button_module_wrapper:last-child,
body.home #page-container .dw-path-cards > .et_pb_column > .et_pb_button:last-child {
  margin-top: auto !important;
}
/* Comparison table (Main): ink header band, sand Divi column, line rules,
 * one rounded frame around the local scroll container. */
body #page-container .dw-compare .et_pb_text_inner:has(> .dw-table) {
  border: 1px solid var(--dw-line);
  border-radius: 24px;
  overflow-x: auto;
}
body #page-container .dw-table {
  border: 0 !important;
  margin: 0 !important;
}
body #page-container .dw-table thead tr {
  background: var(--dw-ink);
}
body #page-container .dw-table thead th,
body #page-container .dw-table thead th.dw-table__hero {
  background: var(--dw-ink) !important;
  color: var(--dw-creme) !important;
  font-family: "IBM Plex Mono", ui-monospace, monospace !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  line-height: normal !important;
  text-transform: uppercase !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body #page-container .dw-table tbody th,
body #page-container .dw-table tbody td {
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body #page-container .dw-table tbody tr {
  border-top: 1px solid var(--dw-line);
}
body #page-container .dw-table tbody .dw-table__hero {
  background: var(--dw-sand) !important;
}
@media (min-width: 981px) {
  body.home #page-container .et_pb_section_0 > .et_pb_row_1 {
    max-width: 1440px !important;
    width: 100% !important;
    margin: 0 !important;
  }
  body.home #page-container .et_pb_section_0 > .dw-marquee {
    margin-top: 96px !important;
  }
  body.home #page-container .et_pb_section_1 {
    padding-top: 96px !important;
    padding-bottom: 0 !important;
  }
  body.home #page-container .et_pb_section_1 > .et_pb_row_3 {
    display: flex !important;
    align-items: flex-end;
    justify-content: space-between;
    gap: 48px;
    margin-bottom: 32px !important;
  }
  body.home #page-container .et_pb_section_1 > .et_pb_row_3::before,
  body.home #page-container .et_pb_section_1 > .et_pb_row_3::after {
    display: none !important;
  }
  body.home #page-container .et_pb_section_1 > .et_pb_row_3 > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
  body.home #page-container .et_pb_section_1 > .et_pb_row_3 > .et_pb_column:last-child {
    max-width: 40ch;
    font-size: 21px;
  }
  /* Section leads use the lead token (21 px / 500) on desktop. */
  body.home #page-container :is(.et_pb_text_2, .et_pb_text_10, .et_pb_text_11),
  body.home #page-container :is(.et_pb_text_2, .et_pb_text_10, .et_pb_text_11) p {
    font-size: 21px !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
  }
  body.home #page-container .et_pb_text_11 {
    max-width: 62ch;
    padding-bottom: 32px !important;
  }
  body.home #page-container .et_pb_text_10 {
    max-width: 44ch;
  }
  body.home #page-container .dw-path-cards > .et_pb_column {
    flex: 1 1 0 !important;
    max-width: none !important;
    min-height: 320px;
    padding: 32px !important;
    border-radius: 32px !important;
  }
  body.home #page-container .et_pb_section_2 {
    padding: 64px 0 0 !important;
  }
  body.home #page-container .dw-sage-block {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 48px;
    align-items: center;
    max-width: 1216px !important;
    width: calc(100% - 64px) !important;
    margin: 0 auto !important;
  }
  body.home #page-container .dw-sage-block > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
  body.home #page-container .dw-sage-block .dw-shot img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: left top;
    border-radius: 24px;
  }
  body.home #page-container .dw-sage-block .dw-shot,
  body.home #page-container .dw-sage-block .dw-shot .et_pb_image_wrap {
    border-radius: 24px;
  }
  body.home #page-container .et_pb_section_3 {
    padding: 64px 0 0 !important;
  }
  body.home #page-container .et_pb_section_4 {
    padding: 64px 0 96px !important;
  }
}
@media (max-width: 767px) {
  body.home #page-container .et_pb_section_0 > .dw-marquee {
    margin-top: 40px !important;
  }
  body.home #page-container .et_pb_section_1 {
    padding-top: 56px !important;
  }
  body.home #page-container .dw-path-cards {
    gap: 16px !important;
  }
  body.home #page-container .dw-path-cards > .et_pb_column {
    margin-bottom: 0 !important;
  }
  body.home #page-container .dw-sage-block {
    padding: 28px 24px !important;
  }
}

/* ---------------------------------------------------------------------------
 * V2 (2026-11-03): archive template (/blog and category archives) against
 * artboard Blog (desktop) and Mobil 04. Hero 44/56 with intro and search on
 * one line; chips and count in one ruled band; featured card with meta above
 * the title and a visible "Beitrag lesen" action; grid cards meta-first.
 */
.et-l--body .et_pb_section:has(> .dw-archive-header-row) {
  padding-top: 44px !important;
  padding-bottom: 56px !important;
}
.et-l--body .dw-archive-header-row > .et_pb_column:first-child > .et_pb_module {
  margin-bottom: 0 !important;
}
.et-l--body .dw-archive-header-row .et_pb_text:not(.dw-search-pill) {
  max-width: 52ch;
}
/* Chip band: one row, chips left, count right, hairline below. */
.et-l--body .et_pb_section.dw-chips {
  padding: 0 !important;
  border-bottom: 1px solid var(--dw-line);
}
.et-l--body .dw-chips > .et_pb_row {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}
.et-l--body .dw-chips > .et_pb_row > .et_pb_column {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.et-l--body .dw-chips > .et_pb_row > .et_pb_column > .et_pb_module {
  margin: 0 !important;
  padding: 0 !important;
}
.et-l--body .dw-chips .et_pb_text:not(.dw-result-count-module) {
  order: 1;
  flex: 1 1 auto;
  min-width: 0;
}
.et-l--body .dw-chips .dw-result-count-module {
  order: 2;
  flex: 0 0 auto;
}
.et-l--body .dw-chips .dw-result-count {
  margin: 0;
  font-size: 14px;
  letter-spacing: 0.08em;
}
body #page-container .et-l--body .dw-chips .et_pb_text_inner > p {
  gap: 8px;
}
body #page-container .et-l--body .dw-chips a {
  min-height: 44px;
  padding: 0 16px !important;
  font-family: "DM Sans", sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
body.blog:not(.paged) #page-container .dw-chips a[href="/blog/"],
body.blog.paged #page-container .dw-chips a[href="/blog/"],
body.category-tutorial #page-container .dw-chips a[href="/category/tutorial/"],
body.category-tipps #page-container .dw-chips a[href="/category/tipps/"],
body.category-news #page-container .dw-chips a[href="/category/news/"],
body.category-plugins #page-container .dw-chips a[href="/category/plugins/"],
body.category-webcast #page-container .dw-chips a[href="/category/webcast/"] {
  background: var(--dw-ink);
  color: var(--dw-creme) !important;
}
/* Featured card. */
.et-l--body .et_pb_section.dw-featured {
  padding: 56px 0 0 !important;
}
body #page-container .et-l--body .dw-featured .et_pb_post {
  position: relative;
  background: var(--dw-sand);
  border-radius: 32px;
  padding: 20px;
  margin-bottom: 0 !important;
  grid-template-areas: "image" "meta" "title" "excerpt" "more";
  row-gap: 16px;
}
body #page-container .et-l--body .dw-featured .entry-featured-image-url { grid-area: image; }
body #page-container .et-l--body .dw-featured .post-meta { grid-area: meta; }
body #page-container .et-l--body .dw-featured .entry-title { grid-area: title; }
body #page-container .et-l--body .dw-featured .post-content { grid-area: excerpt; }
body #page-container .et-l--body .dw-featured .entry-title {
  margin: 0 !important;
  padding: 0 !important;
  text-wrap: balance;
}
body #page-container .et-l--body .dw-featured .post-content,
body #page-container .et-l--body .dw-featured .post-content p {
  font-size: 18px !important;
  line-height: 1.6 !important;
  max-width: 52ch;
}
/* Whole card opens the post; the action is drawn in the card's own grid. */
body #page-container .et-l--body .dw-featured .entry-title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: 32px;
}
body #page-container .et-l--body .dw-featured .entry-title a:focus-visible {
  outline: none;
}
body #page-container .et-l--body .dw-featured .entry-title a:focus-visible::after {
  outline: 2px solid var(--dw-ink);
  outline-offset: 3px;
}
body #page-container .et-l--body .dw-featured .post-meta a {
  position: relative;
  z-index: 2;
}
body #page-container .et-l--body .dw-featured .et_pb_post.clearfix::after {
  content: "Beitrag lesen \2192" !important;
  grid-area: more;
  justify-self: start;
  display: inline-block !important;
  visibility: visible !important;
  height: auto !important;
  clear: none !important;
  margin-top: 6px;
  padding: 14px 24px;
  border-radius: 999px;
  background: var(--dw-ink);
  color: var(--dw-creme);
  font-family: "DM Sans", sans-serif;
  font-size: 16px !important;
  font-weight: 700;
  line-height: 1.3;
  transition: background-color 150ms ease;
}
body #page-container .et-l--body .dw-featured .et_pb_post:hover {
  background: var(--dw-sand-hover);
}
body #page-container .et-l--body .dw-featured .et_pb_post:hover::after {
  background: #3d2b22;
}
/* Meta row (featured + grid): category chip first, then the date. Divi
 * prints "date | category"; the separator is a bare text node. */
body #page-container .et-l--body :is(.dw-featured, .dw-archive-grid) .post-meta {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 0 !important;
  margin: 0 !important;
}
body #page-container .et-l--body :is(.dw-featured, .dw-archive-grid) .post-meta > * {
  font-size: 14px;
}
body #page-container .et-l--body :is(.dw-featured, .dw-archive-grid) .post-meta .entry-categories {
  order: -1;
  display: inline-flex;
  gap: 8px;
}
/* Grid cards: image, meta, title, excerpt, 14 px apart (artboard Blog). */
body #page-container .et-l--body .dw-archive-grid .et_pb_post {
  display: flex !important;
  flex-direction: column;
  gap: 14px;
}
body #page-container .et-l--body .dw-archive-grid .et_pb_post > * {
  margin: 0 !important;
  padding-bottom: 0 !important;
}
body #page-container .et-l--body .dw-archive-grid .et_pb_image_container,
body #page-container .et-l--body .dw-archive-grid .entry-featured-image-url { order: 1; }
body #page-container .et-l--body .dw-archive-grid .post-meta { order: 2; }
body #page-container .et-l--body .dw-archive-grid .entry-title { order: 3; }
body #page-container .et-l--body .dw-archive-grid .post-content { order: 4; }
body #page-container .et-l--body .dw-archive-grid .et_pb_post::after { display: none !important; }
.et-l--body .et_pb_section:has(.dw-archive-grid) {
  padding-top: 64px !important;
}
@media (min-width: 981px) {
  .et-l--body .dw-archive-header-row {
    display: flex !important;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
  }
  .et-l--body .dw-archive-header-row::before,
  .et-l--body .dw-archive-header-row::after {
    display: none !important;
  }
  .et-l--body .dw-archive-header-row > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
  .et-l--body .dw-archive-header-row > .et_pb_column:first-child {
    flex: 1 1 auto;
  }
  .et-l--body .dw-archive-header-row > .et_pb_column:last-child {
    flex: 0 0 auto;
  }
  body #page-container .et-l--body .dw-featured .et_pb_post {
    grid-template-areas: "image ." "image meta" "image title" "image excerpt" "image more" "image .";
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto auto auto auto minmax(0, 1fr);
    column-gap: 40px;
    row-gap: 16px;
  }
  body #page-container .et-l--body .dw-featured .et_pb_post > :not(.entry-featured-image-url),
  body #page-container .et-l--body .dw-featured .et_pb_post::after {
    margin-left: 8px !important;
    margin-right: 32px !important;
  }
}
@media (max-width: 767px) {
  .et-l--body .et_pb_section.dw-chips {
    top: 68px;
  }
  .et-l--body .dw-chips > .et_pb_row > .et_pb_column {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }
  body #page-container .et-l--body .dw-chips a {
    height: 44px;
  }
  body #page-container .et-l--body .dw-featured .et_pb_post.clearfix::after {
    justify-self: stretch;
    text-align: center;
  }
  body #page-container .et-l--body .dw-featured .entry-title,
  body #page-container .et-l--body .dw-featured .entry-title a {
    font-size: 32px !important;
  }
}

/* ---------------------------------------------------------------------------
 * V3 Beitrag (article Theme Builder template), 2026-11-03. Artboard Beitrag:
 * hero inset 1000 (text column 936 at x 252), breadcrumb 22 above the H1,
 * 56 bottom; body 720 article + 64 gap + 320 aside, 22 between aside boxes.
 * Scope: single posts without their own builder layout (Test/Kaufen use one).
 */
body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body {
  padding-bottom: 56px !important;
}
body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body .et_pb_breadcrumbs {
  margin-bottom: 0 !important;
}
@media (min-width: 981px) {
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body > .et_pb_row_0_tb_body {
    max-width: 1000px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_1_tb_body {
    padding-top: 56px !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_row_1_tb_body > .et_pb_column_1_tb_body {
    width: 720px !important;
    margin-right: 64px !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_row_1_tb_body > .et_pb_column_2_tb_body {
    width: 320px !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_column_2_tb_body > .et_pb_module:not(:last-child) {
    margin-bottom: 22px !important;
  }
}

/* ---------------------------------------------------------------------------
 * V4 Tutorial (/divi-tutorial, page 4462), 2026-11-03. Artboard Tutorial:
 * H1 balanced at 787 max ("Die Divi Anleitung / auf Deutsch"), hero rhythm
 * 22 between breadcrumb, H1, lead and meta; chapters as a 594/594 grid with
 * 28 gap and the 1px dw-line rule on the 1216 content column, not full bleed.
 */
body.page-id-4462 #page-container .et_pb_section_0 .et_pb_breadcrumbs_0 {
  margin-bottom: 0 !important;
}
body.page-id-4462 #page-container .et_pb_section_0 .et_pb_heading_0 {
  padding-bottom: 22px !important;
}
body.page-id-4462 #page-container .et_pb_section_0 .et_pb_heading_0 h1 {
  max-width: 787px;
  text-wrap: balance;
}
body.page-id-4462 #page-container .et_pb_section_0 .et_pb_text_1 {
  padding-bottom: 30px !important;
}
body.page-id-4462 #page-container .dw-tutorial-chapter {
  border-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
body.page-id-4462 #page-container .dw-tutorial-chapter > .et_pb_row {
  width: calc(100% - 40px) !important;
  max-width: 1216px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 32px 0 !important;
  border-top: 1px solid var(--dw-line, #e7e0d9);
}
@media (min-width: 981px) {
  body.page-id-4462 #page-container .dw-tutorial-chapter > .et_pb_row {
    width: calc(100% - 64px) !important;
    padding: 40px 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 28px;
    align-items: start;
  }
  body.page-id-4462 #page-container .dw-tutorial-chapter > .et_pb_row::before,
  body.page-id-4462 #page-container .dw-tutorial-chapter > .et_pb_row::after {
    display: none !important;
  }
  body.page-id-4462 #page-container .dw-tutorial-chapter > .et_pb_row > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
}

/* ---------------------------------------------------------------------------
 * V5 Test (/divi-theme, post 7001), 2026-11-03. Artboard Test:
 * hero grid without the clearfix row (48 px too tall), breadcrumb 22 above
 * H1; strengths subline right of the H2, bottom-aligned, 40 gap; practice
 * block as an inset card 1240 wide, radius 32, padding 64/56 (phone 350,
 * 32/24), text + image 56 apart and centred; disadvantage copy capped at
 * 845 like the artboard; verdict band 580/56/580, columns centred.
 */
body.postid-7001 #page-container .et_pb_section_0 .et_pb_breadcrumbs_0 {
  margin-bottom: 0 !important;
}
body.postid-7001 #page-container .et_pb_section_3 {
  width: calc(100% - 40px) !important;
  max-width: 1240px !important;
  margin: 56px auto 0 !important;
  padding: 32px 24px !important;
  border-radius: 32px;
  overflow: hidden;
}
body.postid-7001 #page-container .et_pb_section_3 > .et_pb_row {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.postid-7001 #page-container .dw-test-disadvantage-body {
  max-width: 845px;
}
@media (min-width: 981px) {
  body.postid-7001 #page-container .et_pb_row_0::before,
  body.postid-7001 #page-container .et_pb_row_0::after {
    display: none !important;
  }
  body.postid-7001 #page-container .et_pb_row_3 > .et_pb_column {
    display: flex !important;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
  }
  body.postid-7001 #page-container .et_pb_row_3 .et_pb_heading_2 {
    flex: 0 1 auto;
    padding-bottom: 0 !important;
    margin: 0 !important;
  }
  body.postid-7001 #page-container .et_pb_row_3 .et_pb_text_14 {
    flex: 0 1 auto;
    margin: 0 !important;
  }
  body.postid-7001 #page-container .et_pb_section_3 {
    margin-top: 96px !important;
    padding: 64px 56px !important;
  }
  body.postid-7001 #page-container :is(.et_pb_section_3, .et_pb_section_5) > .et_pb_row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 56px;
    align-items: center;
  }
  /* Verdict: button and "Danach" link on one line, 18 apart (artboard). */
  body.postid-7001 #page-container .et_pb_section_5 .et_pb_column_17 {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
  }
  body.postid-7001 #page-container .et_pb_section_5 .et_pb_column_17 > * {
    margin: 0 !important;
    padding-bottom: 0 !important;
  }
  body.postid-7001 #page-container .et_pb_section_5 .et_pb_column_17 > :is(.et_pb_text_36, .et_pb_text_38) {
    flex: 0 0 100%;
  }
  body.postid-7001 #page-container .et_pb_section_5 .et_pb_column_17 > :is(.et_pb_button_module_wrapper, .et_pb_text_37) {
    width: auto !important;
  }
  body.postid-7001 #page-container .et_pb_section_5 > .et_pb_row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  body.postid-7001 #page-container :is(.et_pb_section_3, .et_pb_section_5) > .et_pb_row::before,
  body.postid-7001 #page-container :is(.et_pb_section_3, .et_pb_section_5) > .et_pb_row::after {
    display: none !important;
  }
  body.postid-7001 #page-container :is(.et_pb_section_3, .et_pb_section_5) > .et_pb_row > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
}

/* ---------------------------------------------------------------------------
 * V6 Kaufen (/divi-theme-kaufen-rabatt, post 4373), 2026-11-03. Artboard
 * Kaufen: H1 balanced at 886 max, hero 22 rhythm and 64 bottom; section
 * heads as one flex line (H2 left, intro right, baseline-aligned); lifetime
 * badge top right in the card head (phone: wraps under the label, as in
 * the artboard); card rows (here and on Test) 20 apart with equal columns;
 * sales block as the same inset card as Test (1240, radius 32, 64/56;
 * phone 350, 32/24) with a 3 x 357 grid at 28; closing band 580/56/580.
 */
body.postid-4373 #page-container .et_pb_section_0 {
  padding-bottom: 64px !important;
}
body.postid-4373 #page-container .et_pb_section_0 .et_pb_breadcrumbs_0 {
  margin-bottom: 0 !important;
}
body.postid-4373 #page-container .et_pb_section_0 .et_pb_heading_0 {
  padding-bottom: 22px !important;
}
body.postid-4373 #page-container .et_pb_section_0 .et_pb_heading_0 h1 {
  max-width: 886px;
  text-wrap: balance;
}
body.postid-4373 #page-container .et_pb_section_2 {
  padding-bottom: 0 !important;
}
body.postid-4373 #page-container .et_pb_section_3 {
  width: calc(100% - 40px) !important;
  max-width: 1240px !important;
  margin: 56px auto 0 !important;
  padding: 32px 24px !important;
  border-radius: 32px;
  overflow: hidden;
}
body.postid-4373 #page-container .et_pb_section_3 > .et_pb_row {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
@media (min-width: 981px) {
  body.postid-4373 #page-container .et_pb_section_3 {
    margin-top: 96px !important;
    padding: 64px 56px !important;
  }
  body.postid-4373 #page-container .et_pb_section_4 {
    padding-top: 96px !important;
  }
  body.postid-4373 #page-container :is(.et_pb_row_1, .et_pb_row_10) {
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    gap: 40px;
  }
  body.postid-4373 #page-container :is(.et_pb_row_8, .et_pb_row_13) {
    display: grid !important;
    align-items: center;
  }
  body.postid-4373 #page-container .et_pb_row_8 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 28px;
    align-items: start;
  }
  body.postid-4373 #page-container .et_pb_row_13 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 56px;
  }
  body.postid-4373 #page-container :is(.et_pb_row_1, .et_pb_row_8, .et_pb_row_10, .et_pb_row_13)::before,
  body.postid-4373 #page-container :is(.et_pb_row_1, .et_pb_row_8, .et_pb_row_10, .et_pb_row_13)::after {
    display: none !important;
  }
  body.postid-4373 #page-container :is(.et_pb_row_1, .et_pb_row_10) > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
    flex: 0 1 auto;
  }
  body.postid-4373 #page-container :is(.et_pb_row_8, .et_pb_row_13) > .et_pb_column {
    width: auto !important;
    margin: 0 !important;
  }
  body.postid-4373 #page-container .et_pb_row_1 .et_pb_text_2 { max-width: 517px; }
  body.postid-4373 #page-container .et_pb_row_10 .et_pb_text_46 { max-width: 492px; }
  /* Sales card: countdown note beside the button, 18 apart. */
  body.postid-4373 #page-container .et_pb_row_9 > .et_pb_column {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
  }
  body.postid-4373 #page-container .et_pb_row_9 > .et_pb_column > * {
    width: auto !important;
    margin: 0 !important;
  }
  /* Lifetime badge: top right, centred on the label line. */
  body.postid-4373 #page-container .et_pb_row_2 > .et_pb_column_4 {
    position: relative;
  }
  body.postid-4373 #page-container .et_pb_row_2 .et_pb_text_10 {
    position: absolute !important;
    top: 39px;
    right: 40px;
    margin: 0 !important;
  }
  /* Card rows (Kaufen add-ons/FAQ, Test strengths): equal columns, 20 gap. */
  body:is(.postid-4373, .postid-7001) #page-container .dw-cards {
    column-gap: 20px;
  }
  body:is(.postid-4373, .postid-7001) #page-container .dw-cards::before,
  body:is(.postid-4373, .postid-7001) #page-container .dw-cards::after {
    display: none !important;
  }
  body:is(.postid-4373, .postid-7001) #page-container .dw-cards > .et_pb_column {
    flex: 1 1 0;
    width: auto !important;
    margin-right: 0 !important;
  }
}

/* ---------------------------------------------------------------------------
 * V7 mobile burger, 2026-11-03. design.css centres the three bars with
 * top/left 50% and translate(-50%,-50%), but Divi's inline
 * `.et_pb_module .mobile_menu_bar::before { top: 2px }` is more specific,
 * so the bars sat at the top edge of the 44 px ink circle (upper bar outside).
 */
@media (max-width: 980px) {
  .et-l--header .et_pb_module .mobile_menu_bar::before {
    top: 50% !important;
    left: 50% !important;
  }
  /* Open state (Mobil 02 "Menü offen"): the panel starts below the header
   * row; design.css sets 132px but without !important, so Divi's own 5 %
   * padding won and the first item slid under the burger. The burger turns
   * into a close cross while the panel is open. */
  .et-l--header .mobile_nav .et_mobile_menu {
    padding: 132px 20px 32px !important;
  }
  .et-l--header .et_pb_module .mobile_nav.opened .mobile_menu_bar::before,
  .et-l--header .et_pb_module .mobile_nav.opened .mobile_menu_bar::after {
    content: "";
    position: absolute;
    top: 50% !important;
    left: 50% !important;
    width: 18px;
    height: 2px;
    background: var(--dw-creme);
    border-radius: 2px;
    box-shadow: none;
    font-size: 0;
    transform: translate(-50%, -50%) rotate(45deg);
  }
  .et-l--header .et_pb_module .mobile_nav.opened .mobile_menu_bar::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
}

/* ---------------------------------------------------------------------------
 * Phone type on the three relaunch builder pages (Tutorial 4462, Test 7001,
 * Kaufen 4373), 2026-11-03. design.css floors `.et_pb_post_content p, li` to
 * 17px !important for legacy Gutenberg callouts; these pages render their
 * builder layout inside the post content, so on phones mono labels went
 * 13/14/15 -> 17, chapter numbers 44/40 -> 17 and price-drop figures 44 -> 17.
 * The artboards keep those sizes at 390. Only the non-body modules (module
 * size not 16-18) inherit their module size again; body copy keeps the floor
 * because several of its modules carry a 17px p rule the floor equals.
 * Kaufen figures are 32 on the phone artboard.
 */
@media (max-width: 767px) {
  body.postid-4373 #page-container .et_pb_post_content :is(.et_pb_text_1,.et_pb_text_3,.et_pb_text_5,.et_pb_text_8,.et_pb_text_9,.et_pb_text_10,.et_pb_text_12,.et_pb_text_15,.et_pb_text_16,.et_pb_text_18,.et_pb_text_20,.et_pb_text_23,.et_pb_text_26,.et_pb_text_29,.et_pb_text_32,.et_pb_text_34,.et_pb_text_36,.et_pb_text_37,.et_pb_text_39,.et_pb_text_40,.et_pb_text_42,.et_pb_text_43,.et_pb_text_45,.et_pb_text_54) :is(p, li),
  body.postid-7001 #page-container .et_pb_post_content :is(.et_pb_text_1,.et_pb_text_2,.et_pb_text_5,.et_pb_text_6,.et_pb_text_7,.et_pb_text_8,.et_pb_text_10,.et_pb_text_12,.et_pb_text_21,.et_pb_text_23,.et_pb_text_25,.et_pb_text_27,.et_pb_text_29,.et_pb_text_31,.et_pb_text_33,.et_pb_text_35,.et_pb_text_38) :is(p, li),
  body.page-id-4462 #page-container .et_pb_post_content :is(.et_pb_text_1,.et_pb_text_3,.et_pb_text_5,.et_pb_text_7,.et_pb_text_9,.et_pb_text_11,.et_pb_text_13,.et_pb_text_15,.et_pb_text_17,.et_pb_text_19,.et_pb_text_21,.et_pb_text_23,.et_pb_text_25,.et_pb_text_27,.et_pb_text_29,.et_pb_text_31,.et_pb_text_33,.et_pb_text_35,.et_pb_text_37,.et_pb_text_39,.et_pb_text_41,.et_pb_text_43) :is(p, li) {
    font-size: inherit !important;
  }
  body.postid-4373 #page-container .et_pb_row_8 :is(.et_pb_text_37, .et_pb_text_40, .et_pb_text_43),
  body.postid-4373 #page-container .et_pb_row_8 :is(.et_pb_text_37, .et_pb_text_40, .et_pb_text_43) p {
    font-size: 32px !important;
    line-height: 0.9 !important;
  }
}

/* ---------------------------------------------------------------------------
 * V8 Blurb icons on sand cards, 2026-11-03. Legacy Divi 4 blurbs keep their old
 * icon colours (white from the teal-circle era, demo yellow, raw clay) while
 * the cards are dw-sand now. The text audit skips icon glyphs, so these went
 * unnoticed: white 1.15:1, yellow 1.37:1, clay 2.13:1 (non-text minimum 3:1).
 * Non-palette colours (white, yellow) map to dw-ink; icons that already use
 * clay keep their hue as dw-clay-dark, the token for clay as foreground on
 * sand. No circle: the design system has no icon-badge component.
 */
body.page-id-6188 #page-container :is(.et_pb_blurb_9,.et_pb_blurb_10,.et_pb_blurb_11).et_pb_blurb .et-pb-icon,
body.page-id-3074 #page-container .et_pb_blurb_0.et_pb_blurb .et-pb-icon {
  color: var(--dw-ink) !important;
}
body.page-id-3931 #page-container :is(.et_pb_blurb_0,.et_pb_blurb_1,.et_pb_blurb_2,.et_pb_blurb_3,.et_pb_blurb_4,.et_pb_blurb_5).et_pb_blurb .et-pb-icon,
body.page-id-6115 #page-container .et_pb_blurb_6.et_pb_blurb .et-pb-icon {
  color: var(--dw-clay-dark) !important;
}

/* ---------------------------------------------------------------------------
 * S1 Spacing audit, 2026-11-04 (t_33ad8d10). Measured with
 * shared/tools/qa/spacing_audit.py against the artboards; values are the
 * artboards' own, nothing new. Report: divi-world/briefs/spacing-audit-2026-11-04.md
 */

/* S1a Post body rhythm (Beitrag artboard: <article> gap 26px, h2 margin-top 14
 * -> 40 above / 26 below, h3 margin-top 10 -> 36 above, list items 14 apart).
 * Divi only had p {padding-bottom: 1em} and no heading margins, so headings sat
 * 0-2px above their paragraph and 19-21px below the previous one. Margins
 * collapse, hence 40/36 rather than 14/10 on top of the 26. */
body #page-container .et_pb_post_content > :is(p, ul, ol) {
  padding-bottom: 0;
}
body #page-container .et_pb_post_content > :is(p, ul, ol, figure, blockquote, pre, table, .et-box, .wp-block-image, .wp-block-embed, .wp-block-table, .wp-block-code, .wp-block-buttons) {
  margin-top: 0;
  margin-bottom: 26px;
}
body #page-container .et_pb_post_content > h2 {
  margin: 40px 0 26px;
}
body #page-container .et_pb_post_content > :is(h3, h4) {
  margin: 36px 0 26px;
}
body #page-container .et_pb_post_content > :first-child {
  margin-top: 0;
}
body #page-container .et_pb_post_content > :last-child {
  margin-bottom: 0;
}
/* Lists carried Divi's 26px line-height (1.37) against 1.7 in paragraphs; the
 * token body-post is 1.65 for both (CHANGELOG 3.1). */
body #page-container .et_pb_post_content > :is(p, ul, ol),
body #page-container .et_pb_post_content > :is(ul, ol) li {
  line-height: 1.65;
}
body #page-container .et_pb_post_content > :is(ul, ol) li + li,
body #page-container .et_pb_post_content > :is(ul, ol) li > :is(ul, ol) {
  margin-top: 14px;
}
body #page-container .et_pb_post_content > :is(ul, ol) li > :is(ul, ol) {
  padding-bottom: 0;
}

/* S1b Footer: Divi's ul padding-bottom (16px) plus the last link's 10px margin
 * pushed the footer's bottom inset to 92px; the artboards say 64 (padding
 * 56px 32px 64px on Blog, Beitrag, Tutorial, Test, Kaufen). */
body #page-container .et-l--footer ul {
  padding-bottom: 0;
}
body #page-container .et-l--footer li:last-child {
  margin-bottom: 0;
}

/* S1c Single-row teaser grids ("Das passt dazu" under posts, "Neu im Blog" on
 * the homepage): Divi's grid article keeps margin-bottom 40 + padding-bottom 25,
 * which added 65px under the last card row (Beitrag: section padding 88 only). */
body #page-container :is(.dw-related-cards, .dw-blogteaser) .et_pb_blog_posts .et_pb_post {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* S1d Homepage path cards: "01" sits 24px above the card title in Main
 * (flex gap 16 + h3 margin-top 8); the Text module had 8px. */
body #page-container .dw-path-cards > .et_pb_column > .et_pb_text:first-child {
  padding-bottom: 24px !important;
}

/* S1e Stacked cards on the phone: card-grid gap is 20px (tokens.json card-min /
 * space-5); Divi's phone column margin was 30px. */
@media (max-width: 767px) {
  body #page-container .dw-cards > .et_pb_column:not(:last-child),
  body.postid-4373 #page-container .et_pb_row_2 > .et_pb_column:not(:last-child) {
    margin-bottom: 20px !important;
  }
}

/* S1f Test page "Fünf Nachteile": items are 26px top/bottom with a hairline and
 * no extra space (Test artboard); Divi's group margin-bottom (~18px) made every
 * step 17px taller. The list starts 26px below the intro (section gap 26). */
body #page-container .et_pb_group[class*="dw-test-disadvantage"] {
  margin-bottom: 0 !important;
}
body #page-container :not([class*="dw-test-disadvantage"]) + .et_pb_group[class*="dw-test-disadvantage"] {
  margin-top: 26px;
}

/* S1g Homepage "Neu im Blog": 32px between the heading row and the cards
 * (Main artboard: margin-bottom 32), and the card is the 16px-padded, 24px-
 * rounded surface with 16px between image, meta, title and excerpt, so the
 * image sits 16px inside the content edge like in the artboard. */
body #page-container .dw-blogteaser .et_pb_blog_posts {
  margin-top: 32px;
}
body #page-container .dw-blogteaser .et_pb_blog_posts .et_pb_post {
  padding: 16px !important;
  border-radius: 24px;
  gap: 16px;
  background: var(--dw-paper);
  transition: background-color 150ms ease;
}
body #page-container .dw-blogteaser .et_pb_blog_posts .et_pb_post:hover {
  background: var(--dw-sand);
}
body #page-container .dw-blogteaser .et_pb_blog_posts .et_pb_post :is(.entry-featured-image-url, .post-meta, .entry-title) {
  margin: 0 !important;
}

/* S1h Footer links on the phone: the 44px tap target (pre-launch checklist)
 * plus the 10px list margin put 33px between link lines (artboard 10-12). The
 * targets now touch instead of stacking a margin on top: 22px between lines,
 * the closest the artboard rhythm gets without shrinking the tap target. */
@media (max-width: 767px) {
  body #page-container .et-l--footer li {
    margin-bottom: 0;
  }
}

/* ---------------------------------------------------------------------------
 * S2 Spacing audit round 2, 2026-11-04 (t_33ad8d10).
 */

/* S2a Default buttons from 768px up. tokens.json `button` is 17px / 1.2 / 700
 * and .dw-btn carries a 2px border on every variant (bundle.css), so primary
 * and secondary are both 56px; the artboards measure 56 (Kaufen, Test,
 * Tutorial) and 62 for the homepage hero pair. The default preset rendered
 * 18px over a 1.7 line-height with 20/32 padding: 71px on every such button.
 * Compact placements (header, path cards, tutorial jumps), the newsletter and
 * the sidebar button keep their own rules; phones keep the 52px floor. */
@media (min-width: 768px) {
  body #page-container .et-l--post .et_pb_section a.et_pb_button.preset--module--divi-button--default:not(.dw-path-cards *):not(.dw-tutorial-jumps *) {
    font-size: 17px !important;
    line-height: 1.2 !important;
    padding: 18px 28px !important;
  }
  body #page-container .et-l--post .et_pb_section a.et_pb_button.preset--module--divi-button--default.dw-btn-outline:not(.dw-path-cards *):not(.dw-tutorial-jumps *) {
    padding: 16px 26px !important;
  }
  body #page-container .et-l--post .et_pb_section .dw-hero__actions a.et_pb_button.preset--module--divi-button--default:not(.dw-path-cards *):not(.dw-tutorial-jumps *) {
    padding: 21px 32px !important;
  }
  body #page-container .et-l--post .et_pb_section .dw-hero__actions a.et_pb_button.preset--module--divi-button--default.dw-btn-outline:not(.dw-path-cards *):not(.dw-tutorial-jumps *) {
    padding: 19px 30px !important;
  }
}

/* S2b Kaufen price cards: in the artboard the card is a flex column, the
 * button takes margin-top: auto (both buttons on one line, whatever the list
 * length) and the affiliate note sits 16px under it (card gap 16). Divi stacked
 * the note 2px under the button and the Yearly button 26px higher than the
 * Lifetime one. The dark "Gekauft?" band has gap 18 between button and note. */
@media (min-width: 768px) {
  body.postid-4373 #page-container .et_pb_row_2 > .et_pb_column {
    display: flex;
    flex-direction: column;
  }
  body.postid-4373 #page-container .et_pb_row_2 > .et_pb_column > .et_pb_button_module_wrapper {
    margin-top: auto !important;
  }
}
body.postid-4373 #page-container .et_pb_row_2 > .et_pb_column > .et_pb_button_module_wrapper + .et_pb_text {
  margin-top: 16px;
}
body.postid-4373 #page-container .et_pb_button_3_wrapper + .et_pb_text {
  margin-top: 18px;
}

/* S2c Homepage path cards: the card is a flex column with gap 16 and the
 * button at margin-top: auto (Main). The intro Text module kept 26px of
 * padding-bottom, so every button sat 10px lower and the cards grew to 338
 * (artboard min-height 320). */
body #page-container .dw-path-cards > .et_pb_column > .et_pb_text:not(:first-child) {
  padding-bottom: 16px !important;
}

/* S2d Homepage "Neu im Blog": card grid gap 20 (Main; tokens card-min /
 * space-5). Divi's grid module had 30 in both directions. */
body #page-container .dw-blogteaser .et_pb_blog_posts {
  gap: 20px !important;
}

/* S2e Test "Fünf Nachteile" on the phone: the number column was 52px but
 * "02".."05" in deco 40px are 52-54px wide, so they broke onto two lines ("0"
 * over "2") and every item from 02 on grew by ~58px. One fixed 56px column for
 * all five rows keeps the titles on one left edge; numbers never wrap. */
body #page-container .dw-test-disadvantage-number,
body #page-container .dw-test-disadvantage-number * {
  white-space: nowrap;
}
@media (max-width: 767px) {
  body #page-container .dw-test-disadvantage-row {
    grid-template-columns: 56px minmax(0, 1fr) !important;
  }
}

/* S2f Post sidebar newsletter box (Beitrag): one flex column with gap 14 —
 * label, text, field, button, the field and button at full card width. The
 * Signup module kept Divi's 25px padding (field and button indented 25px,
 * 41px above the field) and a 10px field/button gap; on desktop the button
 * was only as wide as its label. */
body #page-container .et-l--body .et_pb_column_1_3 .et_pb_group:has(> .dw-signup) > .et_pb_text {
  padding-bottom: 14px !important;
}
body #page-container .et-l--body .et_pb_column_1_3 .et_pb_signup.dw-signup {
  padding: 0 !important;
}
body #page-container .et-l--body .et_pb_column_1_3 .dw-signup .et_pb_newsletter_fields {
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
}
body #page-container .et-l--body .et_pb_column_1_3 .dw-signup :is(.et_pb_newsletter_field, .et_pb_newsletter_button_wrap, .et_pb_newsletter_button) {
  width: 100%;
  flex: 1 1 auto;
}

/* S2g /website-erstellen-lassen (legacy Divi 4 page, no artboard) on the
 * phone: rows kept Divi 4's 80% width (39px inset) and the intro row had none
 * (text flush at x=0). The phone page margin is 20px (tokens space-5), as on
 * every other template. */
@media (max-width: 767px) {
  body.page-id-6188 #page-container .et-l--post .et_pb_section > .et_pb_row {
    width: auto !important;
    max-width: none !important;
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  /* Band to band on the phone is space-band-phone (56). Since S3q the rows
     carry no padding of their own, so the section holds all 56. */
  body.page-id-6188 #page-container .et-l--post > .et_builder_inner_content > .et_pb_section {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
}

/* S2h Post sidebar "Divi kaufen" box (Beitrag): the button is a full-width
 * flex item, 16px / 1.4 with 13/20 padding (48px). Staging had it as wide as
 * its label and 53px high (1.7 line-height). Phones already go full width. */
@media (min-width: 768px) {
  body #page-container .et-l--body .et_pb_column_1_3 .et_pb_group .et_pb_button_module_wrapper {
    width: 100%;
  }
  body #page-container .et-l--body .et_pb_column_1_3 .et_pb_group a.et_pb_button {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    line-height: 1.4 !important;
  }
}

/* S2i Kaufen price line: the unit ("/ Jahr", "einmalig") is 18px / 700 with
 * normal tracking, 10px after the price (Kaufen). It inherited the price's
 * absolute -3.4px letter-spacing, which crushed the glyphs into each other. */
body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_4, .et_pb_text_11) p > span {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0;
  margin-left: 2px;
}

/* S2j Post sidebar table of contents: title and list sit 14px apart (Beitrag:
 * label padding-bottom 10 + nav gap 4); the module's flex gap was 30. */
body #page-container .et-l--body .et_pb_table_of_contents {
  gap: 4px !important;
}

/* S2k Test "Fünf Nachteile": the list sits in its own row, so S1f's sibling
 * rule never matched and item 01 started 27px under the intro instead of the
 * artboard's 26 gap + 26 row padding (55 to the number). */
body #page-container .et_pb_column > .et_pb_group[class*="dw-test-disadvantage"]:first-child {
  margin-top: 26px !important;
}

/* S2l Homepage "Visueller Builder" band on the phone: the row becomes a flex
 * column with gap 16 (Main: label, h2, text 16 apart), but the modules kept
 * their desktop padding-bottom (16/16/26) on top of the gap, so label->h2 and
 * h2->text were ~34 instead of 16. The button keeps its 8px extra (Main:
 * margin-top 8). */
@media (max-width: 767px) {
  body #page-container .dw-sage-block .et_pb_module:not(.et_pb_button) {
    padding-bottom: 0 !important;
  }
  body #page-container .dw-sage-block .et_pb_button_module_wrapper {
    margin-top: 8px !important;
  }
}

/* ---------------------------------------------------------------------------
 * S3 Spacing fix round 3, 2026-11-04 (t_e6cf2621). Inputs:
 * divi-world/briefs/spacing-audit-baseline-2026-11-04.md and
 * spacing-visual-review-2026-11-04.md. Log: briefs/spacing-fixes-2026-11-04.md.
 * Values are the artboards' own (1440) or tokens.json (phone); nothing new.
 */

/* S3a Header (all pages, from 981px): the nav sits right, 12px before the CTA
 * (Main/all artboards: nav margin-left:auto). Divi's 3/4 + 1/4 columns left
 * the menu next to the logo with a ~400px hole before the CTA. The row
 * becomes a flex row (clearfix pseudo-elements hidden, see divi5-staging-ops),
 * the CTA column sizes to its button and the menu wrap pushes right. */
@media (min-width: 981px) {
  body #page-container .et-l--header .et_pb_row_1_tb_header.et_pb_row {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  body #page-container .et-l--header .et_pb_row_1_tb_header.et_pb_row::before,
  body #page-container .et-l--header .et_pb_row_1_tb_header.et_pb_row::after {
    display: none;
  }
  body #page-container .et-l--header .et_pb_row_1_tb_header > .et_pb_column:first-child {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    margin-right: 0 !important;
  }
  body #page-container .et-l--header .et_pb_row_1_tb_header > .et_pb_column:last-child {
    flex: 0 0 auto;
    width: auto !important;
    margin: 0 !important;
  }
  body #page-container .et-l--header .et_pb_row_1_tb_header .et_pb_menu__wrap {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
  }
}

/* S3b Post hero: the meta line sits 28px under the H1 (Beitrag: hero column
 * gap 22 + meta row padding-top 6). It touched the H1 (-2 / 0px). */
body #page-container .et_pb_post_title .et_pb_title_meta_container {
  margin-top: 28px;
}

/* S3c "Das passt dazu" under every post (Beitrag): grid gap 26, each card a
 * column with 14px between image, title, meta and excerpt, title h3 24/1.2.
 * The titles inherited the global H2 (44px desktop, 30px phone), which made
 * the cards 4-5 title lines tall. Phone: card-grid gap space-5 (20). */
body #page-container .dw-related-cards .et_pb_blog_posts {
  column-gap: 26px !important;
}
body #page-container .dw-related-cards .et_pb_post .entry-title,
body #page-container .dw-related-cards .et_pb_post .entry-title a {
  font-size: 24px !important;
  line-height: 1.2 !important;
  letter-spacing: -0.025em;
}
body #page-container .dw-related-cards .et_pb_post .entry-title {
  margin: 0 0 14px !important;
  padding-bottom: 0 !important;
}
body #page-container .dw-related-cards .et_pb_post .post-meta {
  margin: 0 0 14px !important;
}
/* U2 (t_5cb9cde3) Phone: "Das passt dazu" is a carousel (Mobil.dc.html
 * Z. 613/638: dw-rail flex, gap 14, cards 0 0 240px, angeschnitten, the only
 * horizontal card scroll). Supersedes the stacked phone layout in design.css
 * (td-bb0e48). The rail bleeds to the viewport edges (margin 0 -20px over the
 * row's 20px padding) and scrolls inside itself, so the page never gets a
 * horizontal overflow. Clearfix pseudos would become extra flex items. */
@media (max-width: 767px) {
  body #page-container .dw-related-cards .et_pb_blog_posts {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 14px !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0 -20px !important;
    padding: 0 20px !important;
  }
  body #page-container .dw-related-cards .et_pb_blog_posts::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  body #page-container .dw-related-cards .et_pb_blog_posts::before,
  body #page-container .dw-related-cards .et_pb_blog_posts::after {
    display: none !important;
  }
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post {
    flex: 0 0 240px !important;
    width: 240px !important;
    max-width: 240px !important;
    min-width: 0;
  }
  /* U2 fix2 (t_1ddd0393): in 240px cards "Datum | Kategorie" wrapped and left
   * a lone "|" at the line end. Mobil.dc.html Z. 614ff: image, category badge,
   * title, flex column gap 10, no date. Date hidden; the separator is a bare
   * text node, so the meta row gets font-size 0 and only the badge keeps its
   * own 13px (design.css sets it on the link). Clearfix pseudo off, otherwise
   * it becomes a flex item with an extra gap. >=768px untouched. */
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post {
    display: flex !important;
    flex-direction: column;
    gap: 10px;
  }
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post::before,
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post::after {
    display: none !important;
  }
  body #page-container .dw-related-cards .et_pb_post > :is(.et_pb_image_container, .entry-title, .post-meta, .post-content) {
    margin: 0 !important;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container { order: 1; }
  body #page-container .dw-related-cards .et_pb_post .post-meta {
    order: 2;
    display: flex !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }
  body #page-container .dw-related-cards .et_pb_post .post-meta .published {
    display: none !important;
  }
  body #page-container .dw-related-cards .et_pb_post .post-meta .entry-categories {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px;
    line-height: 20px;
  }
  body #page-container .dw-related-cards .et_pb_post .entry-title { order: 3; }
  body #page-container .dw-related-cards .et_pb_post .post-content { order: 4; }
  /* U2 fix3 (t_e7f1f8ff): Mobil.dc.html Z. 614ff card title is Sora 20/700,
   * line-height 1.2, letter-spacing -0.025em, and the card has no excerpt
   * (image, badge, title only). Phone only; >=768px keeps 24/800 + excerpt. */
  body #page-container .dw-related-cards .et_pb_post .entry-title,
  body #page-container .dw-related-cards .et_pb_post .entry-title a {
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.025em !important;
  }
  body #page-container .dw-related-cards .et_pb_post .post-content {
    display: none !important;
  }
  /* t_85ecb64b: the 44px tap-target rule (design.css, .et_pb_blog_posts
   * .entry-title a: flex, align-items center) centred one-line titles in their
   * 44px box, so they sat 10px lower than two-line titles in the next card.
   * Mobil.dc.html Z. 614ff: title directly under the badge (gap 10), top
   * aligned. Keep the 44px target, align the text to its top. */
  body #page-container .dw-related-cards .et_pb_post .entry-title a {
    align-items: flex-start !important;
  }
}

/* S3d Card bullet lists (Kaufen, Test): the text starts 32px after the dot
 * (li grid 20px + gap 12); the 20px padding left only 20. */
body #page-container .dw-kaufen-list li,
body #page-container .dw-test-list .et_pb_text_inner li {
  padding-left: 32px;
}

/* S3e Homepage "Dein Weg" on the phone (Mobil: one flex column, gap 20
 * between H2, intro and the card stack). Divi's phone column margin put 29px
 * under the H2 and 0px (3px) between intro and the first card. */
@media (max-width: 767px) {
  body.home #page-container .et_pb_section_1 > .et_pb_row_3 {
    margin-bottom: 20px !important;
  }
  body.home #page-container .et_pb_section_1 > .et_pb_row_3 > .et_pb_column:not(:last-child) {
    margin-bottom: 20px !important;
  }
}

/* S3f Homepage "Neu im Blog" cards: image -> category label 16 (Main gap 16).
 * The article is a flex column (S1g), so its clearfix ::after became an
 * empty flex item right after the image (order 0) and added a second 16px
 * gap; the image container's own 14px margin came on top (46-48px). */
body #page-container .dw-blogteaser .et_pb_blog_posts .et_pb_post::before,
body #page-container .dw-blogteaser .et_pb_blog_posts .et_pb_post::after {
  display: none !important;
}
body #page-container .dw-blogteaser .et_pb_blog_posts .et_pb_post .et_pb_image_container {
  margin: 0 !important;
}

/* S3g Homepage "Neu im Blog" heading row (Main: flex, baseline, space-between):
 * "Mehr Know-How" ends on the content edge, on the H2's baseline. It sat
 * left-aligned in its 1/3 column, 243px short of the edge. */
@media (min-width: 981px) {
  body.home #page-container .dw-blogteaser .et_pb_row_7 {
    display: flex;
    align-items: baseline;
  }
  body.home #page-container .dw-blogteaser .et_pb_row_7::before,
  body.home #page-container .dw-blogteaser .et_pb_row_7::after {
    display: none;
  }
  body.home #page-container .dw-blogteaser .et_pb_text_13 {
    text-align: right;
  }
}

/* S3h Newsletter band, desktop: 80px top and bottom (Beitrag, Blog etc.;
 * design brief spacing-footer-newsletter-breite-2026-11-04 variant B, which
 * staging follows until Frank decides). Home had 88/88, posts 88/80. Phone:
 * space-band-phone 56 both ways (posts had 56/48). */
@media (min-width: 768px) {
  body.home #page-container .et-l--post .et_pb_section_5,
  body.single-post #page-container .et-l--body .et_pb_section_3_tb_body {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media (max-width: 767px) {
  body.single-post #page-container .et-l--body .et_pb_section_3_tb_body {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
}

/* S3i Blog archive grid (Blog artboard: grid gap 40px rows / 26px columns,
 * cards 388 wide at 1440). Divi's grid module had gap 30 plus a 40px (phone
 * 34px) article margin-bottom: rows 70 / 64 apart, columns 30. Phone: the
 * same auto-fit grid collapses to one column with the 40px row gap. */
body #page-container .dw-archive-grid .et_pb_blog_posts {
  gap: 40px 26px !important;
}
body #page-container .dw-archive-grid .et_pb_blog_posts > .et_pb_post {
  margin-bottom: 0 !important;
}
/* Pagination 48px under the last card row (Blog: grid section padding-bottom
 * 32 + pagination section padding-top 16); it relied on the article margin. */
body #page-container .dw-archive-grid .dw-numbered-pagination {
  margin-top: 48px;
}

/* S3j Tip / info boxes in posts (Beitrag "Tipp" box: padding 26/28, flex
 * column gap 10, text 17px / 1.65). The legacy .et-box kept Divi's 14px at a
 * 32.3px line-height on desktop (2.3x) and 20/24 padding; paragraphs inside
 * carried 14px padding-bottom and lists 23px. Phone: card padding 24
 * (tokens space-6). */
body #page-container .et_pb_post_content .et-box .et-box-content {
  font-size: 17px !important;
  line-height: 1.65 !important;
  padding: 26px 28px !important;
}
body #page-container .et_pb_post_content .et-box .et-box-content > :is(p, ul, ol) {
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  padding-bottom: 0;
}
body #page-container .et_pb_post_content .et-box .et-box-content > :is(p, ul, ol) + :is(p, ul, ol) {
  margin-top: 10px;
}
@media (max-width: 767px) {
  body #page-container .et_pb_post_content .et-box .et-box-content {
    padding: 24px !important;
  }
}
/* U1 (t_9afe493f): Divi's legacy shortcode icon is .et-box::before, absolute at
 * left 28px, up to 22px wide (shortcodes-legacy.css), and Divi only hides it
 * at <=479px (shortcodes_responsive.css). The content padding above put the
 * text at 28/24px, under the icon. Where the icon shows, start the text after
 * it: 28 + 22 icon + 12 (space-3) = 62px. */
@media (min-width: 480px) {
  body #page-container .et_pb_post_content .et-box:is(.et-info, .et-warning, .et-download, .et-bio) .et-box-content {
    padding-left: 62px !important;
  }
}

/* S3k Post sidebar boxes on the phone: 22px apart, as on desktop (Beitrag
 * aside: flex column gap 22). Divi's phone module margin made it 30. */
@media (max-width: 767px) {
  body.single-post #page-container .et-l--body .et_pb_column_2_tb_body > .et_pb_module:not(:last-child) {
    margin-bottom: 22px !important;
  }
}

/* S3l Tutorial hero "Wo stehst Du gerade?" (Tutorial: chips padding 12/20,
 * 15px, 44 tall, gap 12). Staging used the 52px default button.
 * Phone: the sitewide full-width 52px tap-target rule (td-a7dc2f) stays; only
 * the double gap (wrapper margin 10 + flex gap 12 = 22) goes back to 12. */
@media (min-width: 768px) {
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_group_0 a.et_pb_button {
    padding: 12px 20px !important;
    font-size: 15px !important;
    line-height: 20px !important;
  }
}
@media (max-width: 767px) {
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_group_0 > .et_pb_button_module_wrapper {
    margin-top: 0 !important;
  }
}

/* S3m Tutorial webcast card: 1240 wide like the design (x 100), not the
 * 1280 content row (it overhung the content edge by 20 each side). */
@media (min-width: 981px) {
  body.page-id-4462 #page-container .et_pb_row_12 {
    max-width: 1240px !important;
  }
}

/* S3n Test Fazit on the phone (D1): text, button, "Danach" link and the
 * transparency note sat at 0px to each other. Artboard Test: both wrappers
 * are flex with gap 18 (column and wrapping row), so on the phone every item
 * stacks 18 apart. Button stays full width (sitewide tap-target rule
 * td-a7dc2f). */
@media (max-width: 980px) {
  body.postid-7001 #page-container .et_pb_section_5 .et_pb_column_17 {
    display: flex !important;
    flex-direction: column;
    gap: 18px;
  }
  body.postid-7001 #page-container .et_pb_section_5 .et_pb_column_17 > * {
    margin: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* S3o Test score card: score rows -> "Direkt zum Fazit" link 20 apart at
 * every width (artboard Test: card is flex column, gap 20). Staging had 12
 * on desktop and Divi's 30 phone module margin (F106/F115 at 390). */
body.postid-7001 #page-container .dw-score-card > .et_pb_group_0 {
  margin-bottom: 20px !important;
}
/* S3o (cont.) Rating "4,6 / 5" -> verdict text: card gap 20 (artboard).
 * The "/ 5" span inherited the 51px paragraph line-height and inflated the
 * rating row, while the gap itself was 0 (F001/F005, glyph 12 vs 21). */
body.postid-7001 #page-container .dw-score-card .dw-score__outof {
  line-height: 1;
}
body.postid-7001 #page-container .dw-score-card > .dw-score__rating {
  margin-bottom: 20px !important;
}

/* S3p Home comparison table rows (H4/C5). Main: cells 14/18 at line-height
 * normal (no line-height set) -> 51px rows; staging inherited 1.6 (56/83).
 * Phone per Mobil: 15px text, 14px cell padding. Frame, 4 columns and the
 * 720 min width stay from Main (Mobil supplements, does not override). */
body #page-container .dw-table tbody th,
body #page-container .dw-table tbody td {
  line-height: normal !important;
}
@media (max-width: 767px) {
  body #page-container .dw-table tbody th,
  body #page-container .dw-table tbody td {
    font-size: 15px !important;
    padding: 14px !important;
  }
}

/* S3q /website-erstellen-lassen (page 6188, legacy Divi layout, no artboard).
 * Only token values (design-system/tokens.json), nothing invented:
 * W1 every row on the content edge (1216 wide, x 112 like all other pages);
 * W2 bands 96 (space-10) / phone 56 (space-band-phone), rows without Divi's
 * 2.88% padding; heading block -> first paragraph and inside the blurb cards
 * 16 (space-4: "Überschrift zu erstem Absatz, Abstände innerhalb einer
 * Karte"); stacked cards on the phone 20 apart (space-5: Karten-Grid). */
body.page-id-6188 #page-container .et-l--post .et_pb_section {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}
@media (min-width: 768px) {
  body.page-id-6188 #page-container .et-l--post .et_pb_section > .et_pb_row {
    width: calc(100% - 64px) !important;
    max-width: 1216px !important;
  }
}
body.page-id-6188 #page-container .et-l--post .et_pb_section > .et_pb_row {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
body.page-id-6188 #page-container .et-l--post .et_pb_section > .et_pb_row + .et_pb_row {
  margin-top: 16px !important;
}
body.page-id-6188 #page-container .et-l--post .et_pb_blurb .et_pb_main_blurb_image {
  margin-bottom: 16px !important;
}
body.page-id-6188 #page-container .et-l--post .et_pb_blurb .et_pb_module_header {
  padding-bottom: 16px !important;
}
body.page-id-6188 #page-container .et-l--post .et_pb_text_14 {
  margin-bottom: 16px !important;
}
/* last heading of a text module carries Divi's 10px padding on top of the
 * 16 row gap (lead h3 -> paragraph 32 instead of 16) */
body.page-id-6188 #page-container .et-l--post .et_pb_text .et_pb_text_inner > :last-child {
  padding-bottom: 0 !important;
}
@media (max-width: 767px) {
  /* section 56 and row x 20: see S2g */
  body.page-id-6188 #page-container .et-l--post .et_pb_row_14 > .et_pb_column {
    margin-bottom: 20px !important;
  }
  body.page-id-6188 #page-container .et-l--post .et_pb_row_14 > .et_pb_column:last-child {
    margin-bottom: 0 !important;
  }
  body.page-id-6188 #page-container .et-l--post .et_pb_row_14 .et_pb_blurb {
    margin-bottom: 0 !important;
  }
}

/* ---------------------------------------------------------------------------
 * Mobile promo bar + header, 2026-11-04 (t_46b14e4f). Reference: Mobil.dc.html
 * Z. 124-146 ("Header geschlossen"). Phone only (<=767); tablet/desktop unchanged.
 *
 * Promo bar: before, the chip (line-height 22.5px -> 30.5px tall) sat on the
 * text baseline next to the 44px-tall link and hung 0.2px out of the 48px bar
 * (top inset 17.7 / bottom -0.2), the link sat mid-row instead of at the right
 * edge. Now the paragraph is one flex row centred in the 48px bar: chip 24px
 * tall (12px above and below), gaps space-2 (8px), link pushed to the right
 * page inset (20px, space-5) and keeping its 44px tap height.
 *
 * Header band: before, the burger was pinned 6px from the right edge (Divi's
 * margin-right on .et_mobile_nav_menu) and the CTA was 50px tall at 16px with
 * 8px side padding, crammed between logo and burger. Artboard: 20px insets,
 * CTA 44px tall, 0 16px padding, 15px/700, 8px to the 44px burger. The
 * phone label "Kaufen" (artboard) is a phone innerContent value on the
 * button in header layout 6841 (theme/scripts/header-cta-phone-label.php). */
@media (max-width: 767px) {
  /* Promo: Divi gives the section 10px vertical padding, which pushed the
     44px row 10px down inside the 48px bar. */
  .et-l--header .et_pb_section.dw-promo {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Both header rows are flex here; their clearfix ::after became an extra
     flex item and, with the row gap, cut 10px (promo) / 8px (nav band) off
     the right inset. */
  .et-l--header .dw-promo .et_pb_row::before,
  .et-l--header .dw-promo .et_pb_row::after,
  .et-l--header .et_pb_section:not(.dw-promo) .et_pb_row::before,
  .et-l--header .et_pb_section:not(.dw-promo) .et_pb_row::after {
    display: none;
  }
  .et-l--header .dw-promo .et_pb_row > .et_pb_column {
    flex: 1 1 auto;
    width: 100% !important;
    margin-right: 0 !important;
  }
  .et-l--header .dw-promo .et_pb_text_inner > p {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    font-size: 14px;
    line-height: 20px;
  }
  .et-l--header .dw-promo .dw-promo__chip {
    flex: none;
    margin: 0;
    padding: 4px 12px;
    font-size: 13px;
    line-height: 16px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }
  .et-l--header .dw-promo .et_pb_text_inner > p > a {
    flex: none;
    margin-left: auto;
    font-size: 14px;
    line-height: 20px;
  }

  /* Header band: 20px insets, burger 44px at the right inset, CTA 8px left of it. */
  .et-l--header .et_pb_row_1_tb_header.et_pb_row {
    padding-right: 72px !important;
  }
  .et-l--header .et_mobile_nav_menu {
    top: 12px;
    right: 20px;
    height: 44px;
    margin: 0 !important;
  }
  .et-l--header .et_mobile_nav_menu .mobile_nav,
  .et-l--header .et_pb_module .mobile_menu_bar {
    height: 44px;
    margin-top: 0;
  }
  /* Divi nudges the bar 1.32px down with a translate; the bar is not an
     ancestor of the fullscreen panel, so dropping it is safe. */
  .et-l--header .et_pb_module .mobile_menu_bar {
    transform: none;
  }
  body #page-container .et-l--header .et_pb_section:not(.dw-promo) .et_pb_row .et_pb_column:not(:first-child) {
    margin-left: auto !important;
    flex: none;
    width: auto !important;
  }
  body #page-container .et-l--header .et_pb_section:not(.dw-promo) a.et_pb_button {
    height: 44px;
    min-height: 44px !important;
    padding: 0 16px !important;
    font-size: 15px !important;
    line-height: 20px !important;
  }
}

/* Tablet (768-980) burger, same defect as on the phone (t_46b14e4f): Divi's
 * 6px margin-right on .et_mobile_nav_menu put the burger 6px from the edge
 * while logo and promo sit on the 32px row inset, and Divi's 1.32px translate
 * left it 1.3px below the band centre. Burger now on the 32px inset, the CTA
 * keeps its 8px gap to it (32 + 44 + 8 = 84px row padding). */
@media (min-width: 768px) and (max-width: 980px) {
  .et-l--header .et_pb_row_1_tb_header.et_pb_row {
    padding-right: 84px !important;
  }
  .et-l--header .et_pb_section:not(.dw-promo) .et_pb_row::before,
  .et-l--header .et_pb_section:not(.dw-promo) .et_pb_row::after {
    display: none;
  }
  .et-l--header .et_mobile_nav_menu {
    right: 32px;
    margin-right: 0 !important;
  }
  .et-l--header .et_pb_module .mobile_menu_bar {
    transform: none;
  }
}

/* Webcast pages (6123 /webcast, 6339 /webcast/webcast-2), t_48ef59ad: rebuilt
 * from the Tutorial hero. Same rhythm as V4 Tutorial: breadcrumb -> H1 22px.
 * Divi's gutter-2 module margin (1.5% = 18px at 1440) sits under the
 * breadcrumb otherwise; the module's own margin setting loses to it. */
body:is(.page-id-6123, .page-id-6339) #page-container .et-l--post .et_pb_breadcrumbs {
  margin-bottom: 0 !important;
}

/* ---------------------------------------------------------------------------
 * V5 Vollreview 11-05 (t_4cb4825c). Implementation errors found in the
 * section-by-section vision pass (1440 vs page artboard, 390 vs Mobil.dc.html).
 * FIXPLAN: divi-world/assets/qa/2026-11-05-vollreview/FIXPLAN.md.
 * ------------------------------------------------------------------------- */

/* V5-1 Footer, phone (Mobil Z. 340-355): padding 40/20/48, logo 126 wide
 * (icon 20 + wordmark 20), no description, link groups as one inline line
 * "Test · Kaufen · Anleitung · Child Theme", 16/500 #4a423f, titles 700.
 * Click targets stay 44 high (Mobil rule Z. 53), so the title loses its own
 * 10px padding (the 44 line already carries ~9 above the text) and the second
 * group moves up to keep the 18 rhythm of the comp. */
@media (max-width: 767px) {
  .et-l--footer .et_pb_section_0_tb_footer.et_pb_section {
    padding: 40px 0 48px !important;
  }
  .et-l--footer .et_pb_row_0_tb_footer.et_pb_row > .et_pb_column:first-child {
    margin-bottom: 0 !important;
  }
  .et-l--footer .et_pb_image_0_tb_footer.et_pb_module {
    margin: 0 !important;
    padding: 0 !important;
  }
  .et-l--footer .et_pb_image_0_tb_footer img {
    width: 126px !important;
    height: auto !important;
  }
  .et-l--footer .et_pb_text_0_tb_footer.et_pb_module {
    display: none !important;
  }
  .et-l--footer .et_pb_row_0_tb_footer.et_pb_row > .et_pb_column:nth-child(4) {
    margin-top: -4px !important;
  }
  .et-l--footer .et_pb_row_0_tb_footer ul {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    color: #4a423f;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
  }
  .et-l--footer .et_pb_row_0_tb_footer li {
    display: inline !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
  }
  /* Dot stays at the line end when the group wraps (comp: "Datenschutz ·"). */
  .et-l--footer .et_pb_row_0_tb_footer li:not(:last-child)::after {
    content: "\00a0· ";
    color: #4a423f;
  }
  /* Inline links: 10px of invisible padding gives a ~46px tap area without
   * changing the 1.6 line rhythm of the comp. */
  .et-l--footer .et_pb_row_0_tb_footer li a {
    display: inline !important;
    min-height: 0 !important;
    padding: 10px 0 !important;
    margin: -10px 0 !important;
    color: #4a423f !important;
    text-decoration: none !important;
  }
}

/* V5-2b Home path cards, phone (Mobil Z. 240-270): number, title, text 10
 * apart (flex gap), button 4 more (14). Staging stacked module paddings 24/14/16. */
@media (max-width: 767px) {
  body.home #page-container .dw-path-cards > .et_pb_column {
    gap: 10px !important;
  }
  body.home #page-container .dw-path-cards > .et_pb_column > .et_pb_module {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
  body.home #page-container .dw-path-cards > .et_pb_column > .et_pb_button_module_wrapper {
    margin-top: 4px !important;
  }
}

/* V5-2 Home path cards: the button labels end in an arrow on every width
 * ("Divi Theme Test →", "Preise & Rabatt →", "Zur Anleitung →"; Main and
 * Mobil Z. 252ff). Divi's ETmodules ::after is replaced by a text arrow. */
body #page-container .et_pb_section .dw-path-cards a.et_pb_button::after,
body #page-container .et_pb_section .dw-path-cards a.et_pb_button:hover::after {
  content: "\00a0\2192" !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  display: inline !important;
  position: static !important;
  opacity: 1 !important;
  margin: 0 !important;
  transform: none !important;
}

/* V5-3 Home comparison table, phone (Mobil Z. 284-300): no frame, edge-to-edge
 * rail with 20 inset, label "Tabelle seitlich scrollbar →" above, light header
 * (Kriterium mono on transparent, Divi 5 Sora 18/800 on orange with 14 top
 * radii, others 700 #4a423f), 3px ink rule under the header, Divi column
 * oklch(0.95 0.03 45), 1px #e2dbd4 row rules, 15/500 cells, first column
 * 700 without left padding. 1440 keeps the Main ink band (PASS there). */
@media (max-width: 767px) {
  body #page-container .dw-compare .et_pb_text:has(.dw-table)::before {
    content: "Tabelle seitlich scrollbar \2192";
    display: block;
    margin: -18px 0 16px;
    font-family: "IBM Plex Mono", ui-monospace, monospace;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 1.4;
    text-transform: uppercase;
    color: #6b6259;
  }
  body #page-container .dw-compare .et_pb_text_inner:has(> .dw-table) {
    border: 0 !important;
    border-radius: 0 !important;
    margin: 0 -20px !important;
    padding: 0 20px 0 20px !important;
  }
  body #page-container .dw-table {
    min-width: 640px;
  }
  body #page-container .dw-table thead tr {
    background: transparent !important;
  }
  body #page-container .dw-table thead th {
    background: transparent !important;
    color: #4a423f !important;
    font-family: "DM Sans", sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    padding: 10px 14px !important;
    border-bottom: 3px solid var(--dw-ink) !important;
    vertical-align: bottom;
  }
  body #page-container .dw-table thead th:first-child {
    font-family: "IBM Plex Mono", ui-monospace, monospace !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: #5c534f !important;
    padding: 10px 14px 10px 0 !important;
  }
  body #page-container .dw-table thead th.dw-table__hero {
    background: #ea8e64 !important;
    color: var(--dw-ink) !important;
    font-family: "Sora", sans-serif !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
    text-transform: none !important;
    padding: 14px !important;
    border-radius: 14px 14px 0 0 !important;
    border-bottom: 0 !important;
  }
  body #page-container .dw-table tbody tr {
    border-top: 0 !important;
  }
  body #page-container .dw-table tbody th,
  body #page-container .dw-table tbody td {
    font-size: 15px !important;
    font-weight: 500 !important;
    padding: 14px !important;
    border-bottom: 1px solid #e2dbd4 !important;
  }
  body #page-container .dw-table tbody :is(th, td):first-child {
    font-weight: 700 !important;
    padding-left: 0 !important;
  }
  body #page-container .dw-table tbody .dw-table__hero {
    background: oklch(0.95 0.03 45) !important;
    border-bottom: 0 !important;
  }
}

/* V5-4 Blog featured card, phone (Mobil Z. 429-441): card padding 14, image
 * 3/2 with radius 20, 14 to the text block, text block inset 0 10 12. */
@media (max-width: 767px) {
  body #page-container .et-l--body .dw-featured .et_pb_post {
    padding: 14px !important;
    row-gap: 12px !important;
    border-radius: 28px;
  }
  body #page-container .et-l--body .dw-featured .entry-featured-image-url {
    aspect-ratio: 3 / 2;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 2px !important;
  }
  body #page-container .et-l--body .dw-featured .entry-featured-image-url img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
  body #page-container .et-l--body .dw-featured .et_pb_post > :not(.entry-featured-image-url) {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  body #page-container .et-l--body .dw-featured .et_pb_post.clearfix::after {
    margin: 0 10px 12px !important;
  }
}

/* V5-5 "Das passt dazu", phone (Mobil Z. 611ff): heading only, no "Alle
 * Beiträge" link; card images 3/2 with radius 20 (were 4:3). */
@media (max-width: 767px) {
  body #page-container .et-l--body .dw-post-more {
    display: none !important;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container,
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container a {
    display: block;
    aspect-ratio: 3 / 2;
    border-radius: 20px;
    overflow: hidden;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
}

/* V5-6 Post tag chips (Beitrag Z. 152f, Mobil Z. 591ff): "#Divi 5" in DM Sans
 * 15/600, normal case, padding 9/16 (phone 10/16), 8 apart on the phone. */
body #page-container .dw-tags a {
  font-family: "DM Sans", sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
body #page-container .dw-tags a::before {
  content: "#";
}
@media (max-width: 767px) {
  body #page-container .dw-tags .et_pb_text_inner {
    gap: 8px;
  }
  body #page-container .dw-tags a {
    padding: 10px 16px !important;
  }
}

/* V5-7 Fluent Form on the phone (Mobil rule Z. 53): input text 16px (no iOS
 * zoom), fields 52 high, submit full width at 52. The form styling itself is
 * a design gap (design/briefs/2026-11-04-formulare.md). */
@media (max-width: 767px) {
  body #page-container .fluentform .ff-el-form-control {
    font-size: 16px !important;
    min-height: 52px;
    padding: 14px 16px !important;
  }
  body #page-container .fluentform textarea.ff-el-form-control {
    min-height: 120px;
  }
  body #page-container .fluentform .ff_submit_btn_wrapper,
  body #page-container .fluentform .ff-el-group.ff_submit_btn_wrapper {
    text-align: center;
  }
  body #page-container .fluentform .ff-btn-submit {
    display: block !important;
    width: 100% !important;
    min-height: 52px;
    font-size: 16px !important;
    font-weight: 700 !important;
  }
}

/* V5-8 Kaufen sales band: "Countdown abgelaufen? Cookies löschen und neu
 * laden." is Plex Mono 14/500 in sentence case (Kaufen Z. 184), not caps. */
body.postid-4373 #page-container .et_pb_row_9 .et_pb_text_45,
body.postid-4373 #page-container .et_pb_row_9 .et_pb_text_45 p {
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* V5-9 Author box, phone (Mobil Z. 594-598): avatar 48 above the name, one
 * column, gap 10, padding 24. Desktop keeps avatar beside name. */
@media (max-width: 767px) {
  body #page-container .dw-author-box {
    grid-template-columns: minmax(0, 1fr) !important;
    row-gap: 10px !important;
    padding: 24px !important;
  }
  body #page-container .dw-author-box > :is(.dw-author-avatar, .dw-author-name, .dw-author-bio) {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
  body #page-container .dw-author-avatar {
    width: 48px !important;
    height: 48px !important;
  }
  body #page-container .dw-author-avatar .et_pb_text_inner {
    min-height: 48px;
    width: 48px;
    font-size: 17px;
  }
}

/* V5-10 Category badges on post cards (Main, Blog, Beitrag, Mobil: every
 * "News"/"Tutorial" chip): DM Sans 13/700, tracking 0.08em, uppercase,
 * padding 5/13. td-876356 had set them in Plex Mono 500/0.1em; no artboard
 * of 3.1 does that. Colours per category stay as they are. */
body #page-container .et_pb_blog_posts .post-meta a[rel~="category"],
body #page-container .et_pb_blog_posts .post-meta a[rel~="tag"] {
  font-family: "DM Sans", sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  padding: 5px 13px !important;
}

/* V5-11 Desktop header vs Main/Kaufen artboards (1440). (a) The promo bar is
 * one centred line (artboard: justify-content center, 16 between chip, text
 * and link), chip 700 with 0.08em tracking; staging sat left on the content
 * inset. (b) Logo: the artboard lockup is globe 34 + Sora 24 wordmark, ~160
 * wide; the logo asset (164.7:26) at 34 high came out 216 wide with a 34px
 * wordmark. At its natural 26 it has the artboard's footprint and wordmark
 * size, the same width-matching the phone header uses (24 high = Mobil).
 * (c) Nav items 4 apart (artboard gap 4 + link padding 14); Divi's li padding
 * of 11 per side made them 22+28 apart. Phone header (t_46b14e4f) untouched. */
@media (min-width: 768px) {
  .et-l--header .dw-promo .et_pb_text_inner > p {
    text-align: center;
  }
  .et-l--header .dw-promo .dw-promo__chip {
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-right: 12px;
  }
  .et-l--header .dw-promo .et_pb_text_inner > p > a {
    margin-left: 12px;
  }
  .et-l--header .et_pb_menu__logo-wrap img {
    height: 26px !important;
    max-height: 26px !important;
  }
}
@media (min-width: 981px) {
  .et-l--header .et_pb_menu__menu > nav > ul > li {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 4px !important;
  }
}

/* V5-12 Post hero (Beitrag.dc.html Z. 101-125, Mobil #beitrag): lead 21/1.55
 * 500 #2c1712 max 56ch; byline 6 below with avatar 40 "dw" (Sora 700 15),
 * name 16/700, meta Plex Mono 14 #4a2a20, 16 apart; featured image 16:9,
 * radius 26, inset 1000/32, 32 into the hero; body 56 below it.
 * Phone: lead 18, byline = avatar 36 + mono 13 "Redaktion · date · N Min.",
 * image inset 20, 24 into the hero, radius 22. Markup: functions.php
 * dworld_post_hero_31 (replaces Divi's "von … | date | cat" meta line). */
body.single-post #page-container .et_pb_post_title_0_tb_body .et_pb_title_container {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
body.single-post #page-container .et_pb_post_title_0_tb_body .entry-title {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
body.single-post #page-container .dw-post-lead {
  margin: 0;
  padding: 0;
  max-width: 56ch;
  font-family: "DM Sans", sans-serif;
  font-size: 21px;
  line-height: 1.55;
  font-weight: 500;
  color: #2c1712;
  text-wrap: pretty;
}
body.single-post #page-container .dw-post-byline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  padding-top: 6px;
}
body.single-post #page-container .dw-post-byline__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: var(--dw-ink);
  color: #fff3e8;
  font-family: "Sora", sans-serif;
  font-size: 15px;
  font-weight: 700;
  margin-right: -6px; /* avatar -> name 10 (artboard), name -> meta 16 */
}
body.single-post #page-container .dw-post-byline__name {
  font-family: "DM Sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--dw-ink);
}
body.single-post #page-container .dw-post-byline__meta {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 14px;
  font-weight: 500;
  color: #4a2a20;
  letter-spacing: 0;
  text-transform: none;
}
body.single-post #page-container .dw-post-byline__short {
  display: none;
}
body.single-post .dw-post-hero-image {
  position: relative;
  z-index: 2;
  max-width: 1000px;
  margin: -32px auto 0;
  padding: 0 32px;
  box-sizing: border-box;
}
body.single-post .dw-post-hero-image__img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 26px;
}
@media (max-width: 767px) {
  body.single-post #page-container .et_pb_post_title_0_tb_body .et_pb_title_container {
    gap: 16px;
  }
  body.single-post #page-container .dw-post-lead {
    font-size: 18px;
  }
  body.single-post #page-container .dw-post-byline {
    gap: 10px;
    padding-top: 4px;
    flex-wrap: nowrap;
  }
  body.single-post #page-container .dw-post-byline__avatar {
    width: 36px;
    height: 36px;
    font-size: 14px;
    margin-right: 0;
  }
  body.single-post #page-container .dw-post-byline__name,
  body.single-post #page-container .dw-post-byline__long {
    display: none;
  }
  body.single-post #page-container .dw-post-byline__short {
    display: inline;
  }
  body.single-post #page-container .dw-post-byline__meta {
    font-size: 13px;
    line-height: 1.4;
  }
  body.single-post .dw-post-hero-image {
    margin-top: -24px;
    padding: 0 20px;
  }
  body.single-post .dw-post-hero-image__img {
    border-radius: 22px;
  }
}

/* V5-12b Post breadcrumb + phone hero rhythm (Beitrag Z. 101-106, Mobil Z.
 * 528-535). Trail "Startseite / Blog / Kategorie" (functions.php
 * dworld_post_breadcrumb_31), separators at half strength, last item ink.
 * Phone: no "Startseite", hero padding 20/20/40, 16 between breadcrumb, H1,
 * lead and byline (Divi's module paddings 22/10 removed). */
body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body .et_pb_breadcrumbs--separator {
  opacity: 0.5;
}
body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body .dw-bc-last {
  color: var(--dw-ink) !important;
}
body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_post_title_0_tb_body {
  padding-bottom: 0 !important;
}
@media (max-width: 767px) {
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body {
    padding-top: 20px !important;
    padding-bottom: 40px !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_breadcrumbs_0_tb_body {
    padding-bottom: 16px !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body .et_pb_breadcrumbs--home,
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body .et_pb_breadcrumbs--home + .et_pb_breadcrumbs--separator {
    display: none !important;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_section_0_tb_body .et_pb_breadcrumbs--separator {
    opacity: 1;
    color: #6b4030;
  }
  body.single-post:not(.et_pb_pagebuilder_layout) #page-container .et_pb_post_title_0_tb_body .entry-title {
    font-size: 36px !important;
    line-height: 0.96 !important;
    letter-spacing: -0.05em !important;
  }
}

/* V5-11b Desktop header width (Main/Kaufen/Beitrag 1440): the nav row runs
 * the full width with 32 inset (logo at x 32, CTA ends at 1408); staging sat
 * on the 1216 content grid. Anchor items (#vergleich) must not show the
 * current-item pill; the artboard marks no item as active on the home page. */
@media (min-width: 981px) {
  .et-l--header .et_pb_section:not(.dw-promo) .et_pb_row {
    width: 100% !important;
    max-width: none !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
    box-sizing: border-box !important;
  }
  .et-l--header .et_pb_menu__menu li.current-menu-item:has(> a[href*="#"]) > a {
    background: transparent !important;
  }
}

/* V6-1 Desktop promo + header rhythm vs Main.dc.html @1440 (t_a2edef17).
 * Artboard: promo bar 51 high (12 + chip 27 + 12), chip padding 5/14 at 13px;
 * header 87 high (20 + CTA 47 + 20), CTA line-height normal (21 at 16px),
 * nav links 40 high (padding 10/14, 15px line-height normal = 20).
 * Staging had bar 59, chip 31, header 92, CTA 52, links 44. Desktop only;
 * the phone promo/header (t_46b14e4f) is untouched. */
@media (min-width: 981px) {
  .et-l--header .et_pb_section.dw-promo {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
  .et-l--header .dw-promo .et_pb_text_inner > p {
    line-height: 27px;
  }
  .et-l--header .dw-promo .dw-promo__chip {
    padding: 5px 14px;
    line-height: 17px;
  }
  .et-l--header .et_pb_menu__menu > nav > ul > li > a {
    padding: 10px 14px !important;
    line-height: 20px !important;
    min-height: 0 !important;
    height: 40px !important;
    align-self: center;
  }
  body #page-container .et-l--header .et_pb_section:not(.dw-promo) a.et_pb_button {
    line-height: 21px !important;
  }
}

/* V6-2 Desktop footer per Blog/Kaufen/Beitrag/Test/Tutorial 1440 (t_a2edef17).
 * Artboard footer: 1280 max, padding 56/32/64, brand block (max 280) left,
 * the three link lists grouped on the right, 64 apart (ends at x 1328);
 * logo row 28 then 12 to the text; list items line-height normal (21) with
 * 10 between, heading the first item. Staging spread four equal 268 columns
 * and put the text 73 below the logo top. Logo asset 22 high so the wordmark
 * matches the artboard's Sora 20 (same width-matching as the header). */
@media (min-width: 981px) {
  .et-l--footer .et_pb_row_0_tb_footer.et_pb_row {
    grid-template-columns: minmax(0, 1fr) max-content max-content max-content;
    column-gap: 64px;
  }
  .et-l--footer .et_pb_row_0_tb_footer.et_pb_row > .et_pb_column:first-child {
    max-width: 280px;
  }
  .et-l--footer .et_pb_image_0_tb_footer.et_pb_module {
    padding: 3px 0 15px !important;
    margin: 0 !important;
  }
  .et-l--footer .et_pb_image_0_tb_footer img {
    height: 22px !important;
    width: auto !important;
    display: block;
  }
  .et-l--footer .et_pb_text_0_tb_footer p {
    line-height: 1.65;
  }
  .et-l--footer .et_pb_row_0_tb_footer > .et_pb_column:not(:first-child) .et_pb_text.et_pb_module:first-child {
    padding-bottom: 10px !important;
  }
  .et-l--footer .et_pb_row_0_tb_footer > .et_pb_column:not(:first-child) p,
  .et-l--footer .et_pb_row_0_tb_footer > .et_pb_column:not(:first-child) li {
    line-height: 21px;
  }
  .et-l--footer .et_pb_row_0_tb_footer li a {
    color: #4a423f;
  }
  .et-l--footer .et_pb_row_0_tb_footer li a:hover {
    color: var(--dw-ink);
  }
}

/* V6-3 Home marquee per Main.dc.html (desktop) and Mobil (phone), t_a2edef17.
 * Separators are elements now (theme/scripts/marquee-separators.php):
 * Main: items 32 apart, star at opacity .45, band 16 + 17 + 16 = 49;
 * Mobil: 26 apart, star #6b6259. Staging band was 18 + 21 + 18 = 57. */
.dw-marquee .dw-marquee__sep {
  display: inline-block;
  margin: 0 32px;
  opacity: 0.45;
}
@media (min-width: 981px) {
  body.home #page-container .et_pb_section_0 > .dw-marquee {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
  .dw-marquee .et_pb_text_inner,
  .dw-marquee .et_pb_text_inner p {
    line-height: 17px !important;
  }
  .dw-marquee .et_pb_text_inner {
    padding-left: 32px;
    vertical-align: top;
  }
  .dw-marquee .et_pb_text {
    line-height: 17px !important;
  }
  /* Hero lead 22/1.55 (34.1) per Main; staging 1.5 put the marquee 3 higher. */
  body.home #page-container .et_pb_section_0 .et_pb_text_0 p {
    line-height: 1.55 !important;
  }
}
@media (max-width: 767px) {
  .dw-marquee .dw-marquee__sep {
    margin: 0 26px;
    opacity: 1;
    color: #6b6259;
  }
}

/* V6-4 Kaufen price cards per Kaufen.dc.html 1440 (t_a2edef17). Card column
 * gap 16: price (54 high) -> VAT note 16, note -> intro 16; VAT note in
 * sentence case ("mit 19 % USt"), not uppercase; list -> button 62; affiliate
 * note 14/normal; card padding 44 all round; cards -> tip panel 34.
 * Staging was 15 shorter per card and 18 more before the tip. */
@media (min-width: 981px) {
  body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_4, .et_pb_text_11) {
    padding-bottom: 16px !important;
  }
  body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_4, .et_pb_text_11) p {
    line-height: 54px !important;
  }
  body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_5, .et_pb_text_12) {
    padding-bottom: 16px !important;
  }
  body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_5, .et_pb_text_12) p {
    text-transform: none !important;
  }
  body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_7, .et_pb_text_14) {
    padding-bottom: 36px !important;
  }
  body.postid-4373 #page-container .et_pb_row_2 :is(.et_pb_text_8, .et_pb_text_15) p {
    font-size: 14px !important;
    line-height: 18px !important;
  }
  body.postid-4373 #page-container .et_pb_row_2 > :is(.et_pb_column_3, .et_pb_column_4) {
    padding-bottom: 44px !important;
  }
  /* row_2 already ends 24 below the cards (flex row-gap + clearfix item) */
  body.postid-4373 #page-container .et_pb_row_3 {
    padding-top: 10px !important;
  }
}

/* V6-5 Kaufen hero + "Gekauft?" band per Kaufen.dc.html 1440 (t_a2edef17):
 * breadcrumb 13/normal (17 high, staging 14/23.8 pushed the H1 7 lower);
 * disclosure 14/normal (2 lines in 580), staging 15/23.25 (47 high). */
@media (min-width: 981px) {
  body.postid-4373 #page-container .et_pb_breadcrumbs_0,
  body.postid-4373 #page-container .et_pb_breadcrumbs_0 * {
    font-size: 13px !important;
    line-height: 17px !important;
  }
  body.postid-4373 #page-container .et_pb_text_54 p {
    font-size: 14px !important;
    line-height: 18px !important;
  }
}

/* V6-6 Blog archive hero per Blog.dc.html 1440 (t_a2edef17): breadcrumb
 * 13/normal, letter-spacing .1em, gap 10 around "/", home link #4a2a20,
 * current item ink (staging had 14/23.8 and the colours swapped); search pill
 * 294x47 with the field text at 500. */
@media (min-width: 981px) {
  body #page-container .dw-archive-header-row .et_pb_breadcrumbs,
  body #page-container .dw-archive-header-row .et_pb_breadcrumbs * {
    font-size: 13px !important;
    line-height: 17px !important;
    letter-spacing: 1.3px !important;
  }
  body #page-container .dw-archive-header-row .et_pb_breadcrumbs--home {
    color: #4a2a20 !important;
  }
  body #page-container .dw-archive-header-row .et_pb_breadcrumbs--current {
    color: #17100f !important;
  }
  body #page-container .dw-archive-header-row .et_pb_breadcrumbs--separator {
    margin: 0 10px !important;
    opacity: .5;
  }
  body #page-container .dw-archive-header-row .dw-search-form {
    width: 294px;
    height: 47px;
    margin-left: auto;
  }
  body #page-container .dw-archive-header-row .dw-search-form input {
    font-weight: 500;
  }
}

/* V6-7 Dark newsletter band per Blog/Beitrag/Tutorial 1440 (t_a2edef17):
 * two 580 columns 56 apart, vertically centred; no signup padding; field
 * 58 high (18/22, 17px), button 18/30 17px, gap 10; note 15/normal 16 below.
 * Staging had a 25/25/16 module padding, a 52 field and a 124 button, which
 * pushed the form 25 right and the band 30-38 taller. Home (Main) draws a
 * different variant (width band, 52 field); staging follows the majority,
 * like header and footer (V6-1/V6-2). The post sidebar box is 1/3 and stays. */
@media (min-width: 981px) {
  body #page-container .et_pb_row:has(> .et_pb_column_1_2 > .et_pb_signup) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 56px;
    align-items: center;
  }
  body #page-container .et_pb_row:has(> .et_pb_column_1_2 > .et_pb_signup) > .et_pb_column {
    width: auto !important;
    margin-right: 0 !important;
    float: none !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup {
    padding: 0 !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup .et_pb_newsletter_fields {
    gap: 10px !important;
    flex-wrap: nowrap !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup .et_pb_newsletter_field {
    flex: 1 1 auto !important;
    width: auto !important;
    margin: 0 !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup input.input {
    height: 58px !important;
    padding: 18px 22px !important;
    font-size: 17px !important;
    line-height: normal !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup .et_pb_newsletter_button_wrap {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  body #page-container .et_pb_section .et_pb_column_1_2 > .et_pb_signup.et_pb_subscribe .et_pb_newsletter_button.et_pb_button {
    padding: 18px 30px !important;
    font-size: 17px !important;
    line-height: 22px !important;
  }
  body #page-container .et_pb_section .et_pb_column_1_2 > .et_pb_signup .et_pb_newsletter_button_text {
    font-size: 17px !important;
    line-height: 22px !important;
  }
  /* Blog band 80/80 like posts (S3h); it kept 88 on top. V6-24 (t_51e78efb):
   * category/tag/date archives and search use the same TB archive template and
   * still had 88 (band 282 vs 274), so .archive and .search are included. */
  body:is(.blog, .archive, .search) #page-container .et-l--body .et_pb_section:has(.et_pb_column_1_2 > .et_pb_signup) {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup + .et_pb_text {
    margin-top: 16px !important;
  }
  body #page-container .et_pb_column_1_2 > .et_pb_signup + .et_pb_text p {
    font-size: 15px !important;
    line-height: 20px !important;
  }
}

/* V6-8 Divi-Test hero + "Für wen" per Test.dc.html 1440 (t_a2edef17).
 * Hero: breadcrumb 13/17 .1em (Test: one 17 line, staging 14/23.8); lead
 * #2c1712 with text-wrap pretty like the artboard; score card stack 20 apart
 * (Testurteil kicker had 16), "/ 5" #c4b8b1 at line-height normal (card 469).
 * Für wen: list lines 27.2 (staging 26), kickers forest/clay, the "Eher
 * nicht" card's dashed border and dots #d9b3a0 (staging #ea8e64). */
@media (min-width: 981px) {
  body.postid-7001 #page-container .et_pb_section_0 .et_pb_breadcrumbs_0,
  body.postid-7001 #page-container .et_pb_section_0 .et_pb_breadcrumbs_0 * {
    font-size: 13px !important;
    line-height: 17px !important;
    letter-spacing: 1.3px !important;
  }
  body.postid-7001 #page-container .et_pb_section_0 .et_pb_breadcrumbs--separator {
    margin: 0 10px !important;
    opacity: .5;
  }
  body.postid-7001 #page-container .et_pb_section_0 .et_pb_text_0 p {
    color: #2c1712 !important;
    text-wrap: pretty;
  }
  body.postid-7001 #page-container .dw-score-card > .et_pb_text:first-child {
    padding-bottom: 20px !important;
  }
  body.postid-7001 #page-container .dw-score-card .dw-score__number {
    line-height: 51px !important;
  }
  body.postid-7001 #page-container .dw-score-card .dw-score__outof {
    line-height: normal !important;
    color: #c4b8b1 !important;
  }
  /* equal outer widths (598): flex-basis 0 gave the bordered card 4 more */
  body.postid-7001 #page-container .et_pb_section_1 .dw-cards > .et_pb_column {
    flex: 0 0 calc(50% - 10px) !important;
    min-width: 0;
  }
  body.postid-7001 #page-container .et_pb_section_1 .dw-cards li {
    line-height: 27.2px !important;
  }
  body.postid-7001 #page-container .et_pb_section_1 .et_pb_column_3 .et_pb_text:first-child p {
    color: #2c4b3e !important;
  }
  body.postid-7001 #page-container .et_pb_section_1 .et_pb_column_4 .et_pb_text:first-child p {
    color: #a84f2c !important;
  }
  body.postid-7001 #page-container .et_pb_section_1 .et_pb_column_4 {
    border-color: #d9b3a0 !important;
  }
  body.postid-7001 #page-container .et_pb_section_1 .et_pb_column_4 li::before {
    background-color: #d9b3a0 !important;
  }
}

/* V6-9 Post sidebar per Beitrag.dc.html 1440 (t_a2edef17). TOC: entries at
 * 500 in #4a423f, only the active one 700 ink on clay (design.css set every
 * entry 700). Newsletter box: no fill, 1px #e7e0d9 hairline, radius 22;
 * label 13/normal; field 13/16 16px with a 1px #ded6ce border (49 high);
 * button 13/20 16px (47 high); box 260 like the artboard (staging 270). */
@media (min-width: 981px) {
  body #page-container .et-l--body .et_pb_table_of_contents__nav a:not(.et_pb_table_of_contents__link--active):not([aria-current="location"]) {
    font-weight: 500;
    color: #4a423f;
  }
  body #page-container .et-l--body .et_pb_table_of_contents__nav a {
    font-size: 16px !important;
    line-height: 22.4px !important;
  }
  body #page-container .et-l--body .et_pb_column_1_3 .et_pb_group:has(> .dw-signup) {
    background-color: transparent !important;
    border: 1px solid #e7e0d9 !important;
    border-radius: 22px !important;
  }
  body #page-container .et-l--body .et_pb_column_1_3 .et_pb_group:has(> .dw-signup) > .et_pb_text:first-child,
  body #page-container .et-l--body .et_pb_column_1_3 .et_pb_group:has(> .dw-signup) > .et_pb_text:first-child p {
    line-height: 17px !important;
  }
  body #page-container .et-l--body .et_pb_column_1_3 .dw-signup input.input {
    height: 49px !important;
    padding: 13px 16px !important;
    font-size: 16px !important;
    border: 1px solid #ded6ce !important;
  }
  body #page-container .et_pb_section .et-l--body .et_pb_column_1_3 .dw-signup.et_pb_subscribe .et_pb_newsletter_button.et_pb_button,
  body #page-container .et-l--body .et_pb_section .et_pb_column_1_3 .dw-signup.et_pb_subscribe .et_pb_newsletter_button.et_pb_button {
    padding: 13px 20px !important;
    font-size: 16px !important;
    line-height: 21px !important;
  }
  body #page-container .et-l--body .et_pb_column_1_3 .dw-signup .et_pb_newsletter_button_text {
    line-height: 21px !important;
  }
}

/* V6-10 Post lead paragraph per Beitrag.dc.html 1440 (t_a2edef17): the first
 * paragraph of the article is the lead, 21/1.65 ink at 500 (Mobil: 18, left
 * to mobile-390.css). Body copy stays dw-text #4a423f per tokens.json; the
 * artboard's #332c2a is off-token (design-system wins, noted for the brief). */
@media (min-width: 981px) {
  body.single-post #page-container .et_pb_post_content > p:first-child {
    font-size: 21px !important;
    line-height: 1.65 !important;
    font-weight: 500 !important;
    color: #17100f !important;
  }
}

/* V6-11 "Das passt dazu" per Beitrag.dc.html 1440 (t_a2edef17): heading row
 * with "Alle Beiträge" flush right and 40 above the cards (staging: link in a
 * 1/3 column at x 967, cards touching the H2); card = image 3:2 (259), the
 * category chip, title 24/1.2 at 700, excerpt 16/1.6 500 dw-text, 14 apart.
 * The Beitrag card shows no date, so the meta line keeps only the chip. */
@media (min-width: 981px) {
  body #page-container .et_pb_section:has(.dw-related-cards) > .et_pb_row:first-child {
    display: flex !important;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 40px !important;
  }
  body #page-container .et_pb_section:has(.dw-related-cards) > .et_pb_row:first-child > .et_pb_column {
    width: auto !important;
    margin-right: 0 !important;
  }
  body #page-container .et_pb_section:has(.dw-related-cards) > .et_pb_row:first-child > .et_pb_column:last-child {
    text-align: right;
    margin-left: auto !important;
  }
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post::before,
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post::after {
    display: none !important;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container {
    height: auto !important;
    line-height: 0;
    aspect-ratio: 3 / 2 !important;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container a {
    display: block;
  }
  body #page-container .dw-related-cards .et_pb_post .entry-title {
    margin: 0 !important;
  }
  body #page-container .dw-related-cards .et_pb_blog_posts > .et_pb_post {
    display: flex !important;
    flex-direction: column;
    gap: 14px;
  }
  body #page-container .dw-related-cards .et_pb_post > * {
    margin: 0 !important;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container {
    order: 1;
  }
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container a,
  body #page-container .dw-related-cards .et_pb_post .et_pb_image_container img {
    margin: 0 !important;
    aspect-ratio: 3 / 2;
    width: 100%;
    height: auto !important;
    object-fit: cover;
  }
  body #page-container .dw-related-cards .et_pb_post .post-meta {
    order: 2;
    font-size: 0 !important;
    line-height: 0 !important;
    margin: 0 !important;
  }
  body #page-container .dw-related-cards .et_pb_post .post-meta .published {
    display: none !important;
  }
  body #page-container .dw-related-cards .et_pb_post .post-meta .entry-categories a {
    display: inline-block;
    font-size: 13px !important;
    line-height: 17px !important;
  }
  body #page-container .dw-related-cards .et_pb_post .entry-title {
    order: 3;
  }
  body #page-container .dw-related-cards .et_pb_post .entry-title,
  body #page-container .dw-related-cards .et_pb_post .entry-title a {
    font-weight: 700 !important;
  }
  body #page-container .dw-related-cards .et_pb_post .post-content {
    order: 4;
  }
  body #page-container .dw-related-cards .et_pb_post .post-content-inner p {
    font-size: 16px !important;
    line-height: 25.6px !important;
    font-weight: 500 !important;
    color: #4a423f !important;
  }
}

/* V6-12 Post author box per Beitrag.dc.html 1440 (t_a2edef17): the name
 * (Sora 24/700) sits on the article's 1.65 line (39.6), box 154 high;
 * staging used 1.2 (28.8) and ended 10 short. */
@media (min-width: 981px) {
  body #page-container .dw-author-box h4.et_pb_module_header {
    line-height: 39.6px !important;
  }
}

/* V6-13 Active "Blog" nav pill per Blog.dc.html / Beitrag.dc.html 1440
 * (t_a2edef17): ink at 12 % behind the Blog item on the archive and on
 * regular posts. The menu holds custom links only, so WP sets no current
 * class; the hub posts Divi-Test (7001) and Kaufen (4373) show no active item
 * in their artboards, neither do Main and Tutorial. */
@media (min-width: 981px) {
  /* V6-15 (t_cbc4f59f): .archive instead of .category, so tag, author and
   * date archives (same Theme Builder archive template) get the pill too. */
  body:is(.blog, .archive, .single-post):not(.postid-7001):not(.postid-4373) #page-container .et-l--header .et_pb_menu_page_id-8335 > a {
    background-color: rgba(23, 16, 15, .12) !important;
  }
}

/* V6-14 Active nav pill on the Test (post 7001) and Tutorial (page 4462)
 * hubs per Test.dc.html / Tutorial.dc.html 1440 (t_cbc4f59f). WP only sets
 * current-menu-item on these custom links when the request URI matches
 * exactly, so any query string (?utm_source=…, ?nocache=…) dropped the pill.
 * Bind it to the body class like the Blog pill (V6-13). Desktop only; the
 * phone panel is owned by mobile-390.css. */
@media (min-width: 981px) {
  body.postid-7001 #page-container .et-l--header .et_pb_menu__menu .et_pb_menu_page_id-8333 > a,
  body.page-id-4462 #page-container .et-l--header .et_pb_menu__menu .et_pb_menu_page_id-8334 > a {
    background-color: rgba(23, 16, 15, .12) !important;
  }
}

/* V6-16 Logo lockup size at ≥981 (t_cbc4f59f). Measured on the 1440 crops:
 * the logo asset (164.7:26, globe = wordmark font size) at 26 high drew the
 * header wordmark 126 wide vs the artboards' Sora 24 at 113, and the footer
 * asset at 22 high drew 106 vs the artboards' Sora 20 at 94. Header 24 high
 * = DS Header component (mark 24, gap 8, wordmark 24) and wordmark 116 wide;
 * footer 20 high = wordmark 96 wide. The globe stays = font size per the DS
 * lockup rule (artboards draw it larger: design gap logo-lockup). Footer image
 * padding 4/16 keeps the text 40 below the logo top as before. */
@media (min-width: 981px) {
  .et-l--header .et_pb_menu__logo-wrap img {
    height: 24px !important;
    max-height: 24px !important;
  }
  .et-l--footer .et_pb_image_0_tb_footer.et_pb_module {
    padding: 4px 0 16px !important;
  }
  .et-l--footer .et_pb_image_0_tb_footer img {
    height: 20px !important;
  }
}

/* V6-17 TB "Seite" reading column at ≥981 (t_f97d6dfe). The page template's
 * section_1_tb_body is 720 wide (= Beitrag article column), but its row kept
 * Divi's 80 % width (576, margin 0 72). Legacy builder content inside it
 * (ueber-uns, elegant-themes, divi-theme-links) nested further 80 % rows and
 * floated 1_3/2_3 columns, some empty → text columns of 144–300 px and a
 * counter ("300.000 Kunden") overflowing. Fill the 720 column, lay nested
 * rows out as flex with the column ratios kept, gap 32, drop empty columns.
 * Scope: pages whose post content sits in section_1_tb_body (adhs-apps,
 * impressum, datenschutz, zukunft-wordpress, ueber-uns, elegant-themes,
 * divi-theme-links); /divi-tutorial and single posts don't match. */
@media (min-width: 981px) {
  body.page #page-container .et-l--body .et_pb_section_1_tb_body:has(> .et_pb_row_0_tb_body .et_pb_post_content) > .et_pb_row_0_tb_body {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex !important;
    gap: 32px;
    align-items: flex-start;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row.et_pb_equal_columns {
    align-items: stretch;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row::after {
    display: none !important;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column {
    flex: 1 1 0;
    width: auto !important;
    min-width: 0;
    margin-right: 0 !important;
    float: none !important;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column_2_3 {
    flex-grow: 2;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column_1_4 {
    flex-grow: .75;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column_3_4 {
    flex-grow: 2.25;
  }
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column_empty {
    display: none !important;
  }
}

/* V6-18 Home "Dein Weg" card number 03 at ≥981 (t_f97d6dfe): Main draws
 * 01 clay-dark, 02 and 03 ink; the module setting is sage-dark (the Mobil
 * comp's 03 colour, kept below 981). */
@media (min-width: 981px) {
  body.home #page-container .et_pb_text_7 p {
    color: #17100f !important;
  }
}

/* V6-23 Home "Dein Weg" card 03 body copy at ≥981 (t_51e78efb): Main draws
 * the "Umsetzen" text in ink #17100f; staging kept the Mobil comp's #2f3b35
 * (sage-dark) at all widths. Below 981 Mobil's #2f3b35 stays. */
@media (min-width: 981px) {
  body.home #page-container .et_pb_section_1 .et_pb_text_8 p {
    color: #17100f !important;
  }
}

/* V6-19 Archive pagination prev/next at ≥981 (t_f97d6dfe): Blog 1440 draws
 * text pills "← Neuer" / "Älter →" (padding 12/18, 2 px border, 15 px bold):
 * enabled = ink border, disabled = #e0d8d0 border with meta text. The label
 * span comes from dworld_archive_numbered_pagination(); below 981 it stays
 * hidden so the Mobil arrow circles are unchanged. */
.dw-numbered-pagination .dw-pg-label {
  display: none;
}
@media (min-width: 981px) {
  .dw-numbered-pagination .dw-pg-label {
    display: inline;
    white-space: pre;
  }
  body #page-container .dw-archive-grid .dw-numbered-pagination .page-numbers:is(.prev, .next) {
    flex: 0 0 auto;
    width: auto;
    padding: 0 18px;
    border: 2px solid var(--dw-ink);
    background: transparent;
    font-size: 15px;
  }
  body #page-container .dw-archive-grid .dw-numbered-pagination a.page-numbers:is(.prev, .next):hover,
  body #page-container .dw-archive-grid .dw-numbered-pagination a.page-numbers:is(.prev, .next):focus-visible {
    border-color: var(--dw-ink);
    background: var(--dw-sand);
  }
  body #page-container .dw-archive-grid .dw-numbered-pagination .page-numbers.is-disabled:is(.prev, .next) {
    border-color: #e0d8d0;
    color: var(--dw-meta) !important;
  }
}

/* V6-20 Tutorial hub at ≥981 (t_f97d6dfe), measured against Tutorial 1440:
 * breadcrumb 13/17 with .1em tracking, home #4a2a20, current ink (staging
 * had 14/23.8, colours swapped: hero 7 px taller), like the Blog hero V6-6;
 * chapter list rows 13 + 22 + 13 (+1 rule) = 49/50 like the artboard's
 * line-height normal (staging 26 → each row 4 px taller). */
@media (min-width: 981px) {
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_breadcrumbs,
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_breadcrumbs * {
    font-size: 13px !important;
    line-height: 17px !important;
    letter-spacing: 1.3px !important;
  }
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_breadcrumbs--home {
    color: #4a2a20 !important;
  }
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_breadcrumbs--current {
    color: #17100f !important;
  }
  body.page-id-4462 #page-container .dw-tutorial-list .et_pb_text_inner :is(li, a, .dw-tutorial-link__label, .dw-tutorial-link__arrow) {
    line-height: 22px !important;
  }
}

/* V6-21 Archive with a single post (t_f97d6dfe): the featured module takes the
 * only post and the grid below printed "Keine Ergebnisse gefunden" (e.g.
 * /tag/angebote). Hide that grid section when the featured section above holds
 * a post, and give the featured section the grid's 88 bottom padding instead.
 * A truly empty archive (no featured post) still shows the message. All widths. */
body.archive #page-container .et-l--body .et_pb_section_2_tb_body:has(.et_pb_post) + .et_pb_section_3_tb_body:has(.dw-archive-grid > .entry > .not-found-title) {
  display: none !important;
}
body.archive #page-container .et-l--body .et_pb_section_2_tb_body:has(.et_pb_post):has(+ .et_pb_section_3_tb_body .dw-archive-grid > .entry > .not-found-title) {
  padding-bottom: 88px !important;
}

/* V6-22 Tutorial hub details at ≥981 (t_f97d6dfe), Tutorial 1440: breadcrumb
 * "/" 10 apart at half opacity (as Blog V6-6); hero meta tracking .08em;
 * chapter count mixed case ("9 Einträge"); list chips DM Sans 700 13 with
 * .08em tracking (staging had Plex Mono 500); archive pagination "…" without
 * a circle in #9c938a (Blog 1440). */
@media (min-width: 981px) {
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_breadcrumbs--separator {
    margin: 0 10px !important;
    opacity: .5;
  }
  body.page-id-4462 #page-container .et_pb_section_0 .et_pb_text_1 p {
    letter-spacing: 1.12px !important;
  }
  body.page-id-4462 #page-container .dw-tutorial-chapter .et_pb_column:first-child > .et_pb_text:last-child p {
    text-transform: none !important;
  }
  body.page-id-4462 #page-container .dw-tutorial-list .dw-tutorial-link__chip {
    font-family: "DM Sans", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 17px !important;
    background: oklch(0.95 0.022 60);
  }
  body #page-container .dw-archive-grid .dw-numbered-pagination .page-numbers.dots {
    border-color: transparent;
    background: transparent;
    color: #9c938a !important;
  }
}

/* U4 legacy nested rows below 981 (t_971e0d9a). V6-17 fills the TB "Seite"
 * reading column only at ≥981. On phones the nested Divi 4 rows inside the
 * post content keep Divi's 80 % width, so legacy text on ueber-uns,
 * elegant-themes and divi-theme-links runs 250 wide in the 312 column that the
 * relaunch pages (impressum, adhs-apps, zukunft-wordpress) fill. Fill it;
 * columns keep stacking as before. Relaunch pages have no nested rows here. */
@media (max-width: 980px) {
  body.page #page-container .et_pb_section_1_tb_body .et_pb_post_content .et-l--post .et_pb_row {
    width: 100% !important;
    max-width: none !important;
  }
}

/* U4 legacy landing post divi-theme-news-juli-2018 (postid-4805, t_971e0d9a).
 * Same double nesting as V6-17 inside the Beitrag article column (720 at
 * 1440, 350 at 390): rows at 80 % (576 / 280) and floated 1_2 / 2_3 + empty
 * 1_3 columns → text columns 197–373 at 1440. Fill the column and lay rows out
 * as flex with the ratios kept, gap 32, empty columns dropped (≥981); below
 * 981 only the row width. Module settings (centred intro padding) untouched. */
body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
@media (min-width: 981px) {
  body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row {
    display: flex !important;
    gap: 32px;
    align-items: flex-start;
  }
  body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row.et_pb_equal_columns {
    align-items: stretch;
  }
  body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row::after {
    display: none !important;
  }
  body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column {
    flex: 1 1 0;
    width: auto !important;
    min-width: 0;
    margin-right: 0 !important;
    float: none !important;
  }
  body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column_2_3 {
    flex-grow: 2;
  }
  body.postid-4805 #page-container .et_pb_post_content .et-l--post .et_pb_row > .et_pb_column_empty {
    display: none !important;
  }
}
