@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/assets/fonts/manrope.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --ivory: #f6f4ef;
  --plum: #25202b;
  --aubergine: #493351;
  --aubergine-hover: #3b2942;
  --sage: #d9e7ac;
  --sage-soft: #e7f0c8;
  --muted: #59535e;
  --line: #d8d2da;
  --card: #fffcf8;
  --focus: #493351;
  --header: 96px;
  --wrap: 1248px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--ivory);
  color: var(--plum);
  font-family: Manrope, "Segoe UI", sans-serif;
  font-size: 18px;
  line-height: 1.55;
  font-weight: 450;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

h1,
h2,
h3,
p {
  margin: 0;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  color: inherit;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
}

:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}

.skip {
  position: absolute;
  left: 16px;
  top: -48px;
  z-index: 50;
  background: var(--aubergine);
  color: var(--ivory);
  padding: 10px 14px;
  border-radius: 10px;
}

.skip:focus {
  top: 12px;
}

.wrap {
  width: min(var(--wrap), calc(100% - 48px));
  margin-inline: auto;
}

@media (min-width: 1280px) {
  .wrap {
    width: min(var(--wrap), calc(100% - 128px));
  }
}

@media (min-width: 1440px) {
  .wrap {
    width: min(var(--wrap), calc(100% - 192px));
  }
}

.eyebrow {
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.lede {
  max-width: 62ch;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.55;
}

h1,
.h1 {
  font-size: clamp(2.45rem, 4.15vw, 4.25rem);
  font-weight: 750;
  letter-spacing: -0.035em;
  line-height: 1.06;
}

h2,
.h2 {
  font-size: clamp(1.85rem, 2.6vw, 2.75rem);
  font-weight: 720;
  letter-spacing: -0.03em;
  line-height: 1.14;
  max-width: 18ch;
}

h2.wide,
.h2.wide {
  max-width: 22ch;
}

h3 {
  font-size: 1.35rem;
  font-weight: 720;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.section {
  padding: 72px 0 80px;
}

@media (min-width: 1024px) {
  .section {
    padding: 104px 0 112px;
  }
}

.section-head {
  margin-bottom: 40px;
}

.section-head .lede {
  margin-top: 20px;
}

#leistungen,
#care-growth {
  scroll-margin-top: calc(var(--header) + 12px);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 22px;
  border-radius: 999px;
  background: var(--aubergine);
  color: var(--ivory);
  font-size: 15.5px;
  font-weight: 650;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.btn:hover {
  background: var(--aubergine-hover);
}

.btn svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--plum);
  font-size: 16px;
  font-weight: 680;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: #b9b2bc;
  text-underline-offset: 5px;
}

.link-arrow svg {
  width: 16px;
  height: 16px;
  flex: none;
  transition: transform 160ms ease;
}

@media (prefers-reduced-motion: reduce) {
  .link-arrow svg {
    transition: none;
  }
}

.icon-bubble {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--sage-soft);
  color: var(--plum);
}

.icon-bubble svg {
  width: 30px;
  height: 30px;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(246, 244, 239, 0.92);
  border-bottom: 1px solid rgba(216, 210, 218, 0.9);
  backdrop-filter: blur(14px);
}

.header-bar {
  position: relative;
  display: flex;
  align-items: center;
  min-height: var(--header);
  gap: 24px;
}

.brand {
  display: inline-flex;
  align-items: center;
  flex: 1;
  width: fit-content;
  text-decoration: none;
}

.brand-logo {
  display: block;
  height: 52px;
  width: auto;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 28px;
}

.nav-links a:not(.btn) {
  color: var(--plum);
  font-size: 15.5px;
  font-weight: 580;
  text-decoration: none;
}

.nav-links a:not(.btn):hover {
  color: var(--aubergine);
}

.header-cta {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

.nav-cta-mobile {
  display: none;
}

.nav-toggle {
  display: none;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  min-width: 44px;
  padding: 8px 12px;
  border-radius: 12px;
  font-weight: 680;
}

.nav-toggle-icon {
  width: 18px;
  height: 12px;
  position: relative;
}

.nav-toggle-icon span,
.nav-toggle-icon::before,
.nav-toggle-icon::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1.5px;
  background: currentColor;
  border-radius: 1px;
}

.nav-toggle-icon span {
  top: 5px;
}

.nav-toggle-icon::before {
  top: 0;
}

.nav-toggle-icon::after {
  bottom: 0;
}

.site-header.is-open .nav-toggle-icon span {
  opacity: 0;
}

.site-header.is-open .nav-toggle-icon::before {
  top: 5px;
  transform: rotate(40deg);
}

.site-header.is-open .nav-toggle-icon::after {
  bottom: 5px;
  transform: rotate(-40deg);
}

.hero {
  position: relative;
  width: 100%;
  padding: 0;
  background: #ebe9e4;
  overflow: clip;
}

.hero-slider {
  position: relative;
  isolation: isolate;
}

.hero-slide {
  display: none;
  padding: 56px 0 36px;
}

.hero-slide.is-active {
  display: block;
}

.hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(260px, 0.88fr);
  gap: 28px;
  align-items: start;
  z-index: 1;
}

.hero-copy {
  position: relative;
  z-index: 2;
}

.hero-copy h1 span {
  display: block;
  white-space: nowrap;
}

.hero-copy .lede {
  margin-top: 28px;
  max-width: 38rem;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 22px 28px;
  margin-top: 32px;
}

.hero-note {
  margin-top: 22px;
  color: var(--muted);
  font-size: 15.5px;
}

.hero-visual {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 0;
}

.hero-visual img {
  width: min(100%, 540px);
  height: auto;
  max-height: min(100%, 520px);
  margin-inline: auto;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

.choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.choice {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  min-height: 100%;
  padding: 28px 26px 24px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
  text-decoration: none;
  transition: border-color 160ms ease;
}

.choice:hover,
.choice:focus-visible {
  border-color: #b7adba;
}

.choice:hover .link-arrow svg,
.choice:focus-visible .link-arrow svg {
  transform: translateX(4px);
}

.choice h3 {
  font-size: 1.45rem;
  max-width: 16ch;
}

.choice p {
  color: var(--muted);
  font-size: 16.5px;
  line-height: 1.55;
}

.choice .link-arrow {
  margin-top: auto;
  padding-top: 8px;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.service {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  padding: 8px 36px 8px 0;
}

.service + .service {
  padding-left: 36px;
  border-left: 1px solid var(--line);
}

.service h3 {
  font-size: 1.55rem;
}

.service .lede {
  font-size: 16.5px;
}

.feature-list {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 16.5px;
}

.service .link-arrow {
  margin-top: auto;
  padding-top: 12px;
}

.services-more {
  margin-top: 40px;
}

.think-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: 48px;
  align-items: center;
}

.think-copy .lede {
  margin-top: 20px;
}

.think-copy .btn {
  margin-top: 32px;
}

.flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 80px minmax(0, 1fr);
  grid-template-areas:
    "a right b"
    "up . down"
    "d left c";
  align-items: start;
  justify-items: center;
  row-gap: 16px;
}

.flow-a { grid-area: a; }
.flow-b { grid-area: b; }
.flow-c { grid-area: c; }
.flow-d { grid-area: d; }
.flow-right { grid-area: right; }
.flow-down { grid-area: down; }
.flow-left { grid-area: left; }
.flow-up { grid-area: up; }

.flow-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  max-width: 180px;
}

.flow-bubble {
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: var(--sage);
  color: var(--plum);
}

.flow-bubble svg {
  width: 30px;
  height: 30px;
}

.flow-node h3 {
  font-size: 1.05rem;
}

.flow-node p {
  color: var(--muted);
  font-size: 15px;
}

.flow-arrow {
  width: 72px;
  height: 1.5px;
  margin-top: 41px;
  background: var(--aubergine);
  position: relative;
}

.flow-arrow::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-top: 1.5px solid var(--aubergine);
  border-right: 1.5px solid var(--aubergine);
  transform: translateY(-50%) rotate(45deg);
}

.flow-left {
  transform: scaleX(-1);
}

.flow-down,
.flow-up {
  width: 1.5px;
  height: 36px;
  margin-top: 0;
  align-self: center;
}

.flow-down::after,
.flow-up::after {
  right: auto;
  left: 50%;
}

.flow-down::after {
  top: auto;
  bottom: -1px;
  transform: translateX(-50%) rotate(135deg);
}

.flow-up::after {
  top: -1px;
  transform: translateX(-50%) rotate(-45deg);
}

.flow-caption {
  margin-top: 28px;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

.care-panel {
  background: var(--aubergine);
  color: var(--ivory);
  border-radius: 24px;
  padding: 56px 56px 48px;
}

.care-panel .eyebrow {
  color: rgba(246, 244, 239, 0.72);
}

.care-panel h2 {
  max-width: 16ch;
}

.care-panel .lede {
  margin-top: 20px;
  max-width: 46ch;
  color: rgba(246, 244, 239, 0.88);
}

.care-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 48px;
}

.care-col {
  padding-right: 40px;
}

.care-col + .care-col {
  padding-right: 0;
  padding-left: 40px;
  border-left: 1px solid rgba(246, 244, 239, 0.18);
}

.care-col h3 {
  margin-top: 18px;
  font-size: 2.4rem;
  letter-spacing: -0.03em;
}

.care-sub {
  margin-top: 8px;
  font-size: 1.25rem;
  font-weight: 680;
  letter-spacing: -0.02em;
}

.care-col .body {
  margin-top: 14px;
  max-width: 38ch;
  color: rgba(246, 244, 239, 0.9);
  font-size: 16.5px;
}

.check-list {
  display: grid;
  gap: 10px;
  margin-top: 20px;
}

.check-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16.5px;
}

.check-list svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--sage);
}

.care-note {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(246, 244, 239, 0.2);
  max-width: 42ch;
  color: rgba(246, 244, 239, 0.82);
  font-size: 15px;
  line-height: 1.5;
}

.care-col .link-arrow {
  margin-top: 22px;
  color: var(--ivory);
  text-decoration-color: rgba(246, 244, 239, 0.45);
}

.steps {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: 8px;
}

@media (min-width: 800px) {
  .steps::before {
    content: "";
    position: absolute;
    top: 23px;
    left: 8%;
    right: 8%;
    height: 1px;
    background: var(--line);
  }
}

.step-index {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 18px;
  border-radius: 50%;
  background: var(--sage);
  color: var(--plum);
  font-size: 14px;
  font-weight: 750;
}

.steps h3 {
  font-size: 1.2rem;
  max-width: 18ch;
}

.steps p {
  margin-top: 10px;
  max-width: 34ch;
  color: var(--muted);
  font-size: 16.5px;
}

.steps-note {
  margin-top: 36px;
  max-width: 78ch;
  color: var(--muted);
  font-size: 16.5px;
}

.steps-more {
  display: inline-flex;
  margin-top: 18px;
}

.faq-list {
  border-top: 1px solid var(--line);
}

.faq-item {
  border-bottom: 1px solid var(--line);
}

.faq-item button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  min-height: 76px;
  padding: 18px 0;
  text-align: left;
  cursor: pointer;
  font-size: 1.2rem;
  font-weight: 720;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.faq-symbol {
  position: relative;
  width: 22px;
  height: 22px;
  flex: none;
}

.faq-symbol::before,
.faq-symbol::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: currentColor;
  border-radius: 1px;
  transform: translate(-50%, -50%);
}

.faq-symbol::before {
  width: 14px;
  height: 1.5px;
}

.faq-symbol::after {
  width: 1.5px;
  height: 14px;
}

.faq-item.is-open .faq-symbol::after {
  display: none;
}

.faq-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 180ms ease;
}

.faq-item.is-open .faq-panel {
  grid-template-rows: 1fr;
}

.faq-panel-inner {
  overflow: hidden;
}

.faq-panel p {
  max-width: 78ch;
  padding-bottom: 22px;
  color: var(--muted);
  font-size: 17px;
}

.faq-more {
  display: inline-flex;
  margin-top: 28px;
}

.cta-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px 48px;
  padding: 48px;
  border-radius: 20px;
  background: var(--sage);
}

.cta-banner .eyebrow {
  color: #4d5640;
}

.cta-banner h2 {
  max-width: 16ch;
}

.cta-banner .lede {
  margin-top: 16px;
  color: var(--plum);
}

.cta-note {
  margin-top: 18px;
  color: #3f4634;
  font-size: 15.5px;
}

.site-footer {
  margin-top: 28px;
  border-top: 1px solid var(--line);
  padding: 48px 0 28px;
}

.footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) auto auto;
  gap: 48px 64px;
  align-items: start;
}

.footer-brand .brand {
  flex: none;
  margin-bottom: 16px;
}

.footer-brand p {
  max-width: 32ch;
  color: var(--muted);
  font-size: 16px;
}

.footer-label {
  margin-bottom: 14px;
  font-size: 15px;
  font-weight: 720;
  letter-spacing: 0;
}

.footer-col a {
  display: block;
  padding: 5px 0;
  color: var(--muted);
  font-size: 15.5px;
  text-decoration: none;
}

.footer-col a:hover {
  color: var(--plum);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.footer-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 40px;
  color: #8a8490;
  font-size: 14px;
}

.footer-legal a {
  color: inherit;
  text-decoration: none;
}

.footer-legal a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-missing {
  padding: 64px 0 88px;
}

.nf-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(200px, 0.9fr);
  gap: 32px 48px;
  align-items: center;
}

