/* Button-System Luisa Herrmann, nach dem Vorbild choroo.webflow.io:
   kompakte Pille, Text rollt beim Hover nach oben, der Pfeil fliegt raus und ein neuer kommt rein,
   die Fläche wechselt die Farbe. Klassen setzt lh-buttons.js. */
.lh-btn-roll{--b-bg:#D14B26;--b-tx:#FBFAF8;--b-rand:#D14B26;--b-bg-h:#342839;--b-tx-h:#FBFAF8;--b-rand-h:#342839}
.lh-btn-roll.lh-btn--aufdunkel{--b-bg-h:#FBFAF8;--b-tx-h:#342839;--b-rand-h:#FBFAF8}
.lh-panel .lh-btn-roll:not(.lh-btn--outline):not(.lh-btn--dunkel),.lh-dunkel .lh-btn-roll:not(.lh-btn--outline):not(.lh-btn--dunkel){--b-bg-h:#FBFAF8;--b-tx-h:#342839;--b-rand-h:#FBFAF8}
.lh-btn-roll.lh-btn--dunkel{--b-bg:#342839;--b-tx:#FBFAF8;--b-rand:#342839;--b-bg-h:#D14B26;--b-tx-h:#FBFAF8;--b-rand-h:#D14B26}
.lh-btn-roll.lh-btn--outline{--b-bg:transparent;--b-tx:#342839;--b-rand:#342839;--b-bg-h:#342839;--b-tx-h:#FBFAF8;--b-rand-h:#342839}
.lh-btn-roll.lh-btn--outline.lh-btn--hell{--b-tx:#FBFAF8;--b-rand:rgba(251,250,248,.75);--b-bg-h:#FBFAF8;--b-tx-h:#342839;--b-rand-h:#FBFAF8}

html body .lh-btn-roll.lh-btn-roll,
html body #page-container .lh-btn-roll.lh-btn-roll.lh-btn-roll,
html body #page-container header#main-header #et-top-navigation a.lh-btn-roll.lh-btn-roll{
  display:inline-flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:10px!important;
  width:auto!important;height:auto!important;min-height:52px!important;margin:0!important;padding:15px 26px!important;
  border:0!important;border-radius:100px!important;box-shadow:inset 0 0 0 1.5px var(--b-rand)!important;
  background:var(--b-bg)!important;background-color:var(--b-bg)!important;color:var(--b-tx)!important;
  font-family:'Bricolage Grotesk',sans-serif!important;font-size:16px!important;font-weight:600!important;line-height:1.2!important;letter-spacing:-.005em!important;
  text-transform:none!important;text-decoration:none!important;white-space:nowrap;cursor:pointer;-webkit-appearance:none;appearance:none;
  transition:background-color .5s ease,color .5s ease,box-shadow .5s ease!important}
html body .lh-btn-roll.lh-btn-roll::before,html body .lh-btn-roll.lh-btn-roll::after{display:none!important;content:none!important}
html body .lh-btn-roll.lh-btn-roll:hover,html body .lh-btn-roll.lh-btn-roll:focus-visible,
html body #page-container .lh-btn-roll.lh-btn-roll.lh-btn-roll:hover,html body #page-container .lh-btn-roll.lh-btn-roll.lh-btn-roll:focus-visible,
html body #page-container header#main-header #et-top-navigation a.lh-btn-roll.lh-btn-roll:hover{
  background:var(--b-bg-h)!important;background-color:var(--b-bg-h)!important;color:var(--b-tx-h)!important;box-shadow:inset 0 0 0 1.5px var(--b-rand-h)!important}
html body .lh-btn-roll.lh-btn-roll:focus-visible{outline:2px solid #D14B26;outline-offset:3px}
html body #page-container header#main-header #et-top-navigation a.lh-btn-roll.lh-btn-roll{min-height:46px!important;padding:12px 22px!important;font-size:15px!important}

.lh-btxt{position:relative;display:block;overflow:hidden}
.lh-btxt>span{display:block;transition:transform .5s cubic-bezier(.65,0,.35,1)}
.lh-btxt>span+span{position:absolute;left:0;right:0;top:0;transform:translateY(110%)}
.lh-btn-roll:hover .lh-btxt>span:first-child,.lh-btn-roll:focus-visible .lh-btxt>span:first-child{transform:translateY(-110%)}
.lh-btn-roll:hover .lh-btxt>span+span,.lh-btn-roll:focus-visible .lh-btxt>span+span{transform:translateY(0)}

.lh-bpf{position:relative;display:block;flex:0 0 auto;width:14px;height:14px;overflow:hidden}
.lh-bpf svg{position:absolute;left:0;top:0;width:14px;height:14px;transition:transform .5s cubic-bezier(.65,0,.35,1)}
.lh-bpf svg+svg{transform:translate(-100%,100%)}
.lh-btn-roll:hover .lh-bpf svg:first-child,.lh-btn-roll:focus-visible .lh-bpf svg:first-child{transform:translate(100%,-100%)}
.lh-btn-roll:hover .lh-bpf svg+svg,.lh-btn-roll:focus-visible .lh-bpf svg+svg{transform:translate(0,0)}

@media (max-width:767px){
  html body .lh-btn-roll.lh-btn-roll,html body #page-container .lh-btn-roll.lh-btn-roll.lh-btn-roll{max-width:100%;white-space:normal;text-align:left;padding:14px 22px!important;min-height:50px!important;font-size:15.5px!important}
  .et-l--footer .et_pb_row{flex-wrap:wrap!important}
  .et-l--footer .et_pb_row>.et_pb_column{width:100%!important;max-width:100%!important;flex:0 0 100%!important;margin-right:0!important}
}
@media (prefers-reduced-motion:reduce){.lh-btxt>span,.lh-bpf svg{transition:none!important}}

/* Eyebrows als Pille (Blüte + Text), seitenweit. Klassen setzt lh-buttons.js */
.lh-eyebrow.lh-eyebrow{display:inline-flex!important;width:fit-content!important;max-width:100%;align-items:center;gap:8px!important;padding:7px 16px 7px 11px!important;border-radius:99px;background:rgba(52,40,57,.07);margin-top:0!important;margin-bottom:0!important;line-height:1.3!important}
.lh-eyebrow.lh-eyebrow--hell{background:rgba(251,250,248,.12)}
.lh-eyebrow.lh-eyebrow--mitte{margin-left:auto!important;margin-right:auto!important}
.lh-eyebrow img{width:15px!important;height:15px!important;margin:0!important;flex:0 0 auto}
.lh-eyebrow .dipi-td-content{margin:0!important;padding:0!important;line-height:1.3!important;width:auto!important;flex:0 1 auto!important}
.lh-eyebrow .dipi-td-decoration{margin:0!important;width:auto!important;flex:0 0 auto!important}
.lh-eyebrow .dipi-td-decoration:empty,.lh-eyebrow .dipi-td-second{display:none!important}


/* ---------- Blogkarten (Loop-Gruppe .lh-blogkarte), seitenweit ---------- */
.lh-karte{position:relative;overflow:hidden;isolation:isolate;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease}
.lh-karte::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .4s ease;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),rgba(209,75,38,.13),rgba(205,194,218,.18) 45%,transparent 70%)}
.lh-karte:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(52,40,57,.35)}
.lh-karte:hover::before{opacity:1}
.lh-blogkarte{cursor:pointer}
.lh-blogkarte .lh-blog-kat p{display:inline-block;font-size:13px!important;line-height:1!important;color:#342839!important;background:#FBFAF8;padding:8px 12px!important;border-radius:100px}
.lh-blogkarte .lh-blog-kat a{color:inherit!important;pointer-events:none}
.lh-blogkarte .lh-blog-bild img{object-fit:cover;width:100%;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.lh-blogkarte .lh-blog-bild .et_pb_image_wrap{overflow:hidden;border-radius:var(--gvid-olg444nmh6,16px)}
.lh-blogkarte:hover .lh-blog-bild img{transform:scale(1.06)}
.lh-blogkarte .lh-blog-datum p{font-size:13px!important;color:#675A62!important;letter-spacing:.02em}
.lh-blogkarte .lh-blog-auszug p{font-size:15px!important;line-height:1.55!important;color:#463C49!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lh-blogkarte .lh-blog-titel h3{transition:color .3s ease}
.lh-blogkarte:hover .lh-blog-titel h3{color:#A23B17!important}
.lh-blogkarte .lh-blog-oben{flex-direction:column!important;position:relative}
.lh-blogkarte .lh-blog-bild{width:100%!important;max-width:100%!important;order:-1}
.lh-blogkarte .lh-blog-bild img{aspect-ratio:16/10!important}
.lh-blogkarte .lh-blog-kat{position:absolute!important;top:14px;left:14px;z-index:2;width:auto!important}
@media (hover:none),(prefers-reduced-motion:reduce){.lh-karte:hover{transform:none}}

/* ---------- FAQ: Zwischenüberschriften zwischen mehreren Accordions ---------- */
.lh-faq-gruppe h3{font-size:clamp(20px,1.8vw,24px)!important;line-height:1.25!important;font-weight:500!important;color:#342839!important;margin:28px 0 4px!important;padding:0!important}
.et_pb_column>.lh-faq-gruppe:first-child h3{margin-top:0!important}

/* ---------- Hero: Avatare + Sterne unter dem Button (helle Heros) ---------- */
.et_pb_column:has(>.lh-hero-avatare){display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center;align-content:flex-start}
.et_pb_column:has(>.lh-hero-avatare)>*{flex:0 0 100%;max-width:100%}
.et_pb_column>.lh-hero-avatare.et_pb_image{flex:0 0 auto!important;width:fit-content!important;max-width:fit-content!important;margin:26px 12px 0 0!important;padding:0!important}
.lh-hero-avatare .et_pb_image_wrap{width:fit-content!important}
.lh-hero-avatare img{width:auto!important;max-height:36px}
.et_pb_column>.lh-hero-avatare+.lh-hero-sterne{flex:1 1 0!important;min-width:0!important;width:auto!important;margin:26px 0 0!important;padding:0!important}
.lh-hero-sterne p{font-size:14px!important;line-height:1.4!important;color:#463C49!important;margin:0!important;padding:0!important}
.lh-hero-sterne .lh-sterne{color:#E8A317;letter-spacing:1px;margin-right:6px}
html body #page-container .et_pb_column>.lh-hero-avatare.et_pb_image{width:fit-content!important;max-width:fit-content!important;flex:0 0 auto!important}
html body #page-container .lh-hero-avatare .et_pb_image_wrap,html body #page-container .lh-hero-avatare img{width:auto!important;max-height:36px}
html body #page-container .et_pb_column:has(>.lh-hero-avatare)>.et_pb_button_module_wrapper{text-align:left!important}
html body #page-container .et_pb_column:has(>.lh-hero-avatare){column-gap:12px!important}
html body #page-container .et_pb_column>.lh-hero-avatare.et_pb_image{margin-right:0!important}
html body #page-container .lh-hero-sterne--dunkel p{color:#E7E1EC!important}

/* ---------- Logoleiste: Luft zu angrenzenden Sektionen ---------- */
html body #page-container .lh-logos{padding:64px 0}
html body #page-container .et_pb_section:has(h1) .lh-logos{padding:40px 0 64px}
html body #page-container .et_pb_section:has(.lh-logos):not(:has(h1)){padding-top:0!important;padding-bottom:0!important}
html body #page-container .et_pb_section:has(h1):has(.lh-logos){padding-bottom:0!important}
@media (max-width:767px){html body #page-container .lh-logos{padding:44px 0}html body #page-container .et_pb_section:has(h1) .lh-logos{padding:28px 0 44px}}
/* Avatare + Sterne: mittig und enger */
html body #page-container .et_pb_column>.lh-hero-avatare,html body #page-container .et_pb_column>.lh-hero-avatare+.lh-hero-sterne{align-self:center!important}
html body #page-container .et_pb_column:has(>.lh-hero-avatare){column-gap:0!important}
html body #page-container .et_pb_column>.lh-hero-avatare+.lh-hero-sterne{margin-left:-6px!important}
@media (max-width:480px){html body #page-container .lh-hero-avatare img,html body #page-container .lh-hero-avatare .et_pb_image_wrap{max-height:30px!important}html body #page-container .lh-hero-sterne p{font-size:12.5px!important;white-space:nowrap}html body #page-container .lh-hero-sterne .lh-sterne{letter-spacing:0;margin-right:4px}html body #page-container .et_pb_column>.lh-hero-avatare+.lh-hero-sterne{margin-left:-4px!important}}
@media (max-width:360px){html body #page-container .lh-hero-sterne p{white-space:normal}}

/* ---------- USP-Raster (3 Zellen, Vorbild Zahnarztseite), seitenweit ---------- */
.et_pb_section.lh-panel,.et_pb_section.lh-usp-panel{max-height:none!important;--lh-rand:clamp(8px,1vw,16px);width:calc(100% - 2 * var(--lh-rand))!important;max-width:none!important;margin-left:var(--lh-rand)!important;margin-right:var(--lh-rand)!important;border-radius:var(--gvid-olg444nmh6,16px)!important;overflow:hidden}
@media (min-width:768px){.lh-raster>.et_pb_column{flex:1 1 0!important;width:auto!important;max-width:none!important}}
@media (min-width:768px) and (max-width:980px){.lh-raster{flex-wrap:wrap!important}.lh-raster>.et_pb_column{flex:0 0 50%!important;max-width:50%!important}}
.lh-raster{border-top:1px solid rgba(52,40,57,.15)}
.lh-zelle{position:relative;overflow:hidden;isolation:isolate;border-right:1px solid rgba(52,40,57,.15);height:100%}
.lh-raster .et_pb_column:last-child .lh-zelle{border-right:0}
.lh-zelle::before{content:"";position:absolute;inset:0;z-index:-1;background:#342839;transform:translateY(101%);transition:transform .6s cubic-bezier(.65,0,.35,1)}
.lh-zelle::after{content:"";position:absolute;top:30px;right:26px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(52,40,57,.3);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23342839' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12L12 4M5.5 4H12v6.5'/%3E%3C/svg%3E") center/15px no-repeat;transition:transform .6s cubic-bezier(.65,0,.35,1),background-color .4s,border-color .4s}
.lh-zelle:hover::before{transform:translateY(0)}
.lh-zelle:hover::after{transform:rotate(45deg);background-color:#D14B26;border-color:#D14B26;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FBFAF8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12L12 4M5.5 4H12v6.5'/%3E%3C/svg%3E")}
html body #page-container .lh-zelle p{margin:0!important;padding:0!important}
html body #page-container .lh-zelle p.lh-nr{font-size:13px!important;letter-spacing:.08em;color:#A23B17!important;margin-bottom:56px!important;transition:color .4s}
html body #page-container .lh-zelle p.lh-titel{font-size:clamp(28px,2.6vw,40px)!important;line-height:1.05!important;letter-spacing:-.02em;color:#342839!important;margin-bottom:16px!important;transition:color .4s ease,transform .6s cubic-bezier(.65,0,.35,1)}
html body #page-container .lh-zelle p.lh-txt{font-size:15.5px!important;line-height:1.6!important;color:#675A62!important;transition:color .4s ease}
html body #page-container .lh-zelle:hover p.lh-titel{color:#FBFAF8!important;transform:translateX(6px)}
html body #page-container .lh-zelle:hover p.lh-txt{color:#CDC2DA!important}
html body #page-container .lh-zelle:hover p.lh-nr{color:#F0A487!important}
html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child,html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child .et_pb_text,html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child .et_pb_text *,html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child .dipi_divider{text-align:center!important}
html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child .et_pb_module,html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child .lh-eyebrow{margin-left:auto!important;margin-right:auto!important}
html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child .et_pb_text h2{max-width:20ch;margin:0 auto!important;color:#342839!important}
html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child>.et_pb_column,html body #page-container .et_pb_section:has(.lh-raster)>.et_pb_row:first-child>.et_pb_column>.et_pb_module{width:100%!important;max-width:100%!important;margin-right:0!important}
@media (max-width:980px){.lh-zelle{border-right:0!important;border-bottom:1px solid rgba(52,40,57,.15)}}
@media (max-width:767px){.lh-raster{flex-wrap:wrap!important}.lh-raster>.et_pb_column{width:100%!important;max-width:100%!important;flex:0 0 100%!important;padding:0!important}.lh-zelle{min-height:0!important;padding:28px 4px!important;height:auto!important}html body #page-container .lh-zelle p.lh-nr{margin-bottom:18px!important}html body #page-container .lh-zelle p.lh-titel{font-size:26px!important}.et_pb_section.lh-panel,.et_pb_section.lh-usp-panel{padding-top:44px!important;padding-bottom:44px!important}.et_pb_section.lh-panel .et_pb_row,.et_pb_section.lh-usp-panel .et_pb_row{width:calc(100% - 32px)!important}}
@media (prefers-reduced-motion:reduce){.lh-zelle::before{transition:none}}
html body #page-container .et_pb_section:has(.lh-raster){background-color:var(--gcid-849a0596-6799-469e-b6c6-b65b71fa5b34)!important}

/* ---------- USP-Raster dunkle Variante (Klasse lh-usp-dunkel an der Sektion) ---------- */
html body #page-container .et_pb_section.lh-usp-dunkel:has(.lh-raster){background-color:#342839!important}
html body #page-container .et_pb_section.lh-usp-dunkel:has(.lh-raster)>.et_pb_row:first-child .et_pb_text h2{color:#FBFAF8!important}
html body #page-container .lh-usp-dunkel .dipi_divider .dipi-divider-text,html body #page-container .lh-usp-dunkel .dipi-td-content,html body #page-container .lh-usp-dunkel .lh-eyebrow,html body #page-container .lh-usp-dunkel .lh-eyebrow *{color:#FBFAF8!important}
html body #page-container .lh-usp-dunkel .lh-eyebrow,html body #page-container .lh-usp-dunkel .dipi-divider-text-wrap{background-color:rgba(251,250,248,.12)!important}
html body #page-container .lh-usp-dunkel .lh-raster{border-top-color:rgba(251,250,248,.18)!important}
html body #page-container .lh-usp-dunkel .lh-zelle{border-right-color:rgba(251,250,248,.18)!important}
html body #page-container .lh-usp-dunkel .lh-zelle::before{background:#FBFAF8!important}
html body #page-container .lh-usp-dunkel .lh-zelle::after{border-color:rgba(251,250,248,.35)!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FBFAF8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12L12 4M5.5 4H12v6.5'/%3E%3C/svg%3E")!important}
html body #page-container .lh-usp-dunkel .lh-zelle:hover::after{background-color:#D14B26!important;border-color:#D14B26!important}
html body #page-container .lh-usp-dunkel .lh-zelle p.lh-nr{color:#CDC2DA!important}
html body #page-container .lh-usp-dunkel .lh-zelle p.lh-titel{color:#FBFAF8!important}
html body #page-container .lh-usp-dunkel .lh-zelle p.lh-txt{color:#CDC2DA!important}
html body #page-container .lh-usp-dunkel .lh-zelle:hover p.lh-nr{color:#A23B17!important}
html body #page-container .lh-usp-dunkel .lh-zelle:hover p.lh-titel{color:#342839!important}
html body #page-container .lh-usp-dunkel .lh-zelle:hover p.lh-txt{color:#463C49!important}
@media (max-width:980px){html body #page-container .lh-usp-dunkel .lh-zelle{border-bottom-color:rgba(251,250,248,.18)!important}}

/* ---------- USP-Zellen: Blüte statt Pfeil (nicht klickbar) ---------- */
html body #page-container .et_pb_section .lh-raster .lh-zelle::after,html body #page-container .et-l--post .et_pb_section:has(.lh-raster) .lh-raster .lh-zelle::after{border:0!important;border-radius:0!important;width:30px!important;height:30px!important;top:30px!important;right:28px!important;background:rgba(52,40,57,.3)!important;background-image:none!important;-webkit-mask:url("/wp-content/uploads/2026/07/zeichen-bluete.svg") center/contain no-repeat;mask:url("/wp-content/uploads/2026/07/zeichen-bluete.svg") center/contain no-repeat;transition:transform .7s cubic-bezier(.65,0,.35,1),background-color .4s!important}
html body #page-container .et_pb_section .lh-raster .lh-zelle:hover::after,html body #page-container .et-l--post .et_pb_section:has(.lh-raster) .lh-raster .lh-zelle:hover::after{transform:rotate(90deg) scale(1.12)!important;background:#D14B26!important;background-image:none!important}
html body #page-container .et_pb_section.lh-usp-dunkel .lh-raster .lh-zelle::after{background:rgba(251,250,248,.45)!important;background-image:none!important}
html body #page-container .et_pb_section.lh-usp-dunkel .lh-raster .lh-zelle:hover::after{background:#D14B26!important;background-image:none!important}
@media (prefers-reduced-motion:reduce){html body #page-container .lh-raster .lh-zelle:hover::after{transform:none!important}}
html body #page-container .et-l--post .et_pb_section.lh-usp-dunkel:has(.lh-raster) .lh-raster .lh-zelle::after{background:rgba(251,250,248,.45)!important;background-image:none!important}
html body #page-container .et-l--post .et_pb_section.lh-usp-dunkel:has(.lh-raster) .lh-raster .lh-zelle:hover::after{background:#D14B26!important}
