/* Compact German product pages rendered by Divi's default page template. */
html[lang="de-DE"] body.page-template-default .entry-content main.mdlp.product-landing[aria-labelledby="ml-title"]:has(> .ml-hero > .ml-wrap > .ml-intro) {
  --mdlp-text: #b8c3d1;
  --mdlp-heading: #f0f6fc;
  --mdlp-border: #2a3441;
  --mdlp-accent: #e6c894;
  background: #0d1117;
  color: var(--mdlp-text);
  font: 400 1rem/1.65 Manrope, Inter, Arial, sans-serif;
  overflow-wrap: anywhere;
}

html[lang="de-DE"] body.page-template-default .entry-content main.mdlp.product-landing[aria-labelledby="ml-title"]:has(> .ml-hero > .ml-wrap > .ml-intro) {
  & > :is(.ml-hero, .ml-section) {
    padding-block: clamp(1.75rem, 4.25vw, 3.75rem);
  }

  & > .ml-section {
    border-top: 1px solid var(--mdlp-border);
  }

  & > :is(.ml-hero, .ml-section) > .ml-wrap {
    box-sizing: border-box;
    width: min(100% - clamp(2.5rem, 11vw, 9rem), 71rem);
    margin-inline: auto;
  }

  & :is(h1, h2) {
    color: var(--mdlp-heading);
    font-family: Manrope, Inter, Arial, sans-serif;
    font-weight: 500;
    letter-spacing: -.035em;
    line-height: 1.15;
    padding: 0;
  }

  & h1 {
    max-width: 21ch;
    margin: 0 0 1rem;
    font-size: clamp(2rem, 4.35vw, 3.5rem);
  }

  & h2 {
    margin: 0 0 .85rem;
    font-size: clamp(1.35rem, 2.7vw, 2.125rem);
  }

  & :is(p, ul, ol) {
    max-width: 76ch;
    margin: 0 0 .8rem;
    padding-bottom: 0;
  }

  & :is(ul, ol) {
    padding-inline-start: 1.35rem;
    list-style-position: outside;
  }

  & ul { list-style-type: disc; }
  & ol { list-style-type: decimal; }
  & li + li { margin-top: .3rem; }

  & .ml-label {
    color: var(--mdlp-accent);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .075em;
  }

  & .ml-intro {
    max-width: 63ch;
    font-size: clamp(1rem, 1.6vw, 1.2rem);
  }

  & a {
    color: var(--mdlp-accent);
    text-underline-offset: .18em;
  }

  & .ml-section a {
    text-decoration: underline;
  }

  & .ml-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin-top: 1.4rem;
  }

  & a.ml-btn {
    box-sizing: border-box;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45em;
    min-height: 44px;
    max-width: 100%;
    padding: .55rem .95rem;
    border: 1px solid var(--mdlp-border);
    border-radius: .45rem;
    color: var(--mdlp-heading) !important;
    font-size: .95rem;
    line-height: 1.4;
    text-decoration: none;
  }

  & a.ml-btn.ml-btn-primary {
    border-color: var(--mdlp-accent);
    background: var(--mdlp-accent);
    color: #17120d !important;
  }

  & .ml-btn:hover { text-decoration: underline; }
  & a:focus-visible { outline: 2px solid var(--mdlp-accent); outline-offset: 3px; }

  & table {
    width: min(100%, 57rem);
    border-collapse: collapse;
    border: 1px solid var(--mdlp-border);
    font-size: .9rem;
  }

  & caption {
    padding-block: 0 .5rem;
    text-align: start;
  }

  & :is(th, td) {
    border: 1px solid var(--mdlp-border);
    padding: .5rem;
    color: var(--mdlp-text);
    text-align: start;
    vertical-align: top;
  }

  & th {
    color: var(--mdlp-heading);
    background: #161c24;
    font-weight: 600;
  }
}

/* The older solutions overview uses the editorial markup in the default Divi shell. */
html[lang="de-DE"] body.page-id-1002464 .entry-content .editorial-main {
  width: min(89%, 1140px);
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 5rem) 0;
}
html[lang="de-DE"] body.page-id-1002464 .entry-content .editorial-main > :is(section, header) {
  margin-block-end: clamp(2rem, 5vw, 4rem);
}
html[lang="de-DE"] body.page-id-1002464 .entry-content .editorial-main :is(h1,h2,h3) {
  overflow-wrap: anywhere;
}
html[lang="de-DE"] body.page-id-1002464 .entry-content .editorial-main a:focus-visible {
  outline: 2px solid #1b6756;
  outline-offset: 4px;
}
