/**
 * Approved staging 1512 / production 486 — one coherent visual contract.
 * Divi owns section/row/card values; these rules arrange custom-module internals.
 * Decision-ID: pereta-startseite-visual-reset-staging-20260831,
 * pereta-startseite-visual-reset-production-20260831,
 * pereta-startseite-bilder-sichtbar-20260831,
 * pereta-home-sota-divi5-20260901,
 * pereta-kontakt-reflow-sota-20260901,
 * pereta-avatar-hierarchie-praesenz-staging-20260901,
 * pereta-layout-only-sota-20260901,
 * pereta-home-design-4of10-20260902,
 * pereta-home-design-5of10-20260902
 */

body:is(.page-id-1512, .page-id-486) {
  --ap-layout-content: min(92vw, var(--gvid-apf-width-wide, 75rem));
  --ap-layout-reading: min(100%, var(--gvid-apf-width-reading, 45rem));
  --ap-layout-pad-x: var(--gvid-apf-space-m, clamp(1rem, 0.6rem + 0.8vw, 1.5rem));
  --ap-layout-pad-y: var(--gvid-apf-space-s, clamp(0.5rem, 0.3rem + 0.6vw, 1rem));
  --ap-layout-gap: var(--gvid-apf-gap-m, clamp(1rem, 0.85rem + 1vw, 1.75rem));
  --ap-layout-radius: var(--gvid-ap-v2-card-radius, clamp(1rem, 0.75rem + 0.8vw, 1.625rem));
  --ap-layout-border: color-mix(in srgb, var(--gcid-c-border, #e0e8f5) 82%, #0f1a2e 18%);
  --ap-layout-blue: var(--gcid-c-navy-100, #e0e8f5);
  --ap-layout-blue-strong: var(--gcid-c-navy-200, #c1d0eb);
  --ap-layout-paper: #fffdf8;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-avatar,
body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen,
body:is(.page-id-1512, .page-id-486) #ueber-uns,
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen {
  scroll-margin-block-start: var(--ap-header-total, 8rem);
}

/* 2 · Master Avatar ------------------------------------------------------
 * Decision-ID: pereta-home-sota-divi5-20260901,
 * pereta-avatar-emblem-kreisgeometrie-staging-20260901. Section, row and
 * columns stay native Divi Flex. Die Kreisgeometrie gehoert allein dem
 * Avatar-Modul; dieser Layout-Layer darf weder Maske noch Ring ueberschreiben. */

body:is(.page-id-1512, .page-id-486) #ap-sektion-avatar .ap-avatar-chat {
  border-color: color-mix(in srgb, var(--ap-layout-border) 78%, #8a6d28 22%);
  border-radius: calc(var(--ap-layout-radius) - 0.25rem);
  box-shadow: none;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-avatar > .et_pb_row {
  border: 1px solid color-mix(in srgb, var(--ap-layout-border) 84%, #8a6d28 16%);
  border-radius: var(--ap-layout-radius);
  box-shadow: 0 1.25rem 3.75rem -2.5rem rgb(15 26 46 / 28%);
}

/* Divi 5 emits the native 0px column padding, then its later generic Flex
 * gutter wins at equal specificity on phones. The stored Divi values remain
 * authoritative; this scoped compatibility rule restores their used value. */
body:is(.page-id-1512, .page-id-486) #ap-sektion-avatar > .et_pb_row > .et_pb_column {
  padding-inline: 0;
}

/* 3 · Ihre Fachabteilung ------------------------------------------------- */
body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen > .et_pb_row {
  width: var(--ap-layout-content);
  max-width: var(--gvid-apf-width-wide, 75rem);
  padding: var(--ap-layout-pad-y) var(--ap-layout-pad-x);
  border-radius: var(--ap-layout-radius);
  border: 1px solid color-mix(in srgb, var(--ap-layout-border) 88%, #8a6d28 12%);
  box-shadow: 0 1.25rem 3.75rem -2.5rem rgb(15 26 46 / 24%);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__lead {
  max-width: var(--ap-layout-reading);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__raster {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.875rem, 0.65rem + 0.7vw, 1.25rem);
  margin-block: clamp(1.25rem, 0.9rem + 1.4vw, 2rem) clamp(1rem, 0.7rem + 1vw, 1.5rem);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf {
  height: 100%;
  padding: clamp(0.75rem, 0.58rem + 0.55vw, 1rem);
  overflow: hidden;
  border: 1px solid var(--ap-layout-border);
  border-radius: calc(var(--ap-layout-radius) - 0.375rem);
  background: var(--ap-layout-paper);
  box-shadow: 0 0.65rem 1.75rem rgb(15 26 46 / 7%);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf picture {
  aspect-ratio: 3 / 4;
  border: 0;
  border-radius: calc(var(--ap-layout-radius) - 0.625rem);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf img {
  object-position: center 16%;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titelzeile {
  font-size: clamp(1rem, 0.93rem + 0.22vw, 1.125rem);
  line-height: 1.25;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__text {
  font-size: clamp(0.9375rem, 0.88rem + 0.18vw, 1.025rem);
  line-height: 1.45;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf:hover,
body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf:focus-visible {
  border-color: color-mix(in srgb, var(--gcid-c-gold, #8a6d28) 55%, var(--ap-layout-border));
  box-shadow: 0 0.75rem 2rem rgb(15 26 46 / 10%);
  transform: translateY(-2px);
}

/* 4 · Kontaktformular ---------------------------------------------------- */
body:is(.page-id-1512, .page-id-486) #page-container #ueber-uns.ap-ueberuns-r3 {
  grid-template-rows: auto auto minmax(0, 1fr);
  row-gap: clamp(0.5rem, 0.65svh, 0.75rem);
  /* One viewport is the visual target, not a clipping boundary. At short
   * viewports or 200% text size the native section may grow with its content. */
  height: auto !important;
  min-height: var(--ap-sektion-h, 100svh) !important;
  max-height: none !important;
  padding-block: clamp(0.5rem, 1.1svh, 0.875rem);
  overflow: visible !important;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-ueberuns-einleitung,
body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste,
body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel {
  width: var(--ap-layout-content);
  max-width: var(--gvid-apf-width-wide, 75rem);
  min-width: 0;
  margin-inline: auto;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-ueberuns-einleitung {
  display: grid;
  grid-template-columns: minmax(15rem, 0.382fr) minmax(0, 0.618fr);
  gap: clamp(1rem, 1.8vw, 2rem);
  align-items: end;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-ueberuns-einleitung > .et_pb_column {
  width: auto;
  min-width: 0;
  margin: 0;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-ueberuns-einleitung h2 {
  font-size: clamp(1.55rem, 1.05rem + 1.65vw, 2.65rem);
  line-height: 1.05;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-ueberuns-einleitungstext p {
  font-size: clamp(0.875rem, 0.82rem + 0.18vw, 1rem);
  line-height: 1.45;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste .ap-nabe {
  width: fit-content;
  max-width: 100%;
  margin: 0;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste .ap-nabe__kopf {
  display: flex;
  width: fit-content;
  max-width: 100%;
  gap: 0.375rem;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste .ap-nabe__kopf::-webkit-scrollbar {
  display: none;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste .ap-nabe__kachel {
  flex: 0 0 auto;
  min-height: 2.5rem;
  width: auto;
  padding: 0.55rem 0.75rem;
  border-radius: 999px;
  white-space: nowrap;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel {
  align-self: start;
  min-height: 0;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul {
  box-sizing: border-box;
  width: clamp(61.8%, 45rem, 100%);
  height: 100%;
  max-height: 100%;
  min-height: 0;
  margin-inline: auto;
  padding-block: clamp(0.75rem, 0.6rem + 0.55vw, 1.125rem) !important;
  padding-inline: clamp(1.25rem, 0.95rem + 1vw, 1.82rem) !important;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--ap-layout-blue-strong) 72%, #8a6d28 28%);
  border-radius: calc(var(--ap-layout-radius) - 0.25rem);
  background: var(--ap-layout-blue);
  box-shadow: 0 1.25rem 3.75rem -2.5rem rgb(15 26 46 / 30%);
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-ueberuns-gadget.ap-agenturfunnel,
body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__arbeitsblock,
body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__fragen {
  grid-template-rows: auto auto;
  align-content: start;
  min-height: 0;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__frage,
body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__frage.is-current {
  align-self: start;
  min-height: 0;
  padding: clamp(0.75rem, 0.58rem + 0.6vw, 1rem);
  border-radius: calc(var(--ap-layout-radius) - 0.5rem);
  background: #fff;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__frage legend {
  margin-bottom: clamp(0.625rem, 0.45rem + 0.55vw, 0.875rem);
  font-size: clamp(1rem, 0.92rem + 0.3vw, 1.2rem);
  line-height: 1.25;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__option {
  min-height: 3.25rem;
  padding: 0.625rem 0.75rem;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__optionen,
body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__optionen[data-ap-agenturfunnel-optionen="4"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__navigation {
  padding-top: 0;
}

body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul > .et_pb_module_inner,
body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-ueberuns-gadget.ap-agenturfunnel {
  box-sizing: border-box;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  overflow: hidden;
}

/* 5 · Leistungen --------------------------------------------------------- */
body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  gap: clamp(0.75rem, 1.2vw, 1.25rem);
  min-height: 0;
  padding: clamp(2.5rem, 5vw, 5rem) 0;
}

body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste) {
  grid-template-columns: minmax(0, 1fr) !important;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .et_pb_row {
  grid-column: 1;
  width: var(--ap-layout-content);
  max-width: 76rem;
  margin-inline: auto;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste {
  grid-row: 1;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto auto;
  width: 100%;
  gap: 0.375rem;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe > .ap-nabe__kopf {
  display: block;
  grid-column: 1 / -1;
  grid-row: 1;
  width: auto;
  margin: 0 0 0.5rem;
  font-size: clamp(1.05rem, 0.92rem + 0.5vw, 1.35rem);
  line-height: 1.3;
  text-align: center;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel {
  align-content: center;
  min-height: 2.75rem;
  width: 100%;
  padding: 0.65rem 0.75rem;
  border-radius: 0;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: auto;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(1),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(3),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(5) {
  border-radius: 0.875rem 0.875rem 0 0;
  font-weight: 700;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(2),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(4),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(6) {
  border-radius: 0 0 0.875rem 0.875rem;
  font-size: 0.8125rem;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(1),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(2) { grid-column: 1; }
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(3),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(4) { grid-column: 2; }
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(5),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(6) { grid-column: 3; }
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(1),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(3),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(5) { grid-row: 1; }
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(2),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(4),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(6) { grid-row: 2; }

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(1),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(3),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(5) { grid-row: 2; }
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(2),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(4),
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(6) { grid-row: 3; }

body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste)
  > .et_pb_row.ap-nabe-tafel {
  display: none !important;
  grid-row: 2;
  grid-column: 1;
  justify-self: center;
  width: min(92%, 60rem) !important;
  max-width: 60rem !important;
  min-height: 0;
  padding: clamp(1rem, 0.7rem + 1vw, 1.5rem);
  border: 1px solid var(--ap-layout-border);
  border-radius: var(--ap-layout-radius);
  background: var(--ap-layout-paper);
  box-shadow: 0 1rem 3rem rgb(15 26 46 / 8%);
}

@supports selector(:has(*)) {
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen:has(#ap-nabe-leistungen-sales:checked)
    > .ap-nabe-tafel--leistungen-sales,
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen:has(#ap-nabe-leistungen-sales-detail:checked)
    > .ap-nabe-tafel--leistungen-sales-detail,
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen:has(#ap-nabe-leistungen-marketing:checked)
    > .ap-nabe-tafel--leistungen-marketing,
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen:has(#ap-nabe-leistungen-marketing-detail:checked)
    > .ap-nabe-tafel--leistungen-marketing-detail,
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen:has(#ap-nabe-leistungen-digitalisierung:checked)
    > .ap-nabe-tafel--leistungen-digitalisierung,
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen:has(#ap-nabe-leistungen-digitalisierung-detail:checked)
    > .ap-nabe-tafel--leistungen-digitalisierung-detail {
    display: block !important;
    visibility: visible;
  }
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-tafel > .et_pb_column {
  min-height: 0;
  align-content: start;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .et_pb_row:not(.ap-nabe-tafel):not(.ap-nabe-leiste) {
  grid-row: 3;
  margin-top: 0;
}

/* 5 · Leistungen — native stage rail ------------------------------------
 * Decision-ID: pereta-layout-only-sota-20260901. The Nabe is a custom
 * module, so this remains inside its existing, page-scoped layout layer. */
body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne {
  gap: var(--ap-layout-gap);
  padding-block: var(--ap-layout-pad-y);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .et_pb_row {
  max-width: var(--ap-layout-content);
  min-width: 0;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe {
  grid-template-rows: repeat(2, auto);
  min-width: 0;
  gap: var(--gvid-apf-gap-xs, clamp(0.5rem, 0.4rem + 0.5vw, 0.75rem));
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe > .ap-nabe__kopf {
  min-width: 0;
  margin: 0;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel {
  min-width: 0;
  padding: var(--ap-layout-pad-y) var(--ap-layout-pad-x);
  border-radius: var(--ap-layout-radius);
  overflow-wrap: anywhere;
}

body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste)
  > .et_pb_row.ap-nabe-tafel {
  width: var(--ap-layout-content) !important;
  max-width: var(--ap-layout-content) !important;
  min-width: 0;
  padding: var(--ap-layout-pad-y) var(--ap-layout-pad-x);
  border: var(--gvid-apf-border-default) solid var(--ap-layout-border);
  box-shadow: none;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-tafel > .et_pb_column {
  min-width: 0;
}

@media (min-width: 64rem) {
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste) {
    box-sizing: border-box;
    grid-template-columns: clamp(14rem, 18vw, 17rem) minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr);
    align-items: center;
    padding-inline: max(
      var(--ap-layout-pad-x),
      calc((100vw - var(--gvid-apf-width-wide, 75rem)) / 2)
    );
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .et_pb_row {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste {
    grid-column: 1;
    grid-row: 1 / -1;
    width: 100% !important;
    max-width: none !important;
    padding-inline: 0 !important;
    align-self: center;
    justify-self: start;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste > .et_pb_column {
    grid-column: 1;
    grid-row: 1 / -1;
    width: 100%;
    max-width: 100%;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe > .ap-nabe__kopf {
    align-self: flex-start;
    width: max-content;
    max-width: 16rem;
    white-space: normal;
    text-align: left;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel {
    display: inline-flex;
    flex: 0 0 auto;
    align-self: flex-start;
    width: fit-content;
    max-width: 100%;
    padding: var(--s-xs, 0.618rem) var(--s-sm, 1rem);
    white-space: nowrap;
    text-align: left;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste)
    > .et_pb_row.ap-nabe-tafel {
    grid-column: 2;
    grid-row: 1 / -1;
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .et_pb_row:not(.ap-nabe-tafel):not(.ap-nabe-leiste) {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

/* 5 · Leistungen Ende ---------------------------------------------------- */

@media (max-width: 73.6875rem) {
  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__raster {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf {
    display: grid;
    grid-template-columns: clamp(7rem, 13vw, 9rem) minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: clamp(0.875rem, 0.7rem + 0.55vw, 1.25rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf picture {
    grid-row: 1 / span 2;
    aspect-ratio: 3 / 4;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titelzeile,
  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__text {
    grid-column: 2;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titelzeile {
    font-size: clamp(0.9375rem, 0.85rem + 0.28vw, 1.0625rem);
  }
}

@media (max-width: 47.9375rem) {
  body:is(.page-id-1512, .page-id-486) {
    --ap-layout-content: min(92vw, 42rem);
    --ap-layout-pad-x: clamp(0.75rem, 2.5vw, 1rem);
    --ap-layout-pad-y: clamp(0.75rem, 2.5vw, 1rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-avatar .ap-avatar-buehne {
    align-self: start;
    width: clamp(7rem, 30vw, 8rem);
    height: clamp(7rem, 30vw, 8rem);
    min-height: 0;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen {
    padding-block: clamp(0.75rem, 3vw, 1rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen > .et_pb_row {
    padding-block: clamp(0.375rem, 1.8vw, 0.75rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titel {
    margin-bottom: 0.375rem;
    font-size: clamp(1.7rem, 7.8vw, 2.25rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__lead {
    font-size: clamp(0.9375rem, 4vw, 1.05rem);
    line-height: 1.38;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__raster {
    gap: 0.375rem;
    margin-block: 0.5rem 0.25rem;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf {
    display: grid;
    grid-template-columns: clamp(5.75rem, 24vw, 6rem) minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    column-gap: clamp(0.5rem, 2vw, 0.75rem);
    align-items: start;
    min-height: 0;
    padding: clamp(0.375rem, 1.7vw, 0.5rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf picture {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 100%;
    aspect-ratio: 3 / 4;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titelzeile,
  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__text {
    grid-column: 2;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titelzeile {
    margin-top: 0.125rem;
    font-size: clamp(0.8125rem, 3.3vw, 0.9375rem);
    line-height: 1.2;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__text {
    margin-top: 0.1875rem;
    font-size: clamp(0.75rem, 3.2vw, 0.875rem);
    line-height: 1.32;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-ueberuns-einleitung {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.25rem;
    align-items: start;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ueber-uns.ap-ueberuns-r3 {
    --ap-formular-h: clamp(21rem, 45svh, 23rem);

    grid-template-rows: auto auto auto;
    align-content: center;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-ueberuns-einleitung h2 {
    font-size: clamp(1.35rem, 5.8vw, 1.75rem);
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-ueberuns-einleitungstext p {
    font-size: 0.875rem;
    line-height: 1.35;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste .ap-nabe__kachel {
    min-height: 2.25rem;
    padding: 0.45rem 0.625rem;
    font-size: 0.75rem;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul {
    padding-block: 0.625rem !important;
    padding-inline: 0.875rem !important;
  }

  /* Keep the outer Divi module stable. Its inner wrapper and funnel retain
   * height:100%, so the card padding remains inside this fixed border box.
   * Questions never scroll; only review and contact own a scrollport. */
  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul:has(
    .ap-agenturfunnel__fragen:not([hidden]),
    .ap-agenturfunnel[data-ap-agenturfunnel-pruefung-offen="1"],
    .ap-agenturfunnel[data-ap-agenturfunnel-kontakt-offen="1"]
  ) {
    height: var(--ap-formular-h);
    min-height: var(--ap-formular-h);
    max-height: var(--ap-formular-h);
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__status {
    padding-block: 0.35rem;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__optionen,
  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__optionen[data-ap-agenturfunnel-optionen="4"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.375rem;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__option {
    min-height: 3.25rem;
    padding: 0.5rem 0.625rem;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne {
    min-height: 0;
    padding-block: clamp(2.5rem, 10vw, 4rem);
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel {
    min-height: 2.5rem;
    padding-inline: 0.4rem;
    font-size: 0.75rem;
    line-height: 1.2;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__label {
    min-width: 0;
    width: 100%;
    font-size: clamp(0.6875rem, 2.8vw, 0.8125rem);
    line-height: 1.15;
    overflow-wrap: anywhere;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(even) {
    font-size: 0.6875rem;
  }
}

@media (max-width: 40rem) {
  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__raster {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 30rem) {
  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__raster {
    grid-template-columns: minmax(0, 1fr);
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__option > span {
    min-width: 0;
    overflow-wrap: anywhere;
    hyphens: auto;
  }
}

@media (max-width: 22.5rem) {
  body:is(.page-id-1512, .page-id-486) #page-container #ueber-uns.ap-ueberuns-r3 {
    --ap-formular-h: 21rem;
  }

  /* Question 20 is the tallest real 320px combination. Preserve the outer
   * card height and recover its missing 12px from decorative vertical inset. */
  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul {
    padding-block: 0.25rem !important;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__titelzeile {
    font-size: 0.8125rem;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__text {
    font-size: 0.75rem;
    line-height: 1.3;
  }

  body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel {
    padding-inline: 0.25rem;
    font-size: 0.6875rem;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__option {
    min-height: 2.75rem;
    padding-inline: 0.375rem;
  }

  /* The selected border and surface already communicate state. On 320px the
   * extra radio ornament only forces valid German answer words to fragment. */
  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap-agenturfunnel__option::before {
    display: none;
  }
}

@media (min-width: 48rem) {
  body:is(.page-id-1512, .page-id-486) #page-container #ueber-uns.ap-ueberuns-r3 {
    grid-template-rows: auto clamp(26rem, 48svh, 27.5rem);
    align-content: center;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel,
  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel > .et_pb_column,
  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul {
    box-sizing: border-box;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel,
  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel > .et_pb_column {
    overflow: hidden;
  }
}

/* 4 · Kontaktformular — one centred Phi stage ---------------------------
 * Decision-ID: pereta-home-design-4of10-20260902. Divi still owns every
 * row and its 75rem width role. This page-scoped layer only places the
 * custom tab rail and the active custom-module panel in one 38.2/61.8 stage. */
@media (min-width: 64rem) {
  body:is(.page-id-1512, .page-id-486) #page-container #ueber-uns.ap-ueberuns-r3 {
    box-sizing: border-box;
    grid-template-columns:
      var(--ap-ueberuns-tab-rail, clamp(9.5rem, 8.75rem + 1vw, 10.75rem))
      minmax(0, 1fr);
    grid-template-rows: auto clamp(26rem, 48svh, 27.5rem);
    column-gap: var(--ap-layout-gap);
    padding-inline: var(--ap-ueberuns-randabstand, clamp(0.25rem, 0.15rem + 0.25vw, 0.5rem));
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-ueberuns-einleitung {
    grid-column: 1 / -1;
    grid-row: 1;
    width: min(92%, var(--gvid-apf-width-wide, 75rem));
    max-width: var(--gvid-apf-width-wide, 75rem);
    margin-inline: auto;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-leiste {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    justify-self: start;
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns > .ap-nabe-tafel {
    grid-column: 2;
    grid-row: 2;
    align-self: stretch;
    justify-self: stretch;
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
  }

  body:is(.page-id-1512, .page-id-486) #ueber-uns .ap_ueberuns_gadget_modul {
    width: clamp(61.8%, 45rem, 100%) !important;
    min-width: 0 !important;
    max-width: 100% !important;
    inline-size: clamp(61.8%, 45rem, 100%) !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    margin-inline: auto !important;
  }
}

/* 5 · Leistungen — finaler 5/10-Gegencheck -------------------------------
 * Decision-ID: pereta-home-design-5of10-20260902. Die Divi-Sektion bleibt
 * das Raster und die Nabe bleibt die Navigation. Diese Schicht ordnet nur
 * deren bereits vorhandene Innenbauteile: lesbare 44-px-Schalter, eine ruhige
 * linke Schiene und genau eine klar gefasste Antworttafel. */
body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne {
  gap: clamp(1rem, 0.8rem + 1vw, 1.75rem);
  align-items: start;
  padding-block: clamp(2.5rem, 3vw + 1.25rem, 4.5rem);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
  gap: clamp(0.5rem, 0.4rem + 0.4vw, 0.75rem);
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe > .ap-nabe__kopf {
  grid-column: 1 / -1;
  grid-row: auto;
  max-width: 32rem;
  margin-bottom: 0.375rem;
  font-size: clamp(1rem, 0.92rem + 0.35vw, 1.25rem);
  line-height: 1.3;
  text-align: left;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel,
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(n) {
  display: inline-flex;
  grid-column: auto;
  grid-row: auto;
  align-items: center;
  justify-content: flex-start;
  min-height: 2.75rem;
  width: 100%;
  padding: clamp(0.625rem, 0.55rem + 0.25vw, 0.75rem)
    clamp(0.75rem, 0.65rem + 0.5vw, 1rem);
  border-radius: clamp(0.625rem, 0.55rem + 0.3vw, 0.875rem);
  font-size: clamp(0.8125rem, 0.78rem + 0.15vw, 0.9375rem);
  line-height: 1.2;
  text-align: left;
}

body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__label,
body:is(.page-id-1512, .page-id-486) #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(even) {
  min-width: 0;
  font-size: inherit;
  line-height: inherit;
  overflow-wrap: normal;
}

body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste)
  > .et_pb_row.ap-nabe-tafel {
  align-self: start;
  padding: clamp(1.25rem, 0.9rem + 1.2vw, 2rem);
  border: 1px solid color-mix(in srgb, var(--ap-layout-border) 86%, #8a6d28 14%);
  border-radius: var(--ap-layout-radius);
  background: var(--ap-layout-paper);
  box-shadow: 0 1.25rem 3.75rem -2.5rem rgb(15 26 46 / 28%);
}

@media (min-width: 64rem) {
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste) {
    grid-template-columns: clamp(12.5rem, 16vw, 15rem) minmax(0, 1fr) !important;
    grid-template-rows: auto;
    align-content: start;
    align-items: start;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste {
    align-self: start;
    padding-top: clamp(0.25rem, 0.15rem + 0.35vw, 0.5rem) !important;
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe {
    display: flex;
    gap: clamp(0.375rem, 0.3rem + 0.3vw, 0.625rem);
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel,
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen > .ap-nabe-leiste .ap-nabe__kachel:nth-of-type(n) {
    min-width: 4.5rem;
    width: fit-content;
    max-width: 100%;
    white-space: normal;
  }
}

@media (max-width: 47.9375rem) {
  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne {
    padding-block: clamp(2rem, 8vw, 3rem);
  }

  body:is(.page-id-1512, .page-id-486) #page-container #ap-sektion-leistungen.ap-nabe-buehne:has(> .ap-nabe-leiste)
    > .et_pb_row.ap-nabe-tafel {
    padding: clamp(1rem, 3.5vw, 1.25rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:is(.page-id-1512, .page-id-486) #ap-sektion-rollen .ap-avatar-rollen__knopf {
    transition: none;
  }
}