.page-missing h1 {
  max-width: 11em;
  font-size: clamp(2.375rem, 4.2vw, 4rem);
}

.page-missing .lede {
  max-width: 640px;
  margin-top: 20px;
  font-size: 20px;
  line-height: 1.55;
}

.page-missing .btn {
  min-height: 48px;
  margin-top: 28px;
}

.nf-map svg {
  display: block;
  width: min(100%, 320px);
  height: auto;
  margin-left: auto;
}

.page-missing h2 {
  max-width: none;
  margin: 76px 0 0;
  font-size: clamp(2.125rem, 2.5vw, 2.375rem);
}

.next-ways {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 32px;
  margin-top: 22px;
}

.next-ways a {
  display: block;
  min-height: 44px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  text-decoration: none;
}

.next-ways h3 {
  margin: 0;
  max-width: 16em;
  font-size: 1.4375rem;
  font-weight: 720;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: #b9b2bc;
  text-underline-offset: 4px;
}

.next-ways p {
  margin-top: 10px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.55;
}

.missing-note {
  margin-top: 48px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
  max-width: 68ch;
  color: var(--plum);
  font-size: 18px;
  line-height: 1.6;
}

.missing-note a {
  color: var(--aubergine);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 980px) {
  .nf-hero {
    grid-template-columns: 1fr;
  }

  .nf-map {
    display: none;
  }
}

@media (max-width: 640px) {
  .page-missing {
    padding-top: 40px;
  }

  .page-missing .lede,
  .next-ways p,
  .missing-note {
    font-size: 17px;
  }

  .page-missing h2 {
    margin-top: 56px;
  }
}

@media (max-width: 1040px) {
  :root {
    --header: 72px;
  }

  .nav-toggle {
    display: inline-flex;
  }

  .header-cta {
    display: none;
  }

  .nav-links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 8px 24px 20px;
    background: rgba(246, 244, 239, 0.98);
    border-bottom: 1px solid var(--line);
  }

  .site-header.is-open .nav-links {
    display: flex;
  }

  .nav-links a:not(.btn) {
    display: flex;
    align-items: center;
    min-height: 44px;
    font-size: 17px;
  }

  .site-header.is-open .nav-cta-mobile {
    display: inline-flex;
    margin-top: 10px;
  }
}

@media (max-width: 980px) {
  .hero-slide {
    padding: 40px 0 48px;
  }

  .hero-grid {
    display: block;
    /* Höhe nur durch Textinhalt – Visual ist absolut und streckt nicht */
  }

  .think-grid,
  .choices,
  .services-grid,
  .care-grid,
  .steps,
  .next-ways,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  /* Cluster hinter dem Text; absolute, damit es die Höhe nicht mitbestimmt */
  .hero-visual {
    position: absolute;
    inset: 0;
    z-index: 0;
    order: unset;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 0 2% 0;
    overflow: hidden;
    pointer-events: none;
  }

  .hero-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
      90deg,
      #ebe9e4 0%,
      rgba(235, 233, 228, 0.88) 38%,
      rgba(235, 233, 228, 0.35) 62%,
      rgba(235, 233, 228, 0) 100%
    );
    pointer-events: none;
  }

  .hero-visual img {
    position: relative;
    z-index: 0;
    width: min(72%, 380px);
    height: auto;
    max-height: 100%;
    margin: 0;
    object-fit: contain;
    object-position: right bottom;
    opacity: 0.5;
    filter: saturate(0.95);
  }

  .hero-copy {
    max-width: 36rem;
  }

  .service,
  .service + .service {
    padding: 28px 0;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .services-grid .service:first-child {
    border-top: 0;
    padding-top: 0;
  }

  .care-panel {
    padding: 32px 24px 28px;
  }

  .care-col,
  .care-col + .care-col {
    padding: 28px 0 8px;
    border-left: 0;
  }

  .care-col + .care-col {
    border-top: 1px solid rgba(246, 244, 239, 0.18);
  }

  .flow {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }

  .flow-node {
    flex-direction: row;
    align-items: center;
    text-align: left;
    max-width: none;
    gap: 16px;
    padding: 14px 0;
  }

  .flow-bubble {
    width: 64px;
    height: 64px;
    flex: none;
  }

  .flow-arrow {
    display: none;
  }

  .flow-node:not(:last-of-type) {
    border-bottom: 1px solid var(--line);
  }

  .flow-caption {
    text-align: left;
  }

  .cta-banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 32px 24px;
  }

  .footer-grid {
    gap: 32px;
  }
}

@media (max-width: 900px) {
  .hero-copy h1 span {
    white-space: normal;
  }
}

@media (max-width: 640px) {
  .wrap {
    width: min(var(--wrap), calc(100% - 48px));
  }

  body {
    font-size: 17px;
  }

  h1,
  .h1 {
    font-size: clamp(2rem, 10vw, 2.5rem);
  }

  h2,
  .h2 {
    font-size: clamp(1.7rem, 8vw, 1.95rem);
    max-width: none;
  }

  .hero-copy h1 span {
    white-space: normal;
  }

  .section {
    padding: 56px 0 64px;
  }

  .choice h3 {
    font-size: 1.3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq-panel,
  .link-arrow svg,
  .choice {
    transition: none;
  }
}
.nav-links a.is-active {
  color: var(--plum);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
}

.crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 28px;
  color: var(--muted);
  font-size: 14px;
}

.crumb a {
  color: var(--muted);
  text-decoration: none;
}

.crumb a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.svc-hero {
  padding: 28px 0 12px;
}

.svc-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(180px, 0.45fr);
  gap: 32px;
  align-items: center;
}

.svc-hero h1 {
  font-size: clamp(2.15rem, 3.4vw, 3.75rem);
  max-width: none;
}

.svc-hero h1 span {
  display: block;
}

.svc-hero .lede {
  margin-top: 22px;
  max-width: 46rem;
}

.svc-hero-btn {
  margin-top: 28px;
}

.svc-motif {
  position: relative;
  height: 220px;
  justify-self: end;
  width: min(100%, 220px);
}

.motif-dot {
  position: absolute;
  display: block;
  border-radius: 50%;
  box-shadow: 0 18px 30px rgba(37, 32, 43, 0.08);
}

.motif-a {
  width: 92px;
  height: 92px;
  background: #d7e4b4;
  top: 8px;
  right: 28px;
}

.motif-b {
  width: 46px;
  height: 46px;
  background: #6d5878;
  top: 78px;
  right: 128px;
}

.motif-c {
  width: 72px;
  height: 72px;
  background: #5c4568;
  top: 128px;
  right: 8px;
}

.motif-line {
  position: absolute;
  width: 2px;
  height: 150px;
  background: #c4b7c8;
  top: 48px;
  right: 78px;
  transform: rotate(28deg);
  transform-origin: top center;
}

.svc-jump-label {
  margin: 36px 0 14px;
  color: var(--plum);
  font-size: 15px;
  font-weight: 650;
}

.svc-jumps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.svc-jump {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 96px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
  text-decoration: none;
}

.svc-jump:hover,
.svc-jump:focus-visible {
  border-color: #b7adba;
}

.svc-jump .icon-bubble {
  width: 52px;
  height: 52px;
  flex: none;
}

.svc-jump .icon-bubble svg {
  width: 24px;
  height: 24px;
}

.svc-jump-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.svc-jump-copy strong {
  font-size: 1.02rem;
  letter-spacing: -0.02em;
}

.svc-jump-copy span {
  color: var(--muted);
  font-size: 14.5px;
}

.svc-down {
  width: 16px;
  height: 16px;
  margin-left: auto;
  flex: none;
}

.svc-block {
  padding-top: 72px;
  padding-bottom: 72px;
}

.svc-split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 48px 56px;
  align-items: center;
}

.svc-split h2,
.svc-modes h2,
.svc-close h2 {
  max-width: 22ch;
}

.svc-split .lede {
  margin-top: 16px;
}

.svc-points {
  display: grid;
  gap: 16px;
  margin-top: 26px;
}

