/* UPLOAD Bausteine — Grundlagen der Elementor-Startseite.
   Lädt nur auf markierten Seiten. Die Gestaltung selbst steht in Elementor
   (globale Klassen u-*); hier steht nur, was Elementor nicht abdeckt. */

html{scroll-behavior:smooth}

body.upload-bausteine{
  background:#fdeee8;color:#0b0b0b;
  font-family:"DM Sans",system-ui,sans-serif;font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
@media(max-width:900px){body.upload-bausteine{font-size:16.5px}}
body.upload-bausteine a{color:inherit}
body.upload-bausteine :is(h1,h2,h3,h4){overflow-wrap:break-word}
body.upload-bausteine ::selection{background:#f18a6e;color:#0b0b0b}

/* Sprungmarken halten Platz für die schwebende Kopfleiste frei. */
body.upload-bausteine section,
body.upload-bausteine header[id]{scroll-margin-top:96px}

/* Bekommt ein Container im Editor einen Popup-Link, macht Elementor ihn
   fest zum <button>. Hello Elementor gestaltet jeden <button> (roter Rahmen,
   rote Schrift, kein Zeilenumbruch, rote Fläche beim Zeigen). Für Container
   wird das hier zurückgenommen. Gleiche Spezifität wie Hellos Regeln, aber
   später geladen — die Elementor-Klassen gestalten weiter wie bei einem Link. */
:where(body.upload-bausteine) button:where(.e-con){
  -webkit-appearance:none;appearance:none;background-color:transparent;
  border:0;border-radius:0;padding:0;color:inherit;
  font:inherit;letter-spacing:inherit;text-align:inherit;text-transform:inherit;
  white-space:normal;-webkit-user-select:auto;user-select:auto;cursor:pointer;
}
:where(body.upload-bausteine) button:where(.e-con):is(:hover,:focus){background-color:transparent;color:inherit}

/* Die gelandeten Zettel schweben (Klasse .gelandet setzt bausteine.js). */
@keyframes schweben{0%,100%{margin-top:0}50%{margin-top:7px}}

/* --- Rechtsseiten: Impressum, Datenschutz, Cookie-Richtlinie --------------
   Diese Seiten bestehen aus klassischen Elementor-Widgets (Überschrift,
   Texteditor, Formular) bzw. dem Dokument von Complianz in der Theme-Vorlage.
   Die Regeln greifen nur dort — die Startseite enthält weder .elementor-section
   noch .site-main. Gestaltet wie die Vorlage „Rechtstext“: Textspalte 760 px,
   Montserrat für Überschriften, DM Sans für den Text. Die Texte selbst bleiben
   unverändert in den Widgets und im Complianz-Dokument. */
body.upload-bausteine{--recht-spalte:760px;--recht-tinte:#0b0b0b;--recht-text:rgba(11,11,11,.82);--recht-akzent:#c3411f;--recht-koralle:#f18a6e}

/* Spalte und Abstände */
body.upload-bausteine [data-elementor-type="wp-page"] > .elementor-section{background:transparent;margin:0;padding:0 20px}
body.upload-bausteine [data-elementor-type="wp-page"]:has(> .elementor-section){padding:140px 0 86px}
/* Im Impressum steht oben ein alter Leitsatz in weißer Schrift — auf der
   bisherigen Seite unsichtbar. Er bleibt es, samt seinem Abstand. */
body.upload-bausteine [data-elementor-type="wp-page"] > .elementor-section:has(.elementor-element-4a4149e){display:none}
body.upload-bausteine [data-elementor-type="wp-page"] > .elementor-section.elementor-section-boxed > .elementor-container{max-width:calc(var(--recht-spalte) + 20px)}
body.upload-bausteine .site-main{max-width:calc(var(--recht-spalte) + 40px);margin:0 auto;padding:150px 20px 96px}
body.upload-bausteine .site-main :is(.page-header,.page-content){max-width:none;margin:0;padding:0}

/* Hauptüberschrift */
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-heading .elementor-heading-title,
body.upload-bausteine .site-main .page-header .entry-title{
  font-family:"Montserrat",system-ui,sans-serif;font-weight:800;font-size:clamp(36px,4.4vw,52px);
  line-height:1.1;letter-spacing:-.01em;color:var(--recht-tinte);text-transform:none;margin:0 0 28px;
}

/* Fließtext */
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-text-editor,
body.upload-bausteine #cmplz-document{
  font-family:"DM Sans",system-ui,sans-serif;font-size:16.5px;line-height:1.6;color:var(--recht-text);max-width:none;
}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) :is(p,li,td){
  font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;
}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) p{margin:0 0 1em}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) :is(strong,b){color:var(--recht-tinte);font-weight:700}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) :is(h2,h3,h4){
  font-family:"Montserrat",system-ui,sans-serif;font-weight:800;color:var(--recht-tinte);line-height:1.25;letter-spacing:-.005em;text-transform:none;border:0;padding:0;
}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) h2{font-size:27px;margin:48px 0 14px}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) h3{font-size:20px;margin:36px 0 10px}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) h4{font-size:17.5px;margin:28px 0 8px}
body.upload-bausteine #cmplz-document h5{font-family:"DM Sans",system-ui,sans-serif;font-size:15px;font-weight:700;color:var(--recht-tinte)}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) a{
  color:var(--recht-akzent)!important;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;
}  /* !important: Im Impressum ist eine hellere Linkfarbe fest im Text hinterlegt. */
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) :is(ul,ol){margin:0 0 1em;padding-left:1.25em}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) :is(p,li,a){overflow-wrap:break-word}
body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) a{overflow-wrap:anywhere}
@media(max-width:767px){
  body.upload-bausteine [data-elementor-type="wp-page"] > .elementor-section{padding:0 10px}
}
@media(max-width:900px){
  body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-text-editor,body.upload-bausteine #cmplz-document{font-size:16px}
  body.upload-bausteine :is([data-elementor-type="wp-page"] .elementor-widget-text-editor, #cmplz-document) h2{font-size:23px;margin-top:40px}
}

/* Hinweisgeber-Formular im Impressum (mehrstufiges Elementor-Formular).
   Elementor setzt hier sehr spezifische Werte je Widget — deshalb !important. */
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form{
  --e-form-steps-indicator-active-primary-color:var(--recht-koralle);
  --e-form-steps-indicator-active-secondary-color:var(--recht-tinte);
  --e-form-steps-indicator-completed-primary-color:var(--recht-tinte);
  --e-form-steps-indicator-completed-secondary-color:#fff;
  --e-form-steps-indicator-inactive-primary-color:rgba(11,11,11,.3);
  --e-form-steps-indicator-inactive-secondary-color:#fff;
  margin-top:12px;
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form > .elementor-widget-container{border:0!important;padding:0!important;background:none!important;border-radius:0!important}
/* Schrittanzeige: Schritte in natürlicher Breite, nur die Linien dazwischen schrumpfen. */
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators{gap:6px}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator{flex:0 0 auto!important;padding:0!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator__label{white-space:nowrap!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator__separator{flex:1 1 auto!important;min-width:8px!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-form{
  background:#fff6f0!important;border:0!important;border-radius:24px!important;padding:32px 32px 28px!important;
  font-family:"DM Sans",system-ui,sans-serif;color:var(--recht-text);
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form :is(.e-form__indicators__indicator__label,.elementor-field-type-html,.elementor-field-option label,.elementor-field-subgroup label){
  font-family:"DM Sans",system-ui,sans-serif!important;font-size:15px!important;line-height:1.55!important;color:var(--recht-text)!important;
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator__label{font-size:13.5px!important;font-weight:700!important;color:var(--recht-tinte)!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator--state-inactive .e-form__indicators__indicator__label{color:rgba(11,11,11,.5)!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator__number{font-family:"DM Sans",system-ui,sans-serif!important;font-weight:700!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-field-label{
  font-family:"DM Sans",system-ui,sans-serif!important;font-weight:700!important;font-size:14.5px!important;line-height:1.4!important;color:var(--recht-tinte)!important;margin-bottom:7px!important;
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-field-textual{
  background:#fff!important;border:1.5px solid rgba(11,11,11,.14)!important;border-radius:12px!important;
  font-family:"DM Sans",system-ui,sans-serif!important;font-size:16px!important;line-height:1.5!important;color:var(--recht-tinte)!important;
  padding:12px 16px!important;min-height:0!important;box-shadow:none!important;transition:border-color .2s ease;
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-field-textual:focus{border-color:var(--recht-tinte)!important;outline:none}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form :is(input[type=radio],input[type=checkbox]){accent-color:var(--recht-koralle)}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-button{
  background:var(--recht-koralle)!important;color:var(--recht-tinte)!important;border:0!important;border-radius:999px!important;
  font-family:"DM Sans",system-ui,sans-serif!important;font-weight:700!important;font-size:16px!important;line-height:1!important;
  padding:15px 28px!important;min-height:0!important;transition:background-color .25s ease;
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-button:hover{background:#e2694a!important}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__buttons__wrapper__button-previous{
  background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--recht-tinte)!important;
}
body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__buttons__wrapper__button-previous:hover{background:rgba(11,11,11,.06)!important}
/* Sechs Schritte passen schmal nicht nebeneinander: dann nur die Nummern. */
@media(max-width:900px){
  body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator__label{display:none!important}
  body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator{flex:0 0 auto!important;padding:0!important}
  body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators{justify-content:space-between!important;gap:6px}
  body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .e-form__indicators__indicator__separator{min-width:8px!important;flex:1 1 auto!important}
}
@media(max-width:600px){
  body.upload-bausteine [data-elementor-type="wp-page"] .elementor-widget-form .elementor-form{padding:22px 18px 20px!important;border-radius:20px!important}
}

/* Hero: Einblendung beim Laden ohne Skript (15.10.2026). Elementors Lade-Interaktion startet erst, wenn alle Skripte geladen sind; auf dem Handy blieb der Hero so sekundenlang leer. */
@keyframes u-laden-hoch{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* Lenis 1.3.26 (MIT) */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  body.upload-bausteine *,
  body.upload-bausteine *::before,
  body.upload-bausteine *::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;
  }
}