.svc-points li {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.svc-points .icon-bubble {
  width: 48px;
  height: 48px;
  flex: none;
}

.svc-points .icon-bubble svg {
  width: 22px;
  height: 22px;
}

.svc-points li > span:last-child {
  display: grid;
  gap: 2px;
}

.svc-points strong {
  font-size: 1.02rem;
  letter-spacing: -0.02em;
}

.svc-points li span span,
.svc-points-plain li > span:last-child {
  color: var(--muted);
  font-size: 16px;
}

.svc-result {
  margin-top: 26px;
  max-width: 58ch;
  font-size: 16.5px;
}

.svc-note {
  margin-top: 10px;
  max-width: 62ch;
  color: var(--muted);
  font-size: 16px;
}

.svc-split .link-arrow {
  margin-top: 18px;
}

.svc-figure {
  margin: 0;
}

.svc-figure figcaption {
  margin-top: 12px;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

.sheet {
  padding: 28px 22px 36px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(37, 32, 43, 0.06);
}

.sheet-row {
  display: grid;
  grid-template-columns: 1fr 28px 1fr 28px 1fr;
  align-items: center;
}

.sheet-node {
  display: grid;
  justify-items: center;
  gap: 8px;
  color: var(--plum);
  font-size: 14px;
  font-weight: 650;
  text-align: center;
}

.sheet-node svg {
  width: 28px;
  height: 28px;
  padding: 16px;
  border-radius: 50%;
  background: var(--sage);
  box-sizing: content-box;
}

.sheet-node-mid svg {
  background: #ddd0e4;
}

.sheet-arrow {
  height: 1.5px;
  background: var(--aubergine);
  position: relative;
}

.sheet-arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid var(--aubergine);
  border-right: 1.5px solid var(--aubergine);
  transform: translateY(-50%) rotate(45deg);
}

.sheet-lines {
  height: 54px;
  margin-top: 18px;
  border-radius: 8px;
  background:
    linear-gradient(#e4ecd2, #e4ecd2) 8% 20% / 28% 8px no-repeat,
    linear-gradient(#e7dfec, #e7dfec) 8% 55% / 22% 8px no-repeat,
    linear-gradient(#e4ecd2, #e4ecd2) 42% 20% / 24% 8px no-repeat,
    linear-gradient(#e7dfec, #e7dfec) 42% 55% / 18% 8px no-repeat,
    linear-gradient(#e4ecd2, #e4ecd2) 74% 20% / 18% 8px no-repeat;
}

.web-schema {
  position: relative;
  min-height: 300px;
  padding-left: 28px;
}

.web-desk {
  margin-left: 52px;
  border: 1px solid #d9d3dc;
  border-radius: 16px;
  overflow: hidden;
  background: #f7f4ef;
  box-shadow: 0 16px 36px rgba(37, 32, 43, 0.06);
}

.web-top {
  height: 36px;
  background: var(--aubergine);
}

.web-body {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  padding: 18px 18px 8px 64px;
}

.web-body strong {
  display: block;
  margin-bottom: 10px;
  font-size: 14px;
}

.web-body i,
.web-body b,
.shop-card i {
  display: block;
  height: 8px;
  margin-top: 8px;
  border-radius: 4px;
  background: #e3ddd4;
}

.web-body b {
  width: 70%;
  height: 22px;
  margin-top: 14px;
  background: var(--aubergine);
}

.web-base {
  margin: 8px 18px 16px 64px;
  padding: 18px 16px;
  border-radius: 10px;
  background: #e3eec4;
  font-size: 14px;
  font-weight: 650;
}

.web-phone {
  position: absolute;
  left: 0;
  top: 42px;
  z-index: 1;
  display: grid;
  gap: 8px;
  width: 108px;
  padding: 14px 10px;
  border: 1px solid #d9d3dc;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(37, 32, 43, 0.1);
  font-size: 12px;
  font-weight: 650;
}

.web-phone span {
  display: block;
  padding: 8px 6px;
  border-radius: 6px;
  background: #f3f0ea;
}

.web-phone .is-contact {
  background: #e3eec4;
}

.shop-flow {
  display: grid;
  grid-template-columns: 1fr 28px 1fr 28px 1fr;
  align-items: center;
}

.shop-card {
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: 16px 10px 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  text-align: center;
  box-shadow: 0 12px 28px rgba(37, 32, 43, 0.05);
}

.shop-card strong {
  font-size: 14px;
}

.shop-card i {
  width: 70%;
}

.shop-ico,
.shop-box {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 14px;
}

.shop-ico {
  background: #e7f0c8;
}

.shop-ico svg {
  width: 28px;
  height: 28px;
}

.shop-card:last-child .shop-ico {
  background: #e4d7ea;
}

.shop-box {
  background: #e7e1d8;
  border-radius: 10px;
  transform: rotate(8deg);
}

.shop-link {
  height: 1.5px;
  background: #b7adba;
  position: relative;
}

.shop-link::before,
.shop-link::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  border: 1.5px solid #8d8392;
  transform: translateY(-50%);
}

.shop-link::before { left: -2px; }
.shop-link::after { right: -2px; }

.cycle {
  position: relative;
  width: min(100%, 360px);
  height: 360px;
  margin-inline: auto;
}

.cycle-arrows {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.cycle-node {
  position: absolute;
  display: grid;
  justify-items: center;
  gap: 6px;
  width: 96px;
  color: var(--plum);
  font-size: 14px;
  font-weight: 680;
  text-align: center;
}

.cycle-bubble {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--sage);
}

.cycle-bubble svg {
  width: 28px;
  height: 28px;
}

.cycle-bubble.is-lilac {
  background: #e3d4ea;
}

.cycle-ziele { top: 0; left: 50%; transform: translateX(-50%); }
.cycle-mass { top: 50%; right: 0; transform: translateY(-50%); }
.cycle-aus { bottom: 0; left: 50%; transform: translateX(-50%); }
.cycle-anp { top: 50%; left: 0; transform: translateY(-50%); }

.svc-paths.section {
  padding-top: 28px;
  padding-bottom: 28px;
}

section:has(.svc-modes) {
  padding-top: 36px;
  padding-bottom: 20px;
}

.svc-paths .svc-split {
  padding: 48px 40px;
  border-radius: 24px;
  background: #e7f0c4;
}

.svc-paths .icon-bubble {
  background: #f4f8e4;
}

.svc-modes .icon-bubble {
  background: var(--sage);
}

.path-pair {
  display: grid;
  grid-template-columns: 1fr 88px 1fr;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  padding: 18px 12px;
  border-radius: 16px;
  background: rgba(255, 252, 248, 0.72);
}

.path-card {
  display: grid;
  justify-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 680;
  text-align: center;
}

.path-bridge {
  display: grid;
  place-items: center;
  color: var(--plum);
}

.path-bridge svg {
  width: 88px;
  height: 28px;
}

.svc-modes {
  padding: 56px 48px 40px;
  border-radius: 24px;
  background: var(--aubergine);
  color: var(--ivory);
}

.svc-modes .eyebrow {
  color: rgba(246, 244, 239, 0.72);
}

.svc-modes h2 {
  max-width: 18ch;
}

.svc-modes .lede {
  margin-top: 16px;
  max-width: 62ch;
  color: rgba(246, 244, 239, 0.9);
}

.svc-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 36px;
}

.svc-mode-grid article {
  padding: 8px 28px 8px 0;
}

.svc-mode-grid article + article {
  padding: 8px 28px;
  border-left: 1px solid rgba(246, 244, 239, 0.2);
}

.svc-mode-grid h3 {
  margin-top: 16px;
  font-size: 1.8rem;
}

.svc-mode-grid article > p {
  margin-top: 10px;
  color: rgba(246, 244, 239, 0.9);
  font-size: 16px;
}

.svc-agree {
  margin-top: 18px;
  font-size: 15.5px;
}

.svc-agree span {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(246, 244, 239, 0.7);
}

.svc-modes .link-arrow {
  margin-top: 18px;
  color: var(--ivory);
  text-decoration-color: rgba(246, 244, 239, 0.45);
}

.svc-mode-note {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid rgba(246, 244, 239, 0.2);
  color: rgba(246, 244, 239, 0.86);
  font-size: 15.5px;
}

.svc-close-grid {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px 64px;
}

.svc-close-grid > div:first-child {
  flex: 1;
  min-width: 0;
  max-width: 760px;
}

.svc-close h2 {
  max-width: 18em;
}

.svc-close .lede {
  margin-top: 16px;
  max-width: 46rem;
}

.svc-close-action {
  display: grid;
  justify-items: start;
  gap: 14px;
  flex: none;
  max-width: 280px;
}

.svc-close-action p {
  color: var(--muted);
  font-size: 15.5px;
}

#websites,
#e-commerce,
#marketing {
  scroll-margin-top: calc(var(--header) + 16px);
}

@media (max-width: 980px) {
  .svc-hero-grid,
  .svc-split,
  .svc-jumps,
  .svc-mode-grid,
  .svc-close-grid,
  .shop-flow {
    grid-template-columns: 1fr;
  }

  .svc-motif {
    display: none;
  }

  .svc-close-grid,
  .svc-paths .svc-split {
    display: grid;
  }

  .svc-paths .svc-split,
  .svc-modes {
    padding: 32px 24px;
  }

  .svc-mode-grid article,
  .svc-mode-grid article + article {
    padding: 22px 0;
    border-left: 0;
    border-top: 1px solid rgba(246, 244, 239, 0.2);
  }

  .svc-mode-grid article:first-child {
    border-top: 0;
    padding-top: 0;
  }

  .shop-flow {
    gap: 12px;
  }

  .shop-link {
    width: 1.5px;
    height: 24px;
    justify-self: center;
  }

  .web-schema {
    min-height: 0;
    padding-left: 0;
  }

  .web-phone {
    position: static;
    width: auto;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 12px;
  }

  .web-desk,
  .web-base {
    margin-left: 0;
  }

  .web-body,
  .web-base {
    padding-left: 16px;
  }

  .cycle {
    height: 320px;
  }
}

@media (max-width: 640px) {
  .svc-hero h1 span {
    display: inline;
  }

  .svc-hero h1 span::after {
    content: " ";
  }

  .sheet-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .sheet-arrow {
    width: 1.5px;
    height: 18px;
    justify-self: center;
  }
}
.wp-hero {
  padding: 28px 0 8px;
}

.wp-hero-grid,
.wp-split {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  gap: 40px 56px;
  align-items: center;
}

.wp-hero h1 {
  max-width: none;
  font-size: clamp(2.35rem, 4vw, 3.85rem);
}

.wp-hero h1 span {
  display: block;
}

.wp-hero .lede,
.wp-edit .lede,
.wp-relaunch .lede {
  margin-top: 18px;
}

.wp-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 28px;
}

.wp-note {
  margin-top: 14px;
  max-width: 62ch;
  color: var(--muted);
  font-size: 16px;
}

.wp-figure {
  margin: 0;
}

.wp-figure figcaption {
  margin-top: 14px;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

.wp-stage {
  position: relative;
  min-height: 320px;
}

.wp-browser,
.wp-sheet,
.wp-cms-edit,
.wp-cms-site,
.wp-audit-card {
  border: 1px solid #e4dde6;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(37, 32, 43, 0.07);
}

.wp-browser {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 14px;
  width: min(100%, 390px);
  padding: 22px;
  transform: rotate(-1.5deg);
}

.wp-pills {
  display: grid;
  gap: 10px;
  align-content: center;
}

.wp-pills span,
.wp-cms-title {
  display: block;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f3f0ea;
  font-size: 14px;
  font-weight: 680;
}

.wp-scene {
  position: relative;
  min-height: 168px;
  border-radius: 12px;
  background: #e7f0c8;
  overflow: hidden;
}

.wp-sun {
  position: absolute;
  top: 22px;
  right: 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #f6f4ef;
}

.wp-hill {
  position: absolute;
  left: -10%;
  right: -10%;
  bottom: -20px;
  height: 78px;
  border-radius: 50% 50% 0 0;
  background: #c5d98a;
}

.wp-join {
  position: absolute;
  top: 18px;
  left: 340px;
  width: 90px;
  height: 48px;
}

.wp-sheet {
  position: absolute;
  top: 28px;
  right: 0;
  display: grid;
  gap: 10px;
  width: 148px;
  padding: 16px 14px 18px;
}

.wp-sheet strong {
  font-size: 14px;
}

.wp-sheet-block,
.wp-sheet i,
.wp-cms-blocks i,
.wp-cms-blocks b {
  display: block;
  border-radius: 6px;
  background: #ece7e1;
}

.wp-sheet-block {
  height: 42px;
  background: #e3eec4;
}

.wp-sheet i {
  height: 8px;
}

.wp-aims h2,
.wp-close h2,
.wp-after h2 {
  max-width: 20em;
}

.wp-scope h2,
.wp-faq h2 {
  max-width: 22ch;
}

.wp-edit h2 {
  max-width: 14em;
}

.wp-aims-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px 40px;
  margin-top: 40px;
}

.wp-aims-grid h3,
.wp-check h3 {
  margin-top: 16px;
  font-size: 1.35rem;
}

.wp-aims-grid p,
.wp-check p,
.wp-scope-grid p {
  margin-top: 8px;
  color: var(--muted);
  font-size: 16.5px;
}

.wp-scope .lede {
  margin-top: 16px;
}

.wp-scope-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 32px;
}

.wp-scope-grid article {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 22px 22px 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.wp-scope-grid h3 {
  font-size: 1.2rem;
}

.wp-num {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  color: var(--plum);
  font-size: 14px;
  font-weight: 720;
}

.wp-result {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #e7f0c8;
  color: var(--plum);
  font-size: 15.5px;
}

.wp-callout {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-top: 18px;
  padding: 16px 18px;
  border-radius: 14px;
  background: #efe8f3;
  color: var(--plum);
  font-size: 16px;
}

.wp-callout .icon-bubble {
  width: 42px;
  height: 42px;
  flex: none;
  background: #fff;
}

.wp-callout .icon-bubble svg {
  width: 20px;
  height: 20px;
}

.wp-info {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: none;
  border: 1.5px solid var(--plum);
  border-radius: 50%;
  font-size: 14px;
  font-weight: 720;
  font-family: Georgia, serif;
}

.wp-points {
  display: grid;
  gap: 14px;
  margin-top: 26px;
}

.wp-points li {
  display: flex;
  gap: 14px;
  align-items: center;
  font-size: 16.5px;
}

.wp-points .icon-bubble,
.wp-check .icon-bubble {
  width: 48px;
  height: 48px;
  flex: none;
}

.wp-points .icon-bubble svg,
.wp-check .icon-bubble svg {
  width: 22px;
  height: 22px;
}

.wp-cms {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) 48px minmax(0, 1fr);
  align-items: center;
}

.wp-cms-edit,
.wp-cms-site {
  display: grid;
  gap: 10px;
  padding: 18px;
}

.wp-cms-edit strong,
.wp-cms-site > strong {
  font-size: 14px;
}

.wp-field-label {
  color: var(--muted);
  font-size: 13px;
}

.wp-field {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-weight: 680;
}

.wp-cms-title {
  background: #e3eec4;
}

.wp-cms-blocks {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 8px;
}

.wp-cms-blocks i {
  height: 36px;
}

.wp-cms-blocks i:first-child {
  grid-column: 1 / -1;
  height: 52px;
}

.wp-cms-blocks b {
  height: 36px;
  background: #e3eec4;
}

.wp-relaunch.section {
  padding-top: 24px;
  padding-bottom: 24px;
}

.wp-relaunch-panel {
  padding: 48px 40px 40px;
  border-radius: 24px;
  background: #e7f0c4;
}

.wp-relaunch .lede,
.wp-check p {
  color: #3f3a44;
}

.wp-relaunch .icon-bubble {
  background: #f6f4ef;
}

.wp-check {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 28px;
}

.wp-check h3 {
  font-size: 1.05rem;
}

.wp-audit {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  text-align: center;
}

.wp-audit-label {
  display: block;
  font-size: 14px;
  font-weight: 700;
}

.wp-audit-stem {
  display: block;
  width: 1.5px;
  height: 22px;
  margin: 8px auto;
  background: var(--aubergine);
}

.wp-audit-stem::before {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  margin-left: -3px;
  border-radius: 50%;
  background: var(--aubergine);
}

.wp-audit-card {
  display: grid;
  gap: 8px;
  justify-items: center;
  padding: 12px 8px 14px;
}

.wp-audit-card strong {
  font-size: 13px;
  line-height: 1.3;
}

.wp-audit-art {
  display: block;
  width: 100%;
  height: 58px;
  border-radius: 8px;
  background: #f4f1ea;
}

.art-keep {
  background:
    linear-gradient(#d7e4b0, #d7e4b0) 12% 70% / 76% 28px no-repeat,
    #f4f1ea;
}

.art-flow {
  background:
    radial-gradient(circle at 50% 28%, #d9e7ac 0 8px, transparent 9px),
    radial-gradient(circle at 22% 72%, #493351 0 6px, transparent 7px),
    radial-gradient(circle at 50% 72%, #493351 0 6px, transparent 7px),
    radial-gradient(circle at 78% 72%, #493351 0 6px, transparent 7px),
    #f4f1ea;
}

.art-add {
  background:
    linear-gradient(#fff, #fff) 18% 30% / 46% 34px no-repeat,
    radial-gradient(circle at 78% 62%, #d9e7ac 0 12px, transparent 13px),
    #f4f1ea;
}

.wp-relaunch .wp-callout {
  margin-top: 28px;
  background: rgba(255, 252, 248, 0.55);
}

.wp-relaunch .btn {
  margin-top: 22px;
}

.wp-process {
  margin-top: 36px;
}

.wp-process-head,
.wp-step {
  display: grid;
  grid-template-columns: minmax(200px, 0.8fr) 1fr 1fr;
  gap: 18px 28px;
  align-items: start;
}

.wp-process-head {
  padding: 0 0 12px;
  color: var(--plum);
  font-size: 15px;
  font-weight: 720;
}

.wp-process-head span:nth-child(2),
.wp-process-head span:nth-child(3) {
  padding-left: 2px;
}

.wp-step {
  padding: 18px 0;
  border-top: 1px solid var(--line);
}

.wp-step-name {
  display: flex;
  align-items: center;
  gap: 14px;
}

.wp-step-name strong {
  font-size: 1.05rem;
  letter-spacing: -0.02em;
}

.wp-step p {
  margin: 0;
  color: var(--muted);
  font-size: 16px;
}

.wp-who {
  display: none;
}

.wp-after.section {
  padding-top: 28px;
  padding-bottom: 12px;
}

.wp-after-panel {
  padding: 48px 48px 28px;
  border-radius: 24px;
  background: var(--aubergine);
  color: var(--ivory);
}

.wp-after .eyebrow {
  color: rgba(246, 244, 239, 0.72);
}

.wp-after h2 {
  max-width: 22ch;
}

.wp-after-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 32px;
}

.wp-after-grid article {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding-right: 28px;
}

.wp-after-grid article + article {
  padding-left: 28px;
  padding-right: 0;
  border-left: 1px solid rgba(246, 244, 239, 0.22);
}

.wp-after .icon-bubble {
  background: var(--sage);
}

.wp-after h3 {
  color: var(--ivory);
  font-size: 1.25rem;
}

.wp-after-grid p {
  margin-top: 8px;
  color: rgba(246, 244, 239, 0.9);
  font-size: 16px;
}

.wp-after .link-arrow {
  margin-top: 14px;
  color: var(--ivory);
  text-decoration-color: rgba(246, 244, 239, 0.5);
}

.wp-after-note {
  margin-top: 26px;
  padding-top: 16px;
  border-top: 1px solid rgba(246, 244, 239, 0.22);
  color: rgba(246, 244, 239, 0.86);
  font-size: 15px;
}

.wp-faq .faq-list {
  display: grid;
  gap: 12px;
  margin-top: 28px;
  border-top: 0;
}

.wp-faq .faq-item {
  padding: 0 22px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.wp-faq .faq-item h3 {
  font-size: inherit;
  font-weight: inherit;
}

.wp-faq .faq-item button {
  min-height: 72px;
  font-size: 1.12rem;
}

.wp-close .lede {
  margin-top: 16px;
}

.wp-close .btn {
  margin-top: 26px;
}

#leistungsumfang {
  scroll-margin-top: calc(var(--header) + 16px);
}

@media (max-width: 980px) {
  .wp-hero-grid,
  .wp-split,
  .wp-aims-grid,
  .wp-scope-grid,
  .wp-check,
  .wp-audit,
  .wp-after-grid,
  .wp-process-head,
  .wp-step,
  .wp-cms {
    grid-template-columns: 1fr;
  }

  .wp-stage {
    min-height: 0;
    display: grid;
    gap: 16px;
  }

  .wp-browser,
  .wp-sheet {
    position: static;
    width: auto;
    transform: none;
  }

  .wp-join {
    display: none;
  }

  .wp-process-head {
    display: none;
  }

  .wp-who {
    display: block;
    margin-bottom: 4px;
    color: var(--plum);
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .wp-step {
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
  }

  .wp-step + .wp-step {
    margin-top: 12px;
    border-top: 1px solid var(--line);
  }

  .wp-relaunch-panel,
  .wp-after-panel {
    padding: 28px 22px;
  }

  .wp-after-grid article,
  .wp-after-grid article + article {
    padding: 18px 0;
    border-left: 0;
    border-top: 1px solid rgba(246, 244, 239, 0.22);
  }

  .wp-after-grid article:first-child {
    border-top: 0;
    padding-top: 0;
  }

  .wp-cms-join {
    transform: rotate(90deg);
    justify-self: center;
  }
}

@media (max-width: 640px) {
  .wp-hero h1 span {
    display: inline;
  }

  .wp-hero h1 span::after {
    content: " ";
  }

  .wp-browser {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wp-browser {
    transform: none;
  }
}
.ec-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ec-hero {
  padding: 28px 0 8px;
}

.ec-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.72fr);
  gap: 36px 40px;
  align-items: center;
}

.ec-split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 36px 48px;
  align-items: center;
}

.ec-hero h1 {
  max-width: none;
  font-size: clamp(2.2rem, 3.8vw, 3.45rem);
}

.ec-hero h1 span {
  display: block;
}

.ec-hero .lede,
.ec-split .lede,
.ec-buy .lede {
  margin-top: 18px;
}

.ec-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 28px;
}

.ec-note {
  margin-top: 14px;
  max-width: 68ch;
  color: var(--muted);
  font-size: 16px;
}

.ec-figure {
  margin: 0;
}

.ec-figure figcaption {
  margin-top: 12px;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

.ec-stage {
  position: relative;
  min-height: 340px;
}

.ec-card {
  border: 1px solid #e4dde6;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 34px rgba(37, 32, 43, 0.07);
}

.ec-card-product,
.ec-card-data,
.ec-card-order {
  position: absolute;
  padding: 14px;
}

.ec-card-product {
  left: 0;
  top: 28px;
  width: 190px;
  min-height: 250px;
  transform: rotate(-2deg);
}

.ec-card-data {
  right: 8px;
  top: 0;
  width: 150px;
}

.ec-card-order {
  right: 0;
  top: 168px;
  width: 158px;
}

.ec-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
}

.ec-bottle {
  display: block;
  width: 92px;
  margin: 12px auto 0;
  color: #c5d48a;
}

.ec-bottle svg {
  display: block;
  width: 100%;
  height: auto;
}

.ec-bottle.is-plum {
  color: #6a5478;
}

.ec-bottle.is-mini {
  width: 36px;
  margin: 0;
}

.ec-lines {
  display: grid;
  gap: 8px;
}

.ec-lines i,
.ec-lines b {
  display: block;
  height: 8px;
  border-radius: 4px;
  background: #ece7e1;
}

.ec-lines b {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #d9e7ac;
}

.ec-lines b.is-plum {
  background: #6a5478;
}

.ec-order-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ec-order-row i {
  flex: 1;
  height: 8px;
  border-radius: 4px;
  background: #ece7e1;
}

.ec-order-bar {
  display: block;
  height: 28px;
  margin-top: 10px;
  border-radius: 8px;
  background: #e3eec4;
}

.ec-stage-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.ec-buy h2,
.ec-close h2,
.ec-faq h2,
.ec-plan h2 {
  max-width: 22em;
}

.ec-buy-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 36px;
  margin-top: 36px;
}

.ec-buy-grid::before {
  content: "";
  position: absolute;
  top: 32px;
  left: 12%;
  right: 12%;
  height: 1.5px;
  background: #d3ccd4;
}

.ec-buy-grid h3 {
  margin-top: 16px;
  font-size: 1.25rem;
}

.ec-buy-grid p,
.ec-scope p {
  margin-top: 8px;
  color: var(--muted);
  font-size: 16.5px;
}

.ec-scope {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 28px;
}

.ec-scope article {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.ec-scope .icon-bubble {
  width: 52px;
  height: 52px;
  flex: none;
}

.ec-scope .icon-bubble svg {
  width: 24px;
  height: 24px;
}

.ec-scope h3 {
  display: flex;
  gap: 10px;
  align-items: baseline;
  font-size: 1.12rem;
}

.ec-scope h3 span,
.ec-num {
  color: var(--plum);
  font-weight: 720;
}

.ec-result {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #e7f0c8;
  color: var(--plum);
  font-size: 15px;
}

.ec-callout,
.ec-after-note {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-top: 16px;
  color: var(--plum);
  font-size: 16px;
}

.ec-info {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: none;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  font-family: Georgia, serif;
  font-size: 14px;
  font-weight: 700;
}

.ec-split h2 {
  max-width: 14em;
}

.ec-checks,
.ec-questions {
  display: grid;
  gap: 12px;
  margin-top: 22px;
}

.ec-checks li,
.ec-questions li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 16.5px;
}

.ec-checks li::before,
.ec-questions li::before {
  content: "";
  width: 22px;
  height: 22px;
  flex: none;
  margin-top: 1px;
  border-radius: 50%;
  background: var(--sage) center / 12px 12px no-repeat;
}

.ec-checks li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.2 4.6 9 10 3.2' fill='none' stroke='%2325202b' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

.ec-questions li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ctext x='3.2' y='9.2' font-size='9' font-family='Georgia' fill='%2325202b'%3E?%3C/text%3E%3C/svg%3E");
}

.ec-family {
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: 12px;
  align-items: start;
}

.ec-family-tree {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.ec-var {
  display: grid;
  justify-items: center;
  width: 120px;
  padding: 10px 8px 12px;
  text-align: center;
}

.ec-var .ec-bottle {
  width: 48px;
  margin: 0 0 6px;
}

.ec-var strong,
.ec-pdata strong,
.ec-station strong {
  font-size: 13px;
}

.ec-branch {
  padding: 4px 10px;
  border-radius: 999px;
  background: #efe8c8;
  font-size: 13px;
  font-weight: 700;
}

.ec-vars {
  display: flex;
  gap: 10px;
}

.ec-pdata {
  padding: 14px;
}

.ec-arch-section.section {
  padding-top: 20px;
  padding-bottom: 20px;
}

.ec-arch-panel {
  padding: 44px 36px;
  border-radius: 24px;
  background: #e7f0c4;
}

.ec-arch-panel .lede,
.ec-arch-panel .ec-note {
  color: #3e3944;
}

.ec-arch-panel .btn {
  margin-top: 22px;
}

.ec-arch {
  display: grid;
  gap: 10px;
}

.ec-rail {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  color: var(--plum);
  font-size: 13px;
}

.ec-rail strong {
  position: relative;
  z-index: 1;
  padding: 4px 10px;
  border-radius: 999px;
  background: #fff;
  white-space: nowrap;
}

.ec-rail-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 24px;
}

.ec-chev {
  width: 8px;
  height: 8px;
  flex: none;
  border-style: solid;
  border-color: var(--aubergine);
}

.ec-chev-up {
  border-width: 1.6px 0 0 1.6px;
  transform: rotate(45deg);
}

.ec-chev-down {
  border-width: 0 1.6px 1.6px 0;
  transform: rotate(45deg);
}

.is-mob { display: none; }

.ec-stations {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ec-station {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 12px 8px;
  border-radius: 14px;
  background: #fff;
  text-align: center;
  box-shadow: 0 10px 24px rgba(37, 32, 43, 0.05);
}

.ec-station-art {
  display: block;
  width: 100%;
  height: 72px;
  border-radius: 8px;
  background: #f4f1ea;
}

.art-shop {
  background:
    linear-gradient(#d7e4b0, #d7e4b0) 18% 28% / 28% 46px no-repeat,
    linear-gradient(#fff, #fff) 52% 22% / 30% 8px no-repeat,
    linear-gradient(#ece7e1, #ece7e1) 52% 42% / 30% 8px no-repeat,
    #f6f3ee;
}

.art-commerce {
  background:
    linear-gradient(#fff, #fff) 20% 20% / 60% 14px no-repeat,
    radial-gradient(circle at 28% 27%, #d9e7ac 0 3px, transparent 4px),
    radial-gradient(circle at 40% 27%, #493351 0 3px, transparent 4px),
    linear-gradient(#fff, #fff) 20% 48% / 60% 14px no-repeat,
    linear-gradient(#fff, #fff) 20% 76% / 60% 14px no-repeat,
    #f4f1ea;
}

.art-stock {
  background:
    linear-gradient(#d7c4b0, #d7c4b0) 18% 30% / 22% 18px no-repeat,
    linear-gradient(#d7c4b0, #d7c4b0) 46% 30% / 22% 18px no-repeat,
    linear-gradient(#c9b49a, #c9b49a) 18% 68% / 22% 16px no-repeat,
    linear-gradient(#c9b49a, #c9b49a) 46% 68% / 22% 16px no-repeat,
    #f4f1ea;
}

.ec-arch-note {
  margin-top: 8px;
  color: var(--muted);
  font-size: 13.5px;
  text-align: center;
}

.ec-process {
  margin-top: 32px;
}

.ec-process-head,
.ec-step {
  display: grid;
  grid-template-columns: minmax(210px, 0.85fr) 1fr 1fr;
  gap: 16px 28px;
  align-items: start;
}

.ec-process-head {
  padding-bottom: 10px;
  font-size: 15px;
  font-weight: 720;
}

.ec-step {
  padding: 16px 0;
  border-top: 1px solid var(--line);
}

.ec-step-name {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ec-num {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  font-size: 14px;
}

.ec-step p {
  margin: 0;
  color: var(--muted);
  font-size: 16px;
}

.ec-who { display: none; }

.ec-switch {
  margin-top: 18px;
}

.ec-process + .ec-note + .btn,
.ec-switch + .btn {
  margin-top: 18px;
}

.ec-after.section {
  padding-top: 24px;
  padding-bottom: 8px;
}

.ec-after-panel {
  padding: 40px 40px 24px;
  border-radius: 24px;
  background: var(--aubergine);
  color: var(--ivory);
}

.ec-after .eyebrow { color: rgba(246, 244, 239, 0.72); }

.ec-after h2 { max-width: 16em; }

.ec-after-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 28px;
}

.ec-after-grid article {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding-right: 24px;
}

.ec-after-grid article + article {
  padding-left: 24px;
  padding-right: 0;
  border-left: 1px solid rgba(246, 244, 239, 0.22);
}

.ec-after .icon-bubble { background: var(--sage); }

.ec-after h3 {
  color: var(--ivory);
  font-size: 1.2rem;
}

.ec-after-grid p {
  margin-top: 8px;
  color: rgba(246, 244, 239, 0.9);
  font-size: 16px;
}

.ec-after .link-arrow {
  margin-top: 12px;
  color: var(--ivory);
  text-decoration-color: rgba(246, 244, 239, 0.5);
}

.ec-after-note {
  margin-top: 22px;
  padding-top: 14px;
  border-top: 1px solid rgba(246, 244, 239, 0.22);
  color: rgba(246, 244, 239, 0.9);
  font-size: 15px;
}

.ec-faq .faq-list {
  display: grid;
  gap: 12px;
  margin-top: 28px;
  border-top: 0;
}

.ec-faq .faq-item {
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.ec-faq .faq-item h3 {
  font-size: inherit;
  font-weight: inherit;
}

.ec-faq .faq-item button {
  min-height: 72px;
  font-size: 1.08rem;
}

.ec-faq .faq-item button > span:first-child {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ec-q {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  font-size: 14px;
  font-weight: 720;
}

.ec-faq .faq-panel p {
  padding-left: 44px;
}

.ec-close-grid {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px 48px;
}

.ec-close-grid > div:first-child {
  flex: 1;
  min-width: 0;
  max-width: 760px;
}

.ec-close .lede { margin-top: 16px; }

.ec-close-action {
  display: grid;
  justify-items: start;
  gap: 12px;
  max-width: 280px;
}

.ec-close-action p {
  color: var(--muted);
  font-size: 15px;
}

#shop-leistungen {
  scroll-margin-top: calc(var(--header) + 16px);
}

@media (max-width: 980px) {
  .ec-hero-grid,
  .ec-split,
  .ec-buy-grid,
  .ec-scope,
  .ec-family,
  .ec-after-grid,
  .ec-process-head,
  .ec-step,
  .ec-close-grid {
    grid-template-columns: 1fr;
  }

  .ec-close-grid { display: grid; }

  .ec-stage {
    min-height: 0;
    display: grid;
    gap: 12px;
  }

  .ec-card-product,
  .ec-card-data,
  .ec-card-order {
    position: static;
    width: auto;
    min-height: 0;
    transform: none;
  }

  .ec-stage-lines,
  .ec-buy-grid::before,
  .ec-process-head { display: none; }

  .ec-who {
    display: block;
    margin-bottom: 4px;
    color: var(--plum);
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .ec-step {
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
  }

  .ec-step + .ec-step { margin-top: 12px; }

  .ec-arch {
    grid-template-columns: 36px minmax(0, 1fr) 36px;
    grid-template-areas: "data stations orders";
    align-items: stretch;
  }

  .ec-rail-data { grid-area: data; }
  .ec-stations { grid-area: stations; grid-template-columns: 1fr; }
  .ec-rail-orders { grid-area: orders; }

  .ec-rail {
    flex-direction: column;
    gap: 10px;
  }

  .ec-rail strong {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
  }

  .ec-rail-svg { display: none; }

  .is-desk { display: none; }
  .is-mob { display: block; }

  .ec-arch-panel,
  .ec-after-panel { padding: 28px 20px; }

  .ec-after-grid article,
  .ec-after-grid article + article {
    padding: 16px 0;
    border-left: 0;
    border-top: 1px solid rgba(246, 244, 239, 0.22);
  }

  .ec-after-grid article:first-child {
    border-top: 0;
    padding-top: 0;
  }
}

@media (max-width: 640px) {
  .ec-hero h1 span { display: inline; }
  .ec-hero h1 span::after { content: " "; }
}

@media (prefers-reduced-motion: reduce) {
  .ec-card-product { transform: none; }
}

/* Marketing */
.mp-hero { padding: 28px 0 8px; }

.mp-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(220px, 0.55fr);
  gap: 36px 48px;
  align-items: center;
}

.mp-split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 36px 48px;
  align-items: center;
}

.mp-hero h1 {
  max-width: none;
  font-size: clamp(2.4rem, 3.35vw, 3.15rem);
}

.mp-hero h1 span { display: block; }

.mp-hero .lede,
.mp-goals .lede,
.mp-split .lede { margin-top: 18px; }

.mp-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 28px;
}

.mp-note {
  margin-top: 16px;
  max-width: 70ch;
  color: var(--muted);
  font-size: 16px;
}

.mp-figure { margin: 0; }

.mp-figure figcaption {
  margin-top: 12px;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

.mp-plan {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.mp-node {
  display: grid;
  place-items: center;
  width: min(100%, 180px);
  min-height: 64px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(37, 32, 43, 0.07);
  font-weight: 720;
}

.mp-node.is-mid { background: var(--sage); }

.mp-link {
  width: 1.5px;
  height: 18px;
  background: var(--aubergine);
}

#goals-title,
#areas-title,
#work-title,
#mp-faq-title,
#next-title { max-width: 22em; }

.mp-measure h2 { max-width: 36rem; }

.mp-measure h2 span { display: block; }

.mp-budget h2 { max-width: 17em; }

.mp-measure .icon-bubble { background: var(--ivory); }

.mp-goals-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 36px;
  margin-top: 36px;
}

.mp-goals-grid h3 { margin-top: 16px; font-size: 1.25rem; }

.mp-goals-grid p,
.mp-areas p { margin-top: 8px; color: var(--muted); font-size: 16.5px; }

.mp-areas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 28px;
}

.mp-areas article {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.mp-areas .icon-bubble,
.mp-goals .icon-bubble,
.mp-measure .icon-bubble,
.mp-budget .icon-bubble {
  width: 56px;
  height: 56px;
  flex: none;
}

.mp-areas .icon-bubble svg,
.mp-goals .icon-bubble svg,
.mp-measure .icon-bubble svg,
.mp-budget .icon-bubble svg { width: 26px; height: 26px; }

.mp-areas h3 { font-size: 1.2rem; }

.mp-areas ul {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}

.mp-areas li,
.mp-checks li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  color: var(--plum);
  font-size: 15.5px;
}

.mp-areas li::before,
.mp-checks li::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: none;
  margin-top: 3px;
  border-radius: 50%;
  background: var(--sage) center / 10px 10px no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.2 4.6 9 10 3.2' fill='none' stroke='%2325202b' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

.mp-result {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--plum);
  font-size: 15.5px;
}

.mp-split h2 { max-width: 16em; }

.mp-checks {
  display: grid;
  gap: 10px;
  margin-top: 20px;
}

.mp-journey {
  display: grid;
  grid-template-columns: auto 28px minmax(0, 1fr) 28px auto;
  align-items: center;
  gap: 6px;
}

.mp-stop {
  display: grid;
  justify-items: center;
  gap: 6px;
  text-align: center;
  font-size: 14px;
}

.mp-stop .icon-bubble { width: 64px; height: 64px; }

.mp-page {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(37, 32, 43, 0.05);
}

.mp-page-art {
  display: block;
  width: 100%;
  height: 54px;
  border-radius: 8px;
  background:
    linear-gradient(#e7e1d8, #e7e1d8) 12% 18% / 76% 22px no-repeat,
    linear-gradient(#d9e7ac, #d9e7ac) 12% 70% / 76% 12px no-repeat,
    #f6f3ee;
}

.mp-page span { color: var(--muted); font-size: 13px; }

.mp-arrow {
  height: 1.5px;
  background: var(--aubergine);
  position: relative;
}

.mp-arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid var(--aubergine);
  border-right: 1.5px solid var(--aubergine);
  transform: translateY(-50%) rotate(45deg);
}

.mp-measure.section { padding-top: 24px; padding-bottom: 12px; }

.mp-measure-panel {
  padding: 44px 40px 28px;
  border-radius: 24px;
  background: #e7f0c4;
}

.mp-measure .lede,
.mp-measure .mp-note { color: #3e3944; }

.mp-questions {
  display: grid;
  margin-top: 28px;
}

.mp-questions article {
  display: grid;
  grid-template-columns: 56px minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 16px;
  align-items: center;
  padding: 16px 0;
  border-top: 1px solid rgba(37, 32, 43, 0.12);
}

.mp-questions h3 { font-size: 1.15rem; }

.mp-questions p { margin: 0; color: #3e3944; font-size: 16px; }

.mp-process { margin-top: 28px; }

.mp-process-head,
.mp-step {
  display: grid;
  grid-template-columns: minmax(210px, 0.85fr) 1fr 1fr;
  gap: 16px 28px;
  align-items: start;
}

.mp-process-head { padding-bottom: 10px; font-size: 15px; font-weight: 720; }

.mp-step { padding: 16px 0; border-top: 1px solid var(--line); }

.mp-step-name { display: flex; align-items: center; gap: 12px; }

.mp-num {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  font-size: 14px;
  font-weight: 720;
}

.mp-step p { margin: 0; color: var(--muted); font-size: 16px; }

.mp-who { display: none; }

.mp-process + .mp-note + .link-arrow { margin-top: 8px; }

.mp-budget.section { padding-top: 24px; padding-bottom: 8px; }

.mp-budget-panel {
  padding: 40px 40px 28px;
  border-radius: 24px;
  background: var(--aubergine);
  color: var(--ivory);
}

.mp-budget .eyebrow { color: rgba(246, 244, 239, 0.72); }

.mp-budget h2 { max-width: 18em; }

.mp-budget-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 28px;
}

.mp-budget .icon-bubble { background: var(--sage); }

.mp-budget h3 { margin-top: 14px; color: var(--ivory); font-size: 1.15rem; }

.mp-budget-grid p { margin-top: 8px; color: rgba(246, 244, 239, 0.9); font-size: 15.5px; }

.mp-budget-foot {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px 28px;
  align-items: center;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid rgba(246, 244, 239, 0.22);
}

.mp-btn-light {
  background: var(--ivory);
  color: var(--plum);
}

.mp-btn-light:hover { background: #fff; }

.mp-budget-foot p { margin: 0; color: rgba(246, 244, 239, 0.9); font-size: 15.5px; }

.mp-faq .faq-list {
  display: grid;
  gap: 12px;
  margin-top: 28px;
  border-top: 0;
}

.mp-faq .faq-item {
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.mp-faq .faq-item h3 { font-size: inherit; font-weight: inherit; }

.mp-faq .faq-item button { min-height: 72px; font-size: 1.08rem; }

.mp-faq .faq-item button > span:first-child {
  display: flex;
  align-items: center;
  gap: 12px;
}

.mp-q {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  font-size: 14px;
  font-weight: 720;
}

.mp-faq .faq-panel p { padding-left: 44px; }

.mp-close .lede { margin-top: 16px; }

.mp-close-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 24px;
  margin-top: 24px;
}

.mp-close-row p { margin: 0; max-width: 36ch; color: var(--muted); font-size: 15.5px; }

#marketing-leistungen { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .mp-hero-grid,
  .mp-split,
  .mp-goals-grid,
  .mp-areas,
  .mp-journey,
  .mp-questions article,
  .mp-process-head,
  .mp-step,
  .mp-budget-grid,
  .mp-budget-foot {
    grid-template-columns: 1fr;
  }

  .mp-process-head { display: none; }

  .mp-who {
    display: block;
    margin-bottom: 4px;
    color: var(--plum);
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .mp-step {
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
  }

  .mp-step + .mp-step { margin-top: 12px; }

  .mp-arrow { width: 1.5px; height: 18px; justify-self: center; }

  .mp-arrow::after {
    right: auto;
    left: 50%;
    top: auto;
    bottom: 0;
    transform: translateX(-50%) rotate(135deg);
  }

  .mp-measure-panel,
  .mp-budget-panel { padding: 28px 20px; }

  .mp-questions article { align-items: start; }
}

@media (max-width: 640px) {
  .mp-hero h1 span,
  .mp-measure h2 span { display: inline; }
  .mp-hero h1 span::after { content: " "; }
}

/* Care */
.cr-hero { padding: 28px 0 8px; }

.cr-hero-panel,
.cr-diff-panel,
.cr-support-panel,
.cr-split-panel {
  padding: 44px 40px 32px;
  border-radius: 24px;
}

.cr-hero-panel,
.cr-support-panel,
.cr-split-panel {
  background: var(--aubergine);
  color: var(--ivory);
}

.cr-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, 0.7fr);
  gap: 28px 40px;
  align-items: end;
}

.cr-support-panel,
.cr-close-row {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 28px 48px;
  align-items: center;
}

.cr-hero h1,
.cr-hero-panel .lede,
.cr-support h2,
.cr-support .lede,
.cr-split h2,
.cr-split h3,
.cr-split p,
.cr-support h3 {
  color: var(--ivory);
}

.cr-hero h1 {
  max-width: none;
  font-size: clamp(2.4rem, 3.25vw, 3.05rem);
}

.cr-hero h1 span,
.cr-prep-title span { display: block; }

.cr-hero .eyebrow,
.cr-support .eyebrow,
.cr-split .eyebrow { color: rgba(246, 244, 239, 0.72); }

.cr-hero .lede,
.cr-support .lede { color: rgba(246, 244, 239, 0.92); }

.cr-hero-actions {
  display: grid;
  justify-items: start;
  gap: 16px;
  margin-top: 28px;
}

.cr-btn-light { background: var(--ivory); color: var(--plum); }

.cr-btn-light:hover { background: #fff; }

.cr-hero .link-arrow,
.cr-split .link-arrow { color: var(--ivory); }

.cr-aside,
.cr-figure figcaption,
.cr-hero-panel .cr-note,
.cr-support-panel .cr-note,
.cr-split-panel .cr-note { color: rgba(246, 244, 239, 0.78); }

.cr-aside { margin-top: 28px; font-size: 15.5px; }

.cr-figure { margin: 0; }

.cr-figure figcaption { margin-top: 12px; font-size: 14px; text-align: right; }

.cr-stage { position: relative; min-height: 280px; }

.cr-screen {
  width: min(100%, 280px);
  margin-left: auto;
  padding: 16px;
  border-radius: 16px 16px 8px 8px;
  background: #f7f4ef;
  box-shadow: 0 18px 36px rgba(20, 12, 24, 0.22);
}

.cr-screen span:first-child {
  display: block;
  height: 72px;
  border-radius: 8px;
  background: #e4ddd4;
}

.cr-screen span:last-child {
  display: block;
  height: 12px;
  width: 70%;
  margin-top: 12px;
  border-radius: 6px;
  background: var(--sage);
}

.cr-modules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: -18px;
}

.cr-modules span {
  display: grid;
  justify-items: center;
  gap: 6px;
  min-height: 92px;
  padding: 12px 8px;
  border-radius: 14px;
  background: var(--sage);
  color: var(--plum);
  font-size: 13px;
  font-weight: 720;
  text-align: center;
}

.cr-modules svg { width: 28px; height: 28px; }

.cr-frame h2,
.cr-diff h2,
#scope-title,
#prep-title,
#cr-faq-title,
#next-title { max-width: 18em; }

.cr-support h2 { max-width: 14em; }

.cr-split h2,
#cr-faq-title { max-width: 22em; }

.cr-points,
.cr-diff-grid,
.cr-split-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 32px;
  margin-top: 32px;
}

.cr-points h3,
.cr-scope h3,
.cr-diff h3,
.cr-split h3,
.cr-flow h3 { font-size: 1.2rem; }

.cr-points p,
.cr-scope p,
.cr-diff p,
.cr-split-grid p,
.cr-flow p { margin-top: 8px; color: var(--muted); font-size: 16.5px; }

.cr-scope {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 28px;
}

.cr-scope article {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.cr-scope .icon-bubble,
.cr-points .icon-bubble,
.cr-split .icon-bubble,
.cr-flow .icon-bubble { width: 56px; height: 56px; flex: none; }

.cr-scope svg,
.cr-points svg,
.cr-split svg,
.cr-flow svg { width: 26px; height: 26px; }

.cr-detail {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--plum);
}

.cr-note { margin-top: 16px; max-width: 78ch; color: var(--muted); font-size: 16px; }

.cr-diff.section { padding-top: 12px; }

.cr-diff-panel { background: #e7f0c4; }

.cr-diff .cr-note { color: #3e3944; }

.cr-sketch { display: block; height: 88px; }

.cr-sketch svg { width: 140px; height: 84px; }

.cr-process { margin-top: 28px; }

.cr-process-head,
.cr-step {
  display: grid;
  grid-template-columns: minmax(210px, 0.8fr) 1fr 1fr;
  gap: 16px 24px;
  align-items: center;
}

.cr-process-head {
  padding: 12px 16px;
  border-radius: 12px;
  background: #e7f0c4;
  font-weight: 720;
}

.cr-step { padding: 14px 8px; border-bottom: 1px solid var(--line); }

.cr-step-name { display: flex; align-items: center; gap: 12px; }

.cr-num {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  font-size: 14px;
  font-weight: 720;
}

.cr-step p { margin: 0; color: var(--muted); font-size: 16px; }

.cr-who { display: none; }

.cr-callout {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 28px;
  margin-top: 18px;
  padding: 16px 18px;
  border-radius: 16px;
  background: #f3efe8;
}

.cr-callout p { margin: 0; max-width: 68ch; color: var(--muted); font-size: 15.5px; }

.cr-callout-dark {
  display: block;
  background: rgba(246, 244, 239, 0.08);
}

.cr-callout-dark p,
.cr-support .cr-callout { color: rgba(246, 244, 239, 0.9); }

.cr-flow {
  display: grid;
  gap: 22px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cr-flow li { display: flex; gap: 14px; align-items: flex-start; }

.cr-flow .icon-bubble { background: var(--sage); }

.cr-flow p { margin-top: 4px; color: rgba(246, 244, 239, 0.82); }

.cr-idx { font-weight: 720; }

.cr-split .icon-bubble { background: var(--sage); }

.cr-split-grid p { color: rgba(246, 244, 239, 0.88); }

.cr-split .link-arrow { margin-top: 14px; }

.cr-split .cr-note {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(246, 244, 239, 0.22);
}

.cr-faq .faq-list { display: grid; gap: 12px; margin-top: 28px; border-top: 0; }

.cr-faq .faq-item {
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.cr-faq .faq-item h3 { font-size: inherit; font-weight: inherit; }

.cr-faq .faq-item button { min-height: 72px; font-size: 1.08rem; }

.cr-close-row { align-items: center; }

.cr-close-row p { margin: 0; color: var(--muted); font-size: 18px; }

#care-leistungen { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .cr-hero-grid,
  .cr-support-panel,
  .cr-close-row,
  .cr-points,
  .cr-diff-grid,
  .cr-split-grid,
  .cr-scope,
  .cr-process-head,
  .cr-step { grid-template-columns: 1fr; }

  .cr-process-head { display: none; }

  .cr-who {
    display: block;
    margin-bottom: 4px;
    color: var(--plum);
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .cr-step {
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
  }

  .cr-step + .cr-step { margin-top: 12px; }

  .cr-hero-panel,
  .cr-diff-panel,
  .cr-support-panel,
  .cr-split-panel { padding: 28px 20px; }

  .cr-figure figcaption { text-align: left; }
}

@media (max-width: 640px) {
  .cr-hero h1 span,
  .cr-prep-title span { display: inline; }
  .cr-hero h1 span::after { content: " "; }
}

/* Growth */
.gr-hero { padding: 28px 0 8px; }

.gr-hero-panel,
.gr-kinds-panel,
.gr-quota-panel,
.gr-example {
  border-radius: 24px;
}

.gr-hero-panel,
.gr-kinds-panel {
  padding: 44px 40px 32px;
  background: var(--aubergine);
  color: var(--ivory);
}

.gr-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.75fr);
  gap: 28px 40px;
  align-items: end;
}

.gr-hero h1,
.gr-kinds h2,
.gr-kinds h3 { color: var(--ivory); }

.gr-hero h1 {
  max-width: none;
  font-size: clamp(2.4rem, 3.15vw, 3.05rem);
}

.gr-hero h1 span,
#flow-title span,
#quota-title span,
.gr-rule-title span { display: block; }

.gr-hero .eyebrow,
.gr-kinds .eyebrow { color: rgba(246, 244, 239, 0.72); }

.gr-hero .lede { color: rgba(246, 244, 239, 0.92); }

.gr-hero-actions {
  display: grid;
  justify-items: start;
  gap: 16px;
  margin-top: 28px;
}

.gr-btn-light { background: var(--ivory); color: var(--plum); }

.gr-btn-light:hover { background: #fff; }

.gr-hero .link-arrow,
.gr-kinds .link-arrow { color: var(--ivory); }

.gr-aside,
.gr-figure figcaption { margin-top: 22px; color: rgba(246, 244, 239, 0.78); font-size: 15px; }

.gr-figure { margin: 0; }

.gr-figure figcaption { text-align: right; font-size: 14px; }

.gr-boards {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.gr-boards > span:not(.gr-join) {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  width: 112px;
  min-height: 132px;
  padding: 14px 8px;
  border-radius: 16px;
  background: var(--sage);
  color: var(--plum);
  font-size: 13px;
  font-weight: 720;
  text-align: center;
  box-shadow: 0 14px 28px rgba(20, 12, 24, 0.18);
}

.gr-boards svg { width: 28px; height: 28px; }

.gr-join { width: 18px; height: 2px; background: rgba(246, 244, 239, 0.7); }

#start-title,
#tasks-title,
#priority-title,
#flow-title,
#gr-faq-title,
#next-title { max-width: 16em; }

#quota-title,
#kinds-title { max-width: 18em; }

.gr-points,
.gr-quota-grid,
.gr-kinds-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 32px;
  margin-top: 32px;
}

.gr-points h3,
.gr-tasks h3,
.gr-quota h3,
.gr-kinds h3 { font-size: 1.2rem; }

.gr-points p,
.gr-tasks p,
.gr-quota-grid p,
.gr-kinds p,
.gr-example p { margin-top: 8px; color: var(--muted); font-size: 16.5px; }

.gr-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 28px;
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.gr-row p,
.gr-note { margin: 0; max-width: 78ch; color: var(--muted); font-size: 16px; }

.gr-note { margin-top: 16px; }

.gr-tasks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 28px;
}

.gr-tasks article,
.gr-quota-grid article {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.gr-points .icon-bubble,
.gr-tasks .icon-bubble,
.gr-example .icon-bubble,
.gr-quota .icon-bubble,
.gr-rule .icon-bubble { width: 56px; height: 56px; flex: none; }

.gr-points svg,
.gr-tasks svg,
.gr-example svg,
.gr-quota svg,
.gr-rule svg,
.gr-tile svg { width: 26px; height: 26px; }

.gr-result {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f3efe8;
  color: var(--plum);
}

.gr-result span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 720;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gr-priority-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(280px, 1fr);
  gap: 32px 48px;
  align-items: center;
}

.gr-example {
  padding: 28px 24px 18px;
  background: #e7f0c4;
}

.gr-example h3 { font-size: 1.35rem; }

.gr-example ol {
  display: grid;
  gap: 16px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.gr-example li { display: flex; gap: 12px; align-items: flex-start; }

.gr-example .icon-bubble { background: var(--ivory); }

.gr-example strong { display: block; }

.gr-caption { margin-top: 16px; color: #3e3944; font-size: 14px; }

.gr-process { margin-top: 28px; }

.gr-process-head,
.gr-step {
  display: grid;
  grid-template-columns: minmax(190px, 0.7fr) 1fr 1fr;
  gap: 16px 24px;
  align-items: center;
}

.gr-process-head {
  padding: 12px 16px;
  border-radius: 12px;
  background: #efeaf2;
  font-weight: 720;
}

.gr-step { padding: 14px 8px; border-bottom: 1px solid var(--line); }

.gr-step-name { display: flex; align-items: center; gap: 12px; }

.gr-num {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: none;
  border-radius: 50%;
  background: var(--aubergine);
  color: var(--ivory);
  font-size: 14px;
  font-weight: 720;
}

.gr-step p { margin: 0; color: var(--muted); font-size: 16px; }

.gr-who { display: none; }

.gr-quota.section { padding-top: 12px; }

.gr-quota-panel { padding: 44px 40px 28px; background: #e7f0c4; }

.gr-quota .lede,
.gr-quota .gr-note { color: #3e3944; }

.gr-quota .icon-bubble,
.gr-rule .icon-bubble { background: var(--ivory); }

.gr-rule {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid rgba(37, 32, 43, 0.16);
}

.gr-rule-title { margin: 0; font-size: 1.35rem; font-weight: 750; }

.gr-rule p + p { margin-top: 8px; color: #3e3944; }

.gr-tile {
  display: grid;
  place-items: center;
  width: 72px;
  height: 64px;
  border-radius: 14px;
  background: var(--sage);
  color: var(--plum);
}

.gr-kinds-grid p { color: rgba(246, 244, 239, 0.88); }

.gr-kinds .link-arrow { margin-top: 14px; }

.gr-kinds .gr-note {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(246, 244, 239, 0.22);
  color: rgba(246, 244, 239, 0.86);
}

.gr-faq .faq-list { display: grid; gap: 12px; margin-top: 28px; border-top: 0; }

.gr-faq .faq-item {
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.gr-faq .faq-item h3 { font-size: inherit; font-weight: inherit; }

.gr-faq .faq-item button { min-height: 72px; font-size: 1.08rem; }

.gr-faq .faq-item button > span:first-child { display: flex; align-items: center; gap: 14px; }

.gr-q {
  color: var(--aubergine);
  font-weight: 720;
}

.gr-faq .faq-panel p { padding-left: 36px; }

.gr-close .lede { margin-top: 16px; }

.gr-close .btn { margin-top: 24px; }

#growth-ablauf { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .gr-hero-grid,
  .gr-priority-grid,
  .gr-points,
  .gr-quota-grid,
  .gr-kinds-grid,
  .gr-tasks,
  .gr-process-head,
  .gr-step { grid-template-columns: 1fr; }

  .gr-boards { justify-content: flex-start; flex-wrap: wrap; }

  .gr-process-head { display: none; }

  .gr-who {
    display: block;
    margin-bottom: 4px;
    color: var(--plum);
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .gr-step {
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
  }

  .gr-step + .gr-step { margin-top: 12px; }

  .gr-hero-panel,
  .gr-kinds-panel,
  .gr-quota-panel { padding: 28px 20px; }
}

@media (max-width: 640px) {
  .gr-hero h1 span,
  #flow-title span,
  #quota-title span,
  .gr-rule-title span { display: inline; }
  .gr-hero h1 span::after,
  #flow-title span::before,
  #quota-title span::before,
  .gr-rule-title span::before { content: " "; }
}

/* Zusammenarbeit */
.za-hero { padding: 28px 0 8px; }

.za-hero-panel,
.za-offer-panel,
.za-after-panel { border-radius: 24px; }

.za-hero-panel,
.za-after-panel {
  padding: 44px 40px 28px;
  background: var(--aubergine);
  color: var(--ivory);
}

.za-hero-grid,
.za-change,
.za-close-row,
.za-after-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.85fr);
  gap: 28px 40px;
  align-items: center;
}

.za-hero h1,
.za-after h2,
.za-after h3 { color: var(--ivory); }

.za-hero h1 {
  max-width: none;
  font-size: clamp(2.4rem, 3.05vw, 3rem);
}

.za-hero h1 span { display: block; }

.za-hero .eyebrow,
.za-after .eyebrow { color: rgba(246, 244, 239, 0.72); }

.za-hero .lede,
.za-after .lede { color: rgba(246, 244, 239, 0.92); }

.za-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 28px;
}

.za-btn-light { background: var(--ivory); color: var(--plum); }

.za-btn-light:hover { background: #fff; }

.za-hero .link-arrow { color: var(--ivory); }

.za-aside,
.za-figure figcaption { margin-top: 22px; color: rgba(246, 244, 239, 0.78); font-size: 15px; }

.za-figure { margin: 0; }

.za-figure figcaption { font-size: 14px; text-align: right; }

.za-plan {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.za-plan span {
  display: grid;
  place-items: center;
  min-height: 88px;
  padding: 16px;
  border-radius: 16px;
  background: var(--sage);
  color: var(--plum);
  font-weight: 720;
  text-align: center;
}

.za-plan-wide { grid-column: 1 / -1; min-height: 96px; }

#start-title,
#path-title,
#roles-title,
#offer-title,
#change-title,
#za-faq-title,
#next-title,
#after-title { max-width: 16em; }

.za-prep,
.za-offer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 28px;
}

.za-prep article,
.za-offer-grid article {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.za-prep h3,
.za-offer h3,
.za-stages h3,
.za-after h3 { font-size: 1.15rem; }

.za-prep p,
.za-offer p,
.za-stages p,
.za-options,
.za-after-cards p { margin-top: 6px; color: var(--muted); font-size: 16.5px; }

.za-prep .icon-bubble,
.za-offer .icon-bubble,
.za-out .icon-bubble { width: 52px; height: 52px; flex: none; }

.za-prep svg,
.za-offer svg,
.za-out svg { width: 24px; height: 24px; }

.za-note { margin-top: 16px; max-width: 78ch; color: var(--muted); font-size: 16px; }

.za-stages {
  display: grid;
  gap: 12px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.za-stages li {
  display: grid;
  grid-template-columns: 52px minmax(0, 1.2fr) minmax(220px, 0.8fr);
  gap: 16px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.za-num {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--sage);
  font-weight: 720;
}

.za-stages h3,
.za-stages p { margin: 0; }

.za-out {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 0;
  padding: 12px;
  border-radius: 12px;
  background: #e7f0c4;
  color: var(--plum);
}

.za-out .icon-bubble { background: #fff; }

.za-callout {
  margin-top: 16px;
  padding: 16px 18px;
  border-radius: 16px;
  background: #f3efe8;
  color: var(--muted);
}

.za-roles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 16px;
  margin-top: 28px;
}

.za-role-head {
  padding: 14px 18px;
  border-radius: 16px 16px 0 0;
  background: var(--aubergine);
  color: var(--ivory);
  font-weight: 720;
}

.za-roles > p {
  margin: 0;
  padding: 14px 18px;
  border: 1px solid var(--line);
  border-top: 0;
  background: #fff;
  color: var(--plum);
}

.za-roles > p:nth-last-child(-n + 2) { border-radius: 0 0 16px 16px; }

.za-who { display: none; }

.za-offer.section { padding-top: 12px; }

.za-offer-panel { padding: 40px 40px 24px; background: #e7f0c4; }

.za-offer .lede,
.za-offer .za-note { color: #3e3944; }

.za-offer .icon-bubble { background: var(--ivory); }

.za-change h2 { max-width: 12em; }

.za-options {
  display: grid;
  gap: 14px;
  margin-top: 20px;
  padding: 0;
  list-style: none;
}

.za-options li { color: var(--muted); }

.za-options strong { display: block; color: var(--plum); }

.za-branch {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.za-node,
.za-exits span {
  display: grid;
  place-items: center;
  min-height: 64px;
  padding: 12px 16px;
  border-radius: 14px;
  background: var(--sage);
  color: var(--plum);
  font-weight: 720;
  text-align: center;
}

.za-node { width: min(100%, 240px); }

.za-node-dark { background: var(--aubergine); color: var(--ivory); }

.za-stem,
.za-fork { width: 2px; height: 16px; background: var(--aubergine); }

.za-exits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
}

.za-after .za-note { color: rgba(246, 244, 239, 0.86); }

.za-after-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.za-after-cards article {
  padding: 18px;
  border-radius: 16px;
  background: var(--sage);
  color: var(--plum);
}

.za-after-cards h3,
.za-after-cards p,
.za-after-cards .link-arrow { color: var(--plum); }

.za-after-cards .link-arrow { margin-top: 12px; }

.za-after .za-note {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(246, 244, 239, 0.22);
}

.za-faq .faq-list { display: grid; gap: 12px; margin-top: 28px; border-top: 0; }

.za-faq .faq-item {
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.za-faq .faq-item h3 { font-size: inherit; font-weight: inherit; }

.za-faq .faq-item button { min-height: 68px; font-size: 1.08rem; }

.za-close .lede { margin-top: 12px; }

.za-close .za-note { margin-top: 12px; }

#ablauf { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .za-hero-grid,
  .za-change,
  .za-close-row,
  .za-after-grid,
  .za-prep,
  .za-offer-grid,
  .za-stages li,
  .za-roles,
  .za-after-cards,
  .za-exits { grid-template-columns: 1fr; }

  .za-role-head { display: none; }

  .za-who {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .za-roles > p {
    margin-top: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
  }

  .za-hero-panel,
  .za-offer-panel,
  .za-after-panel { padding: 28px 20px; }

  .za-figure figcaption { text-align: left; }
}

@media (max-width: 640px) {
  .za-hero h1 span { display: inline; }
  .za-hero h1 span::after { content: " "; }
}

/* Über BoTrust */
.ub-hero { padding: 28px 0 24px; }

.ub-hero-grid,
.ub-view,
.ub-fit-grid,
.ub-brand,
.ub-close-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.75fr);
  gap: 36px 48px;
  align-items: center;
}

.ub-hero h1 {
  max-width: none;
  font-size: clamp(2.4rem, 4vw, 3.55rem);
}

.ub-hero h1 span,
.ub-brand h2 span { display: block; }

.ub-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 28px;
}

.ub-cluster { margin: 0; }

.ub-cluster img,
.ub-brand-cluster {
  display: block;
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: contain;
}

.ub-view { align-items: start; }

#view-title,
#principles-title,
#who-title,
#fit-title,
#next-title { max-width: 16em; }

.ub-view .lede + .lede { margin-top: 16px; }

.ub-line {
  margin-top: 28px;
  max-width: 18em;
  color: var(--aubergine);
  font-size: clamp(1.35rem, 2vw, 1.7rem);
  font-weight: 720;
  line-height: 1.25;
}

.ub-stack {
  display: grid;
  gap: 28px;
  margin: 12px 0 0;
  padding: 8px 0 8px 28px;
  list-style: none;
  border-left: 2px solid var(--sage);
}

.ub-stack li {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  color: var(--plum);
  font-weight: 680;
}

.ub-shape {
  display: block;
  width: 72px;
  height: 72px;
}

.ub-sphere { border-radius: 50%; background: var(--sage); }

.ub-cube { border-radius: 10px; background: var(--aubergine); }

.ub-gem {
  background: #e7f0c4;
  clip-path: polygon(50% 0, 100% 38%, 82% 100%, 18% 100%, 0 38%);
}

.ub-principles {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.ub-principles li {
  display: grid;
  grid-template-columns: minmax(220px, 0.42fr) minmax(0, 1fr);
  gap: 18px 40px;
  align-items: start;
  padding: 26px 0;
  border-top: 1px solid var(--line);
}

.ub-principles li:last-child { border-bottom: 1px solid var(--line); }

.ub-name {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.ub-num {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  color: var(--plum);
  font-weight: 720;
}

.ub-principles h3 {
  margin: 8px 0 0;
  max-width: 11em;
  font-size: 1.35rem;
}

.ub-principles p,
.ub-who p,
.ub-principle-foot p,
.ub-note,
.ub-brand p,
.ub-close-action p { margin: 0; color: var(--muted); font-size: 18px; line-height: 1.55; }

.ub-principle-foot {
  display: flex;
  justify-content: space-between;
  gap: 24px 40px;
  align-items: center;
  margin-top: 22px;
}

.ub-principle-foot p { max-width: 36em; }

.ub-brand-wrap { padding: 12px 0 28px; }

.ub-brand {
  padding: 48px 44px;
  border-radius: 24px;
  background: var(--aubergine);
  color: var(--ivory);
}

.ub-brand h2,
.ub-brand .lede,
.ub-brand p { color: var(--ivory); }

.ub-brand h2 {
  max-width: none;
  font-size: clamp(2rem, 2.8vw, 2.65rem);
}

.ub-brand .eyebrow { color: rgba(246, 244, 239, 0.72); }

.ub-brand .lede { color: rgba(246, 244, 239, 0.92); }

.ub-brand p + p { margin-top: 16px; color: rgba(246, 244, 239, 0.86); }

.ub-brand-art {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin: 0;
}

.ub-brand-cluster { max-height: 280px; }

.ub-brand-logo {
  width: min(100%, 240px);
  height: auto;
  filter: brightness(0) invert(1);
}

.ub-who {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 32px;
  margin-top: 36px;
}

.ub-who svg { width: 88px; height: 68px; color: var(--plum); }

.ub-who h3 { margin-top: 16px; font-size: 1.25rem; }

.ub-who p { margin-top: 8px; }

.ub-note { margin-top: 28px; max-width: 78ch; }

.ub-fit { border-top: 1px solid var(--line); }

.ub-fit .link-arrow { margin-top: 22px; }

.ub-pile {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.ub-pile .ub-shape { width: 88px; height: 88px; }

.ub-close { padding: 8px 0 72px; }

.ub-close-panel {
  padding: 36px 40px;
  border-radius: 24px;
  background: #e7f0c4;
}

.ub-close-action {
  display: grid;
  justify-items: start;
  gap: 14px;
}

#haltung { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .ub-hero-grid,
  .ub-view,
  .ub-fit-grid,
  .ub-brand,
  .ub-close-panel,
  .ub-principles li,
  .ub-who,
  .ub-principle-foot { grid-template-columns: 1fr; }

  .ub-principle-foot { display: grid; }

  .ub-brand,
  .ub-close-panel { padding: 28px 20px; }

  .ub-cluster img { max-height: 320px; }
}

@media (max-width: 640px) {
  .ub-hero h1 { font-size: 2.4rem; }
}

/* Kontakt */
.kt-intro { padding: 28px 0 8px; }

.kt-intro h1 {
  max-width: 16em;
  font-size: clamp(2.4rem, 3.8vw, 3.5rem);
}

.kt-intro .lede { max-width: 38em; }

.kt-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(240px, 0.72fr);
  gap: 40px 48px;
  align-items: start;
}

.kt-main h2,
.kt-help h2,
#next-title { max-width: none; }

.kt-required-note,
.kt-warning,
.kt-privacy,
.kt-after,
.kt-aside p,
.kt-hint,
.kt-steps p,
.kt-qa p {
  color: var(--muted);
  font-size: 16.5px;
  line-height: 1.5;
}

.kt-required-note { margin: 8px 0 0; }

.kt-summary {
  margin-top: 20px;
  padding: 16px 18px;
  border: 1px solid #e7c4c4;
  border-radius: 16px;
  background: #fdf6f6;
  color: #6d2424;
}

.kt-summary p { margin: 0; }

.kt-summary p + p { margin-top: 6px; }

.kt-summary ul { margin: 10px 0 0; padding-left: 1.2em; }

.kt-summary a { color: #a73535; }

.kt-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 20px;
  margin-top: 22px;
}

.kt-field:nth-child(n + 5) { grid-column: 1 / -1; }

.kt-field label {
  display: block;
  margin-bottom: 8px;
  font-weight: 680;
}

.kt-star { color: var(--aubergine); }

.kt-field input,
.kt-field select,
.kt-field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--plum);
  font: inherit;
  font-size: 16px;
}

.kt-field input,
.kt-field select { min-height: 52px; padding: 12px 14px; }

.kt-field textarea {
  min-height: 176px;
  padding: 14px;
  resize: vertical;
}

.kt-field.is-invalid input,
.kt-field.is-invalid select,
.kt-field.is-invalid textarea { border-color: #a73535; }

.kt-hint,
.kt-error { margin: 8px 0 0; }

.kt-error { color: #a73535; }

.kt-hp {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.kt-warning,
.kt-privacy { margin-top: 16px; }

.kt-form .btn { margin-top: 20px; }

.kt-status:empty { display: none; }

.kt-status { margin-top: 12px; }

.kt-after { margin-top: 12px; max-width: 46em; }

.kt-aside {
  display: grid;
  gap: 28px;
  padding-left: 32px;
  border-left: 1px solid var(--line);
}

.kt-aside h2 { font-size: 1.7rem; }

.kt-mail {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  color: var(--aubergine);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.kt-mail .icon-bubble { width: 48px; height: 48px; flex: none; background: var(--sage); }

.kt-mail svg { width: 22px; height: 22px; }

.kt-aside-note { margin-top: 12px; }

.kt-thanks {
  padding: 36px 32px;
  border-radius: 24px;
  background: #e7f0c4;
}

.kt-thanks h2 span { display: block; }

.kt-thanks p { margin-top: 16px; color: var(--muted); font-size: 1.15rem; }

.kt-thanks-links { display: flex; flex-wrap: wrap; gap: 16px 28px; }

.kt-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin: 28px 0 22px;
  padding: 0;
  list-style: none;
}

.kt-steps li { display: flex; gap: 14px; align-items: flex-start; }

.kt-num {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 50%;
  background: var(--sage);
  font-weight: 720;
}

.kt-steps h3,
.kt-qa h3 { margin: 0; font-size: 1.2rem; }

.kt-steps p,
.kt-qa p { margin-top: 8px; }

.kt-qa {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 24px;
}

.kt-qa article {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

#projektanfrage,
#form-errors,
#form-thanks { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .kt-layout,
  .kt-fields,
  .kt-steps,
  .kt-qa { grid-template-columns: 1fr; }

  .kt-field:nth-child(n + 5) { grid-column: auto; }

  .kt-aside {
    padding: 8px 0 0;
    border-left: 0;
    border-top: 1px solid var(--line);
  }
}

@media (max-width: 640px) {
  .kt-intro h1 { font-size: 2.4rem; }
}

/* FAQ */
.fq-intro { padding: 28px 0 8px; }

.fq-intro h1 {
  max-width: none;
  font-size: clamp(2.4rem, 3.9vw, 3.5rem);
}

.fq-intro .lede { max-width: 40em; }

.fq-search { max-width: 820px; margin-top: 28px; }

.fq-search label { display: block; margin-bottom: 8px; font-weight: 680; }

.fq-search-row { position: relative; }

.fq-search input {
  width: 100%;
  min-height: 52px;
  padding: 12px 48px 12px 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2359535e' stroke-width='1.8'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='m16 16 4 4' stroke-linecap='round'/%3E%3C/svg%3E") 14px 50% / 20px no-repeat;
  color: var(--plum);
  font: inherit;
  font-size: 16px;
}

.fq-search-row button {
  position: absolute;
  top: 50%;
  right: 8px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  transform: translateY(-50%);
  border-radius: 50%;
  color: var(--plum);
  font-size: 1.3rem;
  line-height: 1;
}

.fq-search-row button[hidden] { display: none; }

.fq-hint,
.fq-count { margin: 8px 0 0; color: var(--muted); font-size: 15px; }

.fq-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  margin-top: 12px;
}

.fq-meta[hidden] { display: none; }

.fq-reset {
  color: var(--aubergine);
  font-weight: 680;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.fq-topics[hidden],
.fq-group[hidden],
.fq-empty[hidden],
.fq-close[hidden],
.fq-page .faq-item[hidden] { display: none; }

.fq-topics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 28px;
  margin-top: 26px;
}

.fq-topics a {
  color: var(--aubergine);
  font-weight: 680;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.fq-empty { margin-top: 36px; }

.fq-empty h2 { max-width: 16em; }

.fq-empty p { max-width: 42em; color: var(--muted); font-size: 1.1rem; }

.fq-empty-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 22px;
}

.fq-group-grid {
  display: grid;
  grid-template-columns: minmax(180px, 0.32fr) minmax(0, 1fr);
  gap: 20px 36px;
  align-items: start;
}

.fq-group h2 {
  max-width: 10em;
  font-size: clamp(1.7rem, 2.2vw, 2.15rem);
}

.fq-page .faq-list {
  display: grid;
  gap: 12px;
  border-top: 0;
}

.fq-page .faq-item {
  border: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  padding: 0 18px;
  scroll-margin-top: calc(var(--header) + 16px);
}

.fq-page .faq-item button {
  min-height: 64px;
  padding: 16px 0;
  font-size: 1.35rem;
}

.fq-page .faq-panel p {
  max-width: 68ch;
  font-size: 18px;
}

.fq-page .faq-panel .link-arrow { margin: 0 0 18px; }

.fq-mark { background: #e7f0c4; color: inherit; }

.fq-close { padding-top: 12px; }

.fq-close-panel {
  padding: 36px 40px;
  border-radius: 24px;
  background: #e7f0c4;
}

.fq-close h2 { max-width: 16em; }

.fq-close .lede { max-width: 40em; }

.fq-close .btn { margin-top: 22px; }

.fq-close .fq-hint { margin-top: 14px; }

.fq-group,
#fq-topics a { scroll-margin-top: calc(var(--header) + 16px); }

@media (max-width: 980px) {
  .fq-topics,
  .fq-group-grid { grid-template-columns: 1fr 1fr; }

  .fq-group-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .fq-intro h1 { font-size: 2.4rem; }
  .fq-topics { grid-template-columns: 1fr; }
}

/* Impressum */
.im-draft {
  margin: 0;
  background: var(--sage);
  color: var(--plum);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1.4;
}

.im-draft .wrap {
  display: block;
  padding: 12px 0;
}

.im-intro {
  padding: 52px 0 4px;
}

.im-page h1 {
  max-width: none;
  font-size: clamp(2.5rem, 4.45vw, 4rem);
}

.im-intro .lede {
  max-width: 34em;
  margin-top: 18px;
  line-height: 1.6;
}

.im-col {
  max-width: 800px;
  margin-left: max(24px, calc((100% - var(--wrap)) / 2));
  margin-right: 24px;
  padding: 40px 0 88px;
}

@media (min-width: 1280px) {
  .im-col {
    margin-left: max(64px, calc((100% - var(--wrap)) / 2));
    margin-right: 64px;
  }
}

@media (min-width: 1440px) {
  .im-col {
    margin-left: max(96px, calc((100% - var(--wrap)) / 2));
    margin-right: 96px;
  }
}

.im-page h2 {
  max-width: none;
  margin: 0 0 20px;
  font-size: clamp(1.5625rem, 2.1vw, 2rem);
  letter-spacing: -0.02em;
}

.im-block + .im-block {
  margin-top: 64px;
}

.im-address {
  font-style: normal;
}

.im-address p,
.im-line,
.im-brand,
.im-rep,
.im-privacy {
  max-width: 68ch;
  font-size: 18px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.im-address p {
  margin: 0;
}

.im-name {
  margin-bottom: 8px;
  font-size: 1.2rem;
  font-weight: 680;
  line-height: 1.4;
}

.im-brand,
.im-rep {
  margin: 24px 0 0;
}

.im-rep strong,
.im-line strong {
  display: block;
  margin-bottom: 2px;
  font-weight: 720;
}

.im-line {
  margin: 0 0 20px;
}

.im-privacy {
  margin: 8px 0 0;
}

.im-page a {
  color: var(--aubergine);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.im-mail {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.site-footer a[aria-current="page"] {
  color: var(--plum);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 640px) {
  .im-intro { padding-top: 36px; }
  .im-col { padding-bottom: 64px; }
  .im-address p,
  .im-line,
  .im-brand,
  .im-rep,
  .im-privacy { font-size: 17px; }
}

@media print {
  body:has(.im-page) {
    background: #fff;
    color: #111;
  }

  body:has(.im-page) .im-draft {
    background: #fff;
    color: #111;
    border-bottom: 1px solid #111;
  }

  body:has(.im-page) .im-page,
  body:has(.im-page) .im-page a,
  body:has(.im-page) .site-footer,
  body:has(.im-page) .site-footer a {
    color: #111;
  }

  body:has(.im-page) .im-page a[href^="/"]::after {
    content: " (https://botrust.de" attr(href) ")";
  }
}

/* Datenschutz */
.ds-draft {
  margin: 0;
  background: var(--sage);
  color: var(--plum);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1.4;
}

.ds-draft .wrap {
  display: block;
  padding: 12px 0;
}

.ds-intro {
  padding-top: 52px;
}

.ds-page h1 {
  max-width: none;
  font-size: clamp(2.375rem, 4vw, 4rem);
}

.ds-intro .lede {
  max-width: none;
  margin-top: 18px;
  line-height: 1.6;
}

.ds-stand {
  margin: 22px 0 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.6;
}

.ds-col {
  max-width: 800px;
  margin-left: max(24px, calc((100% - var(--wrap)) / 2));
  margin-right: 24px;
}

@media (min-width: 1280px) {
  .ds-col {
    margin-left: max(64px, calc((100% - var(--wrap)) / 2));
    margin-right: 64px;
  }
}

@media (min-width: 1440px) {
  .ds-col {
    margin-left: max(96px, calc((100% - var(--wrap)) / 2));
    margin-right: 96px;
  }
}

.ds-toc {
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(4, auto);
  gap: 4px 32px;
  margin-top: 28px;
  padding: 22px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.ds-toc a {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--aubergine);
  font-size: 17px;
  line-height: 1.35;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ds-page {
  padding-bottom: 72px;
}

.ds-page h2,
.ds-page h3 {
  max-width: none;
  letter-spacing: -0.02em;
}

.ds-page h2 {
  margin: 0 0 16px;
  font-size: clamp(1.875rem, 2.2vw, 2.125rem);
}

.ds-page h3 {
  margin: 36px 0 12px;
  font-size: clamp(1.4375rem, 1.7vw, 1.625rem);
}

.ds-block {
  margin-top: 48px;
}

.ds-block + .ds-block {
  margin-top: 28px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}

.ds-page p {
  max-width: 68ch;
  margin: 0;
  font-size: 18px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.ds-page p + p {
  margin-top: 16px;
}

.ds-kicker {
  display: block;
  margin-top: 22px;
  margin-bottom: 6px;
  font-weight: 720;
}

.ds-address {
  margin-top: 16px;
  font-style: normal;
}

.ds-address p {
  margin: 0;
}

.ds-open {
  color: var(--aubergine);
}

.ds-mail {
  margin-top: 22px;
}

.ds-mail strong {
  font-weight: 720;
}

.ds-page a {
  color: var(--aubergine);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ds-mail a,
.ds-page h3 + p a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.ds-right strong {
  display: block;
  margin-bottom: 4px;
  color: var(--aubergine);
  font-weight: 720;
}

.ds-objection {
  margin-top: 32px;
  padding: 4px 0 4px 22px;
  border-left: 3px solid var(--aubergine);
}

.ds-objection h3 {
  margin-top: 0;
}

.ds-objection p + p {
  margin-top: 16px;
}

.ds-top {
  margin-top: 28px;
}

.ds-top a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

#seitenanfang,
.ds-block {
  scroll-margin-top: calc(var(--header) + 12px);
}

@media (max-width: 640px) {
  .ds-intro { padding-top: 36px; }
  .ds-toc {
    grid-auto-flow: row;
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .ds-page p,
  .ds-stand { font-size: 17px; }
}

@media print {
  body:has(.ds-page) {
    background: #fff;
    color: #111;
  }

  body:has(.ds-page) .ds-draft {
    background: #fff;
    color: #111;
    border-bottom: 1px solid #111;
  }

  body:has(.ds-page) .ds-page,
  body:has(.ds-page) .ds-page a,
  body:has(.ds-page) .ds-open,
  body:has(.ds-page) .site-footer,
  body:has(.ds-page) .site-footer a {
    color: #111;
  }

  body:has(.ds-page) .ds-page a[href^="#"]::after {
    content: "";
  }
}

/* Danke */
.dk-col {
  max-width: 840px;
  margin-left: max(24px, calc((100% - var(--wrap)) / 2));
  margin-right: 24px;
  padding: 56px 0 88px;
}

@media (min-width: 1280px) {
  .dk-col {
    margin-left: max(64px, calc((100% - var(--wrap)) / 2));
    margin-right: 64px;
  }
}

@media (min-width: 1440px) {
  .dk-col {
    margin-left: max(96px, calc((100% - var(--wrap)) / 2));
    margin-right: 96px;
  }
}

.dk-status {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 22px;
}

.dk-status .eyebrow {
  margin: 0;
}

.dk-mark {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--sage);
  color: var(--plum);
  animation: dk-in 220ms ease;
}

@keyframes dk-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.dk-page h1 {
  max-width: 11em;
  font-size: clamp(2.375rem, 4.2vw, 3.75rem);
}

.dk-h1-lead {
  display: block;
}

.dk-page .lede {
  max-width: 34em;
  margin-top: 22px;
  font-size: 20px;
  line-height: 1.55;
}

.dk-relief,
.dk-ways p,
.dk-extra p,
.dk-page .dk-col > p {
  max-width: 40em;
  font-size: 18px;
  line-height: 1.6;
}

.dk-relief {
  margin-top: 14px;
}

.dk-next {
  margin-top: 72px;
}

.dk-page h2 {
  max-width: none;
  margin: 0;
  font-size: clamp(2rem, 2.4vw, 2.25rem);
}

.dk-steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px 48px;
  margin-top: 22px;
}

.dk-step {
  border-top: 1px solid var(--line);
  padding-top: 16px;
}

.dk-num {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 15px;
}

.dk-step-title {
  margin: 0 0 8px;
  font-size: 1.25rem;
  font-weight: 720;
  line-height: 1.3;
}

.dk-step p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.55;
}

.dk-ways,
.dk-page .btn {
  margin-top: 28px;
}

.dk-ways {
  margin-top: 64px;
}

.dk-page .btn {
  min-height: 48px;
  margin-top: 22px;
}

.dk-quiet {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 14px;
  color: var(--aubergine);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.dk-extra {
  margin-top: 56px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}

.dk-extra-title {
  margin: 0 0 8px;
  font-weight: 720;
}

.dk-page a:not(.btn) {
  color: var(--aubergine);
}

.dk-ways .dk-quiet,
.dk-page .dk-col > .dk-quiet {
  display: flex;
  width: fit-content;
}

@media (max-width: 720px) {
  .dk-col { padding-top: 36px; }
  .dk-steps { grid-template-columns: 1fr; }
  .dk-page .lede,
  .dk-relief,
  .dk-ways p,
  .dk-extra p,
  .dk-step p:last-child { font-size: 17px; }
  .dk-next { margin-top: 56px; }
}

@media (prefers-reduced-motion: reduce) {
  .dk-mark { animation: none; }
}

@media print {
  body:has(.dk-page) {
    background: #fff;
    color: #111;
  }

  body:has(.dk-page) .dk-mark {
    animation: none;
    background: #fff;
    border: 1px solid #111;
  }
}
