/* ============================================================
   ElbConcept — Designsystem, Fassung 6.2
   Ziel: Elementor → Site Settings → Custom CSS
   Stand 24.09.2026 · 6.2: Abschnitt 5b Bildöffnung mit Kleber,
   Rotation über Animated Headline, Striche füllen sich
   ------------------------------------------------------------
   Änderungen gegenüber Fassung 6.0:
   1. Elementor-Wrapper-Regel ergänzt. Elementor hängt CSS-Klassen
      an den Widget-Wrapper, nicht an das <h2> darin — ohne diese
      Regel bleiben alle ec-Stufen an Widgets wirkungslos.
   2. Eckmarken auf vier Ecken (ein Element, vier Hintergrundbilder).
   3. Breakpoints auf Elementors Standardwerte vereinheitlicht:
      Tablet 1024, Mobil 767. Kein dritter Breakpoint mehr.
      Tabletwerte sind interpoliert und NICHT Teil der freigegebenen
      Skala — bei der nächsten Freigabe bestätigen lassen.
   4. Trägheitsscroll im JavaScript über einen Schalter abschaltbar.

   Schriftwechsel: ausschließlich über die vier Variablen unter
   SCHRIFTUMSCHALTER. Typografie NIE im Widget einstellen.
   ============================================================ */

:root{

  /* ==========================================================
     SCHRIFTUMSCHALTER — hier und nur hier
     Geist    x-Höhe 0,530 · Versalhöhe 0,710
     Familjen x-Höhe 0,500 · Versalhöhe 0,650
     ========================================================== */

  /* --- Geist (aktiv) --- */
  --ec-schrift:"Geist",system-ui,"Segoe UI",Roboto,Arial,sans-serif;
  --ec-f-display:1;
  --ec-f-text:1;
  --ec-lw-plus:0em;

  /* --- Familjen Grotesk (Ersatz) ---
  --ec-schrift:"Familjen Grotesk",system-ui,"Segoe UI",Roboto,Arial,sans-serif;
  --ec-f-display:1.092;
  --ec-f-text:1.06;
  --ec-lw-plus:.008em;
  */

  /* --- Marke --- */
  --ec-navy:#22264c;
  --ec-navy-tief:#171a35;
  --ec-navy-hover:#2b3160;
  --ec-gold:#baa366;
  --ec-gold-hover:#a7935c;
  /* --- Neutral hell --- */
  --ec-weiss:#ffffff;
  --ec-sand:#f7f6f3;
  --ec-linie:#e3e0d9;
  --ec-grau-ui:#8a8a94;
  --ec-grau-text:#5a5d6b;
  /* --- Neutral dunkel --- */
  --ec-hell:#d3d6e4;
  --ec-grau-dunkel:#8b8fa6;   /* nur auf Navy Tief */
  --ec-grau-navy:#a2a6ba;     /* auf Navy */
  /* --- Semantik --- */
  --ec-erfolg:#146c43;
  --ec-fehler:#a01b12;
  --ec-hinweis:#8a5a00;
  /* --- Abstandsraster, Basis 4 --- */
  --r1:4px;  --r2:8px;  --r3:12px; --r4:16px; --r5:24px;
  --r6:32px; --r7:48px; --r8:64px; --r9:96px; --r10:128px;
}

/* ============================================================
   1 · Typo-Skala — Desktop
   Alle Displaystufen laufen auf Gewicht 400. 700 kommt nicht vor.
   ============================================================ */

.ec-d1,.ec-d2,.ec-d3,.ec-z1,.ec-h1,.ec-h2,.ec-h3,.ec-h4,
.ec-l,.ec-t,.ec-k,.ec-m,.ec-z2,.ec-b,
.ec-la1,.ec-la2,.ec-la3,.ec-mo1,.ec-mo2,.ec-mo3{
  font-family:var(--ec-schrift);
  font-feature-settings:"kern" 1,"liga" 1;
}

.ec-d1{font-size:calc(88px * var(--ec-f-display));line-height:1.04;letter-spacing:calc(-.038em + var(--ec-lw-plus));font-weight:400}
.ec-d2{font-size:calc(52px * var(--ec-f-display));line-height:1.06;letter-spacing:calc(-.032em + var(--ec-lw-plus));font-weight:400}
.ec-d3{font-size:calc(66px * var(--ec-f-display));line-height:1.20;letter-spacing:calc(-.035em + var(--ec-lw-plus));font-weight:400}
.ec-z1{font-size:calc(250px * var(--ec-f-display));line-height:.84;letter-spacing:calc(-.050em + var(--ec-lw-plus));font-weight:400;font-variant-numeric:tabular-nums}
.ec-h1{font-size:calc(46px * var(--ec-f-display));line-height:1.06;letter-spacing:calc(-.030em + var(--ec-lw-plus));font-weight:400}
.ec-h2{font-size:calc(36px * var(--ec-f-display));line-height:1.12;letter-spacing:calc(-.028em + var(--ec-lw-plus));font-weight:400}
.ec-h3{font-size:calc(31px * var(--ec-f-display));line-height:1.20;letter-spacing:calc(-.025em + var(--ec-lw-plus));font-weight:500}
.ec-h4{font-size:calc(20px * var(--ec-f-display));line-height:1.34;letter-spacing:calc(-.010em + var(--ec-lw-plus));font-weight:500}
.ec-z2{font-size:calc(38px * var(--ec-f-display));line-height:1.00;letter-spacing:calc(-.030em + var(--ec-lw-plus));font-weight:500;font-variant-numeric:tabular-nums}

.ec-l {font-size:calc(21px * var(--ec-f-text));line-height:1.55;letter-spacing:0;font-weight:400}
.ec-t {font-size:calc(18px * var(--ec-f-text));line-height:1.60;letter-spacing:0;font-weight:400}
.ec-k {font-size:calc(15px * var(--ec-f-text));line-height:1.55;letter-spacing:0;font-weight:400}
.ec-m {font-size:calc(14px * var(--ec-f-text));line-height:1.52;letter-spacing:0;font-weight:400}
.ec-b {font-size:calc(15px * var(--ec-f-text));line-height:1.20;letter-spacing:-.010em;font-weight:500}

/* --- Label-Ebene: ersetzt die gestrichene Monospace ---------
   Vorher 10–11 px Monospace. Der Einwand der Geschäftsführung
   ("zu klein") lag an dieser Zahl, nicht an der Schrift. */
.ec-la1,.ec-mo1{font-size:calc(13px * var(--ec-f-display));line-height:1.20;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
.ec-la2,.ec-mo2{font-size:calc(13px * var(--ec-f-display));line-height:1.20;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.ec-la3,.ec-mo3{font-size:calc(12px * var(--ec-f-display));line-height:1.25;letter-spacing:.14em;text-transform:uppercase;font-weight:500}

/* --- Zeilenlänge Fließtext: höchstens 68 Zeichen ----------- */
.ec-t,.ec-l{max-width:68ch}

/* ============================================================
   1b · ELEMENTOR-WRAPPER-REGEL — ohne sie wirkt nichts
   ------------------------------------------------------------
   Elementor hängt CSS-Klassen an den Widget-Wrapper:
     <div class="elementor-widget ec-d2"> <h2>Text</h2> </div>
   Die Stufe muss deshalb nach innen durchgereicht werden.
   ============================================================ */

.elementor-widget.ec-d1 *,.elementor-widget.ec-d2 *,.elementor-widget.ec-d3 *,
.elementor-widget.ec-z1 *,.elementor-widget.ec-h1 *,.elementor-widget.ec-h2 *,
.elementor-widget.ec-h3 *,.elementor-widget.ec-h4 *,.elementor-widget.ec-z2 *,
.elementor-widget.ec-l  *,.elementor-widget.ec-t  *,.elementor-widget.ec-k  *,
.elementor-widget.ec-m  *,.elementor-widget.ec-b  *,
.elementor-widget.ec-la1 *,.elementor-widget.ec-la2 *,.elementor-widget.ec-la3 *,
.elementor-widget.ec-mo1 *,.elementor-widget.ec-mo2 *,.elementor-widget.ec-mo3 *{
  font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;
}

/* ============================================================
   1c · Typo-Skala — Tablet (≤1024) und Mobil (≤767)
   Tabletwerte sind interpoliert, nicht freigegeben.
   ============================================================ */

@media(max-width:1024px){
  .ec-d1{font-size:calc(60px * var(--ec-f-display))}
  .ec-d2{font-size:calc(38px * var(--ec-f-display))}
  .ec-d3{font-size:calc(46px * var(--ec-f-display))}
  .ec-z1{font-size:calc(160px * var(--ec-f-display))}
  .ec-h1{font-size:calc(38px * var(--ec-f-display))}
  .ec-h2{font-size:calc(30px * var(--ec-f-display))}
  .ec-h3{font-size:calc(26px * var(--ec-f-display))}
  .ec-h4{font-size:calc(19px * var(--ec-f-display))}
  .ec-z2{font-size:calc(32px * var(--ec-f-display))}
  .ec-l {font-size:calc(20px * var(--ec-f-text))}
}

@media(max-width:767px){
  .ec-d1{font-size:calc(34px * var(--ec-f-display));letter-spacing:calc(-.030em + var(--ec-lw-plus))}
  .ec-d2{font-size:calc(24px * var(--ec-f-display))}
  .ec-d3{font-size:calc(28px * var(--ec-f-display));line-height:1.16}
  .ec-z1{font-size:calc(84px * var(--ec-f-display))}
  .ec-h1{font-size:calc(30px * var(--ec-f-display))}
  .ec-h2{font-size:calc(25px * var(--ec-f-display))}
  .ec-h3{font-size:calc(21px * var(--ec-f-display))}
  .ec-h4{font-size:calc(18px * var(--ec-f-display))}
  .ec-z2{font-size:calc(26px * var(--ec-f-display))}
  .ec-l {font-size:calc(19px * var(--ec-f-text))}
  .ec-t {font-size:calc(17px * var(--ec-f-text))}
  .ec-m {font-size:calc(13px * var(--ec-f-text))}
  .ec-la1,.ec-mo1{font-size:calc(12px * var(--ec-f-display))}
  .ec-la2,.ec-mo2{font-size:calc(13px * var(--ec-f-display))}
  .ec-la3,.ec-mo3{font-size:calc(11px * var(--ec-f-display))}
}

/* ============================================================
   2 · Farbregeln als Hilfsklassen
   Gold ist auf hellem Grund NIE Text. Auf dunklem Grund immer.
   ============================================================ */

.ec-auf-dunkel{background:var(--ec-navy-tief);color:var(--ec-weiss)}
.ec-auf-navy{background:var(--ec-navy);color:var(--ec-weiss)}
.ec-auf-sand{background:var(--ec-sand);color:var(--ec-navy)}
.ec-gold-text{color:var(--ec-gold)}            /* nur in .ec-auf-dunkel / .ec-auf-navy */
.ec-gold-flaeche{background:var(--ec-gold);color:var(--ec-navy)}
.ec-auf-dunkel .ec-t,.ec-auf-dunkel .ec-l{color:var(--ec-hell)}
.ec-auf-dunkel .ec-la1,.ec-auf-dunkel .ec-la3{color:var(--ec-grau-dunkel)}
.ec-auf-navy  .ec-la1,.ec-auf-navy  .ec-la3{color:var(--ec-grau-navy)}

/* Links sind immer unterstrichen, Linkfarbe = Textfarbe */
.ec-inhalt a{color:inherit;text-decoration:underline;text-underline-offset:.18em}
.ec-inhalt a:hover{text-decoration-thickness:2px}

/* Fokusring: Navy auf Hell, Gold auf Dunkel — immer sichtbar */
:focus-visible{outline:2px solid var(--ec-navy);outline-offset:3px}
.ec-auf-dunkel :focus-visible,.ec-auf-navy :focus-visible{outline-color:var(--ec-gold)}

/* Regel 6: Goldfläche berührt keine Bildkante, an der Haut liegt */
.ec-gold-flaeche + img,img + .ec-gold-flaeche{margin-top:var(--r6)}

/* Eckenradius überall 0 */
.ec-inhalt *,.ec-karte,.ec-btn,.ec-btn-2,.ec-gold-flaeche{border-radius:0}

/* ============================================================
   3 · Musterebene — Korn, Goldschein, vier Eckmarken
   Zusammen unter 2 KB, keine Bilddatei.
   ============================================================ */

.ec-korn::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.045;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(%23n)'/></svg>");
}

/* Goldschein bleibt im Container — kein Überstand, keine Seitenbreite */
.ec-schein{position:relative;isolation:isolate}
.ec-schein::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 50% at 70% 40%,rgba(186,163,102,.17),transparent 70%);
}

/* Vier Passerkreuze, ein Element, vier Hintergrundbilder */
.ec-marken::before{
  content:"";position:fixed;inset:24px;pointer-events:none;z-index:9997;
  opacity:.26;mix-blend-mode:difference;
  background-repeat:no-repeat;
  background-position:left top,right top,left bottom,right bottom;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16'><circle cx='8' cy='8' r='5.5' fill='none' stroke='white'/><path d='M8 0v16M0 8h16' stroke='white'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16'><circle cx='8' cy='8' r='5.5' fill='none' stroke='white'/><path d='M8 0v16M0 8h16' stroke='white'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16'><circle cx='8' cy='8' r='5.5' fill='none' stroke='white'/><path d='M8 0v16M0 8h16' stroke='white'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16'><circle cx='8' cy='8' r='5.5' fill='none' stroke='white'/><path d='M8 0v16M0 8h16' stroke='white'/></svg>");
}

/* Kopfleiste: lesbar auf hellen und dunklen Sektionen */
.ec-kopf{mix-blend-mode:difference;opacity:0;transition:opacity .5s ease}
body.ec-ready .ec-kopf{opacity:1;transition-delay:1.3s}

/* ============================================================
   4 · Bühne und Rotation
   ============================================================ */

.ec-buehne{
  min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  padding:var(--r9) 0 var(--r8);position:relative;
}
/* Das JavaScript misst die längste Zeile und senkt die
   Schriftgröße, bis sie in eine Zeile passt. */
.ec-rotation{display:block;min-height:1.04em}
@media(max-width:767px){.ec-rotation{min-height:3.2em}}  /* Platz für drei Zeilen, damit nichts springt */
.ec-rotation .ec-fest{color:var(--ec-weiss)}
.ec-rotation .ec-wechsel{color:var(--ec-gold)}

/* Fortschrittsstriche: zeigen, dass es genau fünf Bereiche sind.
   6.2 wie Prototyp v3: der aktive Strich füllt sich im Takt der Rotation. */
.ec-striche{display:flex;gap:7px;margin-top:var(--r6);list-style:none;padding:0}
.ec-striche i{display:block;width:26px;height:2px;background:rgba(255,255,255,.18);position:relative;overflow:hidden}
.ec-striche i b{position:absolute;inset:0;background:var(--ec-gold);transform:scaleX(0);transform-origin:left}
.ec-striche i.ec-aktiv b{animation:ec-fuell var(--ec-takt,2600ms) linear forwards}
@keyframes ec-fuell{to{transform:scaleX(1)}}

/* Rotation mit Elementor „Animated Headline“ (6.2):
   „Wir“ Weiß, rotierender Teil Gold, Zeile läuft nicht um */
.elementor-widget-animated-headline.ec-rotation .elementor-headline{margin:0;white-space:nowrap}
@media(max-width:767px){.elementor-widget-animated-headline.ec-rotation .elementor-headline{white-space:normal}}

/* Haarlinie */
.ec-haarlinie{height:1px;background:var(--ec-grau-dunkel);width:100%;margin:var(--r7) 0 0;
  transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.22,1,.36,1)}
body.ec-ready .ec-haarlinie{transform:scaleX(1);transition-delay:.9s}

/* Beweiszeile: drei Werte, kein Fließtext */
.ec-beweis{display:grid;gap:var(--r5);grid-template-columns:1fr;margin-top:var(--r6)}
@media(min-width:768px){.ec-beweis{grid-template-columns:repeat(3,1fr)}}

/* ============================================================
   5 · Bewegung — Eintritt, Wortmasken, Bildöffnung
   ============================================================ */

[data-ec-reveal]{opacity:0;transform:translateY(24px);
  transition:opacity .9s ease,transform .9s cubic-bezier(.16,1,.3,1)}
[data-ec-reveal].ec-an{opacity:1;transform:none}

.ec-satz .ec-zeile-maske{display:block;overflow:hidden;padding-bottom:.08em}
.ec-satz .ec-w{display:inline-block;transform:translateY(105%);opacity:0;
  transition:transform 1.05s cubic-bezier(.16,1,.3,1),opacity .6s ease}
.ec-satz.ec-an .ec-w,.ec-satz.ec-an .ec-w{transform:translateY(0);opacity:1}

/* Bildöffnung: Foto wächst beim Scrollen aus einem senkrechten Spalt */
.ec-oeffnung{position:relative;overflow:hidden}
.ec-oeffnung>img,.ec-oeffnung>.ec-bild,.ec-oeffnung>.elementor-widget-image{
  display:block;width:100%;height:auto;
  clip-path:inset(0 var(--ec-o,48%) 0 var(--ec-o,48%));
  transition:clip-path .08s linear}

/* ============================================================
   5b · Bildöffnung mit Kleber — Fassung 6.3
   Abschnitt 185 svh (mobil 150 svh). Das Foto ist sofort als Fenster
   sichtbar, sobald der Abschnitt ins Bild kommt, und ist voll offen,
   wenn der Kleber unter der Kopfleiste andockt. Danach Text auf dem Bild.
   Bildausschnitt oben mittig (object-position 50% 0%).
   Ausnahme von „kein Text auf Foto mit Gesichtern“, freigegeben
   durch die Geschäftsführung am 24.09.2026.
   Aufbau (nur native Elementor-Elemente):
   .ec-oe            äußerer Container
     .ec-oe-kleber   innerer Container (klebt)
       .ec-oe-foto   Bild-Widget
       .ec-oe-schleier  leerer Container
       .ec-oe-worte  Container mit Überschrift, Text, Buttons
   ============================================================ */

.ec-oe{height:185svh;position:relative}
@media(max-width:767px){.ec-oe{height:150svh}}
.ec-oe-kleber{position:sticky;top:0;height:100svh;overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.ec-oe-foto{position:absolute!important;inset:0;width:100%!important;max-width:none!important;margin:0!important;will-change:clip-path}
.ec-oe-foto .elementor-widget-container,.ec-oe-foto img{width:100%;height:100%;max-width:none}
.ec-oe-foto img{object-fit:cover;object-position:50% 0%;display:block}
.ec-oe-schleier{position:absolute!important;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(23,26,53,.74) 0%,rgba(23,26,53,.26) 44%,rgba(23,26,53,.88) 100%)}
.ec-oe-worte{position:relative;z-index:3;text-align:center;align-items:center;padding:0 28px;max-width:1000px}
.ec-oe-worte .ec-l{margin-inline:auto;max-width:46ch}
@media (prefers-reduced-motion: reduce){
  .ec-oe{height:auto}
  .ec-oe-kleber{position:relative}
  .ec-oe-foto{clip-path:none!important}
  .ec-oe-schleier,.ec-oe-worte{opacity:1!important;transform:none!important}
}

/* ============================================================
   6 · Leistungskarten — Fassung 7: kein Stapeln mehr
   Entscheidung GF 01.10.2026: Übersicht schlägt Effekt.
   Die Karten stehen fest untereinander und treten gestaffelt ein.
   ============================================================ */

.ec-stapel{position:relative}
.ec-karte{
  position:static;background:var(--ec-weiss);border-top:1px solid var(--ec-linie);
  padding:var(--r7);margin-bottom:var(--r5);box-shadow:none}
.ec-karte:last-of-type{margin-bottom:0}
@media(max-width:767px){.ec-karte{padding:var(--r5)}}
/* Kartennummer: große, ruhige Ziffer (6.3) */
.ec-karte-nr{font-variant-numeric:tabular-nums;min-width:1.4em}

/* ============================================================
   7 · Klebezone und Überkleber
   Der Überkleber verhindert, dass die große Zahl beim Scrollen
   in den nächsten Abschnitt hineinragt. Gehört an den FOLGENDEN
   Container, nicht an den Kleber.
   ============================================================ */

.ec-kleber{position:sticky;top:0;z-index:1;padding:190px 0;text-align:center}
.ec-ueberkleber{position:relative;z-index:2;background:var(--ec-weiss)}
.ec-auf-dunkel.ec-ueberkleber,.ec-auf-navy.ec-ueberkleber{background:var(--ec-navy-tief)}
.ec-auf-sand.ec-ueberkleber{background:var(--ec-sand)}

/* ============================================================
   8 · Zitat — goldene Kante
   Kursivsatz über vier Zeilen wird anstrengend zu lesen, deshalb
   die Kante. Synthetisch geneigte Schrift bleibt verboten.
   ============================================================ */

.ec-zitat{border-left:3px solid var(--ec-gold);padding-left:26px;margin:var(--r7) 0;max-width:62ch;
  font-style:normal}
.ec-zitat p{font-size:calc(30px * var(--ec-f-display));line-height:1.35;font-weight:400;
  letter-spacing:-.020em;margin:0 0 var(--r4)}
.ec-zitat cite{font-style:normal;display:block}
.ec-zitat-klein p{font-size:calc(21px * var(--ec-f-text));line-height:1.5}
@media(max-width:767px){.ec-zitat p{font-size:calc(22px * var(--ec-f-display))}.ec-zitat{padding-left:18px}}

/* ============================================================
   9 · Laufband — Inhalt ZWEIMAL einsetzen
   ============================================================ */

.ec-laufband{overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ec-track{display:flex;gap:var(--r8);width:max-content;animation:ec-lauf 36s linear infinite}
@keyframes ec-lauf{to{transform:translateX(-50%)}}

/* ============================================================
   10 · Zeilenlinks mit wanderndem „Wir“
   ============================================================ */

.ec-zeilen{border-top:1px solid var(--ec-linie)}
.ec-zeile{display:flex;align-items:baseline;gap:var(--r5);padding:var(--r5) 0;
  border-bottom:1px solid var(--ec-linie);text-decoration:none;color:inherit;
  transition:padding-left .3s cubic-bezier(.22,1,.36,1)}
.ec-zeile:hover,.ec-zeile.ec-aktiv{padding-left:var(--r5)}
.ec-zeile .ec-nr{color:var(--ec-gold);flex:0 0 auto}
.ec-zeile .ec-wir{opacity:0;transition:opacity .3s ease;flex:0 0 auto}
.ec-zeile.ec-aktiv .ec-wir{opacity:1}

/* ============================================================
   11 · Buttons
   ============================================================ */

/* Fassung 6.3: schlanker, kein Unterstrich, Pfeil gleitet beim Hover.
   Gold = Handlung. Zweitbutton passt sich dem Grund an:
   hell (Standard) → Navy-Linie, Hover Navy gefüllt;
   in .ec-auf-dunkel / .ec-auf-navy → weiße Linie, Hover weiß gefüllt. */
.elementor-widget.ec-btn .elementor-button,.elementor-widget.ec-btn-2 .elementor-button,
.ec-btn>a,.ec-btn-2>a,a.ec-btn,a.ec-btn-2{
  display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 20px 0 22px;
  font-family:var(--ec-schrift);font-size:calc(14px * var(--ec-f-text));font-weight:500;
  letter-spacing:.01em;line-height:1;border:1px solid transparent;border-radius:0;
  text-decoration:none!important;cursor:pointer;box-shadow:none;
  transition:background-color .35s cubic-bezier(.22,1,.36,1),color .35s cubic-bezier(.22,1,.36,1),border-color .35s cubic-bezier(.22,1,.36,1)}
.ec-btn .elementor-button *,.ec-btn-2 .elementor-button *{text-decoration:none!important;font:inherit;letter-spacing:inherit}
/* Pfeil genau einmal: bei Elementor-Buttons am Inhalt, bei reinen Links am Link.
   (Elementor setzt a.elementor-button direkt in den Widget-Container — daher :not) */
.ec-btn .elementor-button-content-wrapper::after,.ec-btn-2 .elementor-button-content-wrapper::after,
.ec-btn>a:not(.elementor-button)::after,.ec-btn-2>a:not(.elementor-button)::after,a.ec-btn::after,a.ec-btn-2::after{
  content:"\2192";display:inline-block;margin-left:10px;font-weight:400;
  transition:transform .35s cubic-bezier(.22,1,.36,1)}
.ec-btn .elementor-button:hover .elementor-button-content-wrapper::after,
.ec-btn-2 .elementor-button:hover .elementor-button-content-wrapper::after,
.ec-btn>a:not(.elementor-button):hover::after,.ec-btn-2>a:not(.elementor-button):hover::after,a.ec-btn:hover::after,a.ec-btn-2:hover::after{transform:translateX(4px)}
.elementor-widget.ec-btn .elementor-button,.elementor-widget.ec-btn-2 .elementor-button{white-space:nowrap}

.elementor-widget.ec-btn .elementor-button,.ec-btn>a,a.ec-btn{background:var(--ec-gold);color:var(--ec-navy-tief);border-color:var(--ec-gold)}
.elementor-widget.ec-btn .elementor-button:hover,.elementor-widget.ec-btn .elementor-button:focus,
.ec-btn>a:hover,a.ec-btn:hover{background:#c9b683;border-color:#c9b683;color:var(--ec-navy-tief)}

.elementor-widget.ec-btn-2 .elementor-button,.ec-btn-2>a,a.ec-btn-2{
  background:transparent;color:var(--ec-navy);border-color:rgba(34,38,76,.32)}
.elementor-widget.ec-btn-2 .elementor-button:hover,.elementor-widget.ec-btn-2 .elementor-button:focus,
.ec-btn-2>a:hover,a.ec-btn-2:hover{background:var(--ec-navy);border-color:var(--ec-navy);color:var(--ec-weiss)}

:is(.ec-auf-dunkel,.ec-auf-navy) .elementor-widget.ec-btn-2 .elementor-button,
:is(.ec-auf-dunkel,.ec-auf-navy) .ec-btn-2>a,:is(.ec-auf-dunkel,.ec-auf-navy) a.ec-btn-2{
  color:var(--ec-weiss);border-color:rgba(255,255,255,.34)}
:is(.ec-auf-dunkel,.ec-auf-navy) .elementor-widget.ec-btn-2 .elementor-button:hover,
:is(.ec-auf-dunkel,.ec-auf-navy) .elementor-widget.ec-btn-2 .elementor-button:focus,
:is(.ec-auf-dunkel,.ec-auf-navy) .ec-btn-2>a:hover,:is(.ec-auf-dunkel,.ec-auf-navy) a.ec-btn-2:hover{
  background:var(--ec-weiss);border-color:var(--ec-weiss);color:var(--ec-navy-tief)}

/* ============================================================
   12 · Formular — Elementor Pro, vier Zustände
   Formularränder nie in --ec-linie: 1,32:1 reicht nicht.
   ============================================================ */

.ec-form .elementor-field{
  font-family:var(--ec-schrift);font-size:calc(18px * var(--ec-f-text));line-height:1.5;
  padding:14px 16px;border:1px solid var(--ec-grau-ui);background:var(--ec-weiss);
  color:var(--ec-navy);border-radius:0}
.ec-form .elementor-field:focus{border-color:var(--ec-navy);outline:2px solid var(--ec-navy);outline-offset:2px}
.ec-form .elementor-field::placeholder{color:var(--ec-grau-text);opacity:1}
.ec-form .elementor-field-label{font-size:calc(15px * var(--ec-f-text));font-weight:500;margin-bottom:var(--r2);display:block}
.ec-form .elementor-message-success{color:var(--ec-erfolg)}
.ec-form .elementor-message-danger,.ec-form .elementor-error .elementor-field{border-color:var(--ec-fehler)}
.ec-form .elementor-message-danger{color:var(--ec-fehler)}

/* Formular auf dunklem Grund — wie Prototyp v3 (6.2) */
.ec-auf-dunkel .ec-form .elementor-field{background:transparent;color:var(--ec-weiss);border-color:var(--ec-grau-ui)}
.ec-auf-dunkel .ec-form .elementor-field::placeholder{color:var(--ec-grau-dunkel)}
.ec-auf-dunkel .ec-form .elementor-field:focus{border-color:var(--ec-gold);outline-color:var(--ec-gold)}
.ec-auf-dunkel .ec-form .elementor-field-label{color:var(--ec-grau-dunkel);font-size:calc(13px * var(--ec-f-display));letter-spacing:.12em;text-transform:uppercase}
.ec-auf-dunkel .ec-form .elementor-field-type-acceptance label{color:var(--ec-hell)}
.ec-auf-dunkel .ec-form .elementor-message-success{color:var(--ec-weiss)}

/* ============================================================
   13 · Inhaltsbreite · Platzhalter · FCM-Karte
   ============================================================ */

.ec-inhalt{max-width:1200px;margin-inline:auto;padding-inline:20px}
@media(min-width:768px){.ec-inhalt{padding-inline:32px}}

.ec-platzhalter{background:var(--ec-sand);outline:1px dashed var(--ec-grau-ui);outline-offset:-1px;
  display:flex;align-items:center;justify-content:center;color:var(--ec-grau-text)}
.ec-auf-dunkel .ec-platzhalter{background:transparent;color:var(--ec-grau-dunkel)}
.ec-fcm{border:1px dashed var(--ec-gold)}

/* ============================================================
   14 · Bewegung reduzieren — Pflicht, nicht Kür
   ============================================================ */

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
  html{scroll-behavior:auto!important}
  [data-ec-reveal]{opacity:1;transform:none}
  .ec-satz .ec-w{transform:none;opacity:1}
  .ec-oeffnung>img,.ec-oeffnung>.ec-bild,.ec-oeffnung>.elementor-widget-image{clip-path:none}
  .ec-track{animation:none}
  .ec-karte{position:relative;top:auto!important;margin-bottom:var(--r5)}
  .ec-haarlinie{transform:scaleX(1)}
  .ec-kopf{opacity:1}
  .ec-striche i.ec-aktiv b{animation:none;transform:scaleX(1)}
}


/* ============================================================
   5c · Kleber unter der Kopfleiste — Fassung 6.2
   Die Kopfleiste ist fixiert (72 px, mobil 64 px, dazu die
   WordPress-Adminleiste). Der Kleber beginnt darunter, damit das
   Foto oben nicht verdeckt wird.
   ============================================================ */
:root{--ec-kopfhoehe:72px;--ec-adminhoehe:0px}
@media (max-width:767px){:root{--ec-kopfhoehe:64px}}
body.admin-bar{--ec-adminhoehe:32px}
@media (max-width:782px){body.admin-bar{--ec-adminhoehe:46px}}
.ec-oe-kleber{top:calc(var(--ec-kopfhoehe) + var(--ec-adminhoehe));
  height:calc(100svh - var(--ec-kopfhoehe) - var(--ec-adminhoehe))}
@media (prefers-reduced-motion: reduce){.ec-oe-kleber{top:auto}}


/* 7b · Rotation mobil — Fassung 6.2
   Unter 768 px steht der wechselnde Teil in eigener Zeile und darf
   umbrechen, damit lange Zeilen („führen durch den Förderdschungel.“)
   nicht über den Rand laufen. */
@media(max-width:767px){
  .elementor-widget-animated-headline.ec-rotation .elementor-headline-dynamic-wrapper{display:block;width:100%!important;text-align:left}
  .elementor-widget-animated-headline.ec-rotation .elementor-headline-dynamic-text{white-space:normal;width:100%}
}


/* ============================================================
   14 · Fassung 6.3 — Startseite nachgeschärft (28.09.2026)
   ============================================================ */

/* Kopfleiste schrumpft beim Scrollen (Klasse ec-kopfleiste am Header-Container,
   ec-klein setzt elbconcept.js ab 40 px Scrollweg) */
.ec-kopfleiste{transition:min-height .35s cubic-bezier(.22,1,.36,1),top .2s linear}
body.ec-klein{--ec-kopfhoehe:58px}
body.ec-klein .ec-kopfleiste.e-con{--min-height:58px;min-height:58px}
@media(max-width:767px){
  body.ec-klein{--ec-kopfhoehe:54px}
  body.ec-klein .ec-kopfleiste.e-con{--min-height:54px;min-height:54px}
}

/* Rezensionen: mobil eine Stufe kleiner */
@media(max-width:767px){.ec-rez,.ec-rez *{font-size:calc(16px * var(--ec-f-text))!important;line-height:1.55!important}}

/* Zitat mobil mit weniger Luft */
@media(max-width:767px){.ec-zitat{margin:var(--r5) 0}}

/* Logowand wie Prototyp: Haarlinien-Raster, Zellen 5:2 */
.ec-logowand .e-con{aspect-ratio:5/2}

/* Bildöffnung mobil (6.4): kein Kleben. Foto 4:5 oben (beide Personen sichtbar),
   öffnet sich beim Hineinscrollen; Text darunter auf Navy Tief, sofort lesbar. */
@media(max-width:767px){
  .ec-oe{height:auto}
  .ec-oe-kleber{position:relative!important;top:auto!important;height:auto!important;
    flex-direction:column;align-items:stretch;justify-content:flex-start;overflow:hidden}
  .ec-oe-foto{position:relative!important;inset:auto!important;height:auto!important;aspect-ratio:4/5}
  .ec-oe-foto img{object-position:60% 0%}
  .ec-oe-schleier{inset:0 0 auto 0!important;height:auto;aspect-ratio:4/5;
    background:linear-gradient(180deg,rgba(23,26,53,0) 55%,rgba(23,26,53,.7) 85%,#171a35 100%)}
  .ec-oe-worte{padding:8px 20px 64px;margin-top:-48px;max-width:none}
  .ec-oe-worte .e-con{width:100%}
  .ec-oe-worte .elementor-widget-button{width:100%}
  .ec-oe-worte .elementor-button{width:100%;justify-content:center}
}
/* Logo als Bild in Kopf, Menü und Fuß */
.ec-logo img{display:block;height:auto}

/* ============================================================
   15 · Bewegungsschicht wie Prototyp v3 — Fassung 6.4
   Klassen werden an die Elementor-Elemente gehängt; body.ec-ready
   setzt elbconcept.js nach dem Laden (Notausgang 1,2 s).
   ============================================================ */

/* Kopfleiste blendet nach der Bühne ein */
.ec-kopfleiste{opacity:0;transform:translateY(-10px);
  transition:opacity .9s ease 1.4s,transform .9s ease 1.4s,min-height .35s cubic-bezier(.22,1,.36,1),top .2s linear}
body.ec-ready .ec-kopfleiste{opacity:1;transform:none}
body.elementor-editor-active .ec-kopfleiste{opacity:1;transform:none}

/* Goldschein der Bühne wächst auf */
.ec-buehne{overflow:hidden}
.ec-buehne.ec-schein::before{inset:auto;left:18%;top:38%;width:1200px;height:1200px;
  background:radial-gradient(circle,rgba(186,163,102,.17) 0%,rgba(186,163,102,0) 62%);
  opacity:0;transform:translate(-50%,-50%) scale(.55);
  transition:opacity 2.6s ease .3s,transform 2.6s ease .3s}
body.ec-ready .ec-buehne.ec-schein::before{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* Kennzeile der Bühne: steigt auf, Haarlinie zieht sich auf */
.ec-e-kick{opacity:0;transform:translateY(8px);transition:opacity .9s ease .3s,transform .9s ease .3s}
.ec-e-kick .elementor-widget-divider{clip-path:inset(0 100% 0 0);transition:clip-path 1.4s cubic-bezier(.16,1,.3,1) .8s}
body.ec-ready .ec-e-kick{opacity:1;transform:none}
body.ec-ready .ec-e-kick .elementor-widget-divider{clip-path:inset(0 0 0 0)}

/* Überschrift der Startseite steht sofort (wie Prototyp) — kein Einfahren des „Wir“ */

/* Einleitung, Striche, Zahlenzeile, Fußzeile — gestaffelt */
.ec-e-lead{opacity:0;transform:translateY(12px);transition:opacity 1s ease .95s,transform 1s ease .95s}
.ec-e-zahl{opacity:0;transform:translateY(12px);transition:opacity 1s ease 1.15s,transform 1s ease 1.15s}
.ec-e-striche{opacity:0;transition:opacity 1s ease 1.5s}
.ec-e-unten{opacity:0;transition:opacity 1s ease 1.7s}
/* Startseite: Reihenfolge wie Prototyp — Kennzeile, Linie, Striche, zuletzt die drei Zahlen */
.ec-e-striche ~ .ec-e-zahl{transition-delay:1.9s,1.9s}
body.ec-ready .ec-e-lead,body.ec-ready .ec-e-zahl,body.ec-ready .ec-e-striche,body.ec-ready .ec-e-unten{opacity:1;transform:none}

/* Fußzeile der Bühne mit Scroll-Hinweis (Maus-Umriss, Goldstrich tickt) */
.ec-e-unten .elementor-heading-title{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.ec-e-unten .elementor-heading-title::after{content:"";flex:0 0 auto;width:13px;height:21px;box-sizing:border-box;
  border:1px solid rgba(255,255,255,.3);border-radius:7px;
  background:linear-gradient(var(--ec-gold),var(--ec-gold)) no-repeat 50% 5px/2px 5px;
  animation:ec-tick 2s ease-in-out infinite}
@keyframes ec-tick{0%,100%{background-position:50% 5px}50%{background-position:50% 11px}}

/* Stationen im Ablauf: aktiv, sobald im Blick */
.ec-schritt{opacity:.32;transition:opacity .6s ease}
.ec-schritt.ec-an{opacity:1}
/* Fortschrittsbalken im Ablauf-Kopf */
.ec-balken{height:2px;background:rgba(139,143,166,.35);position:relative;overflow:hidden}
.ec-balken>.ec-balken-b,.ec-balken .ec-balken-b{position:absolute!important;left:0;top:0;bottom:0;width:0;min-height:0!important;
  padding:0!important;background:var(--ec-gold);transition:width .18s linear}

/* Zeilenliste: aktive Zeile hell, übrige gedimmt (Prototyp) */
.ec-zeilen .ec-zeile{opacity:.26;transition:opacity .5s ease,padding .4s ease}
.ec-zeilen .ec-zeile.ec-aktiv,.ec-zeilen .ec-zeile:hover{opacity:1}

/* Automatisch eingeblendete Inhalte (Klasse setzt elbconcept.js) */
.ec-auto{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s cubic-bezier(.16,1,.3,1)}
.ec-auto.ec-an{opacity:1;transform:none}

body.elementor-editor-active .ec-e-kick,body.elementor-editor-active .ec-e-lead,body.elementor-editor-active .ec-e-zahl,
body.elementor-editor-active .ec-e-striche,body.elementor-editor-active .ec-e-unten,body.elementor-editor-active .ec-auto{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  .ec-kopfleiste,.ec-e-kick,.ec-e-lead,.ec-e-zahl,.ec-e-striche,.ec-e-unten,.ec-auto,.ec-schritt{opacity:1!important;transform:none!important}
  .ec-e-kick .elementor-widget-divider{clip-path:none}
  .ec-buehne.ec-schein::before{opacity:1;transform:translate(-50%,-50%)}
  .ec-e-unten .elementor-heading-title::after{animation:none}
}

/* ============================================================
   Fassung 7 — Ergänzungen aus dem GF-Durchgang (08.10.2026)
   Selektoren gegenüber dem Masterprompt auf .elementor-widget.ec-btn
   angehoben, sonst gewinnt die Button-Regel aus Abschnitt 11.
   ============================================================ */

/* Buttons plakativer — Beschluss GF 01.10.2026 */
.ec-b{font-size:calc(17px * var(--ec-f-text))}
.elementor-widget.ec-btn .elementor-button,.elementor-widget.ec-btn-2 .elementor-button,
.ec-btn>a,.ec-btn-2>a,a.ec-btn,a.ec-btn-2{padding:20px 36px;min-height:0;font-size:calc(17px * var(--ec-f-text))}
@media(max-width:767px){
  .elementor-widget.ec-btn .elementor-button,.elementor-widget.ec-btn-2 .elementor-button,
  .ec-btn>a,.ec-btn-2>a,a.ec-btn,a.ec-btn-2{padding:17px 26px;width:100%;justify-content:center}
}

/* Goldener Stern — die einzige Icon-Ausnahme.
   Schriftzeichen, keine Icon-Bibliothek, kein Bild. */
.ec-stern{color:var(--ec-gold);line-height:1;margin-left:.22em;font-size:.92em}
.ec-stern[aria-hidden]{speak:none}

/* Partnerlogos stehen auf weißer Fläche. */
.ec-partnerflaeche{background:var(--ec-weiss);padding:var(--r6);display:flex;
  flex-wrap:wrap;gap:var(--r6);align-items:center;justify-content:center}
.ec-partnerflaeche img{max-width:100%;height:auto}
.ec-badge{background:var(--ec-weiss);padding:var(--r5);display:inline-flex}

/* Kundenstimmen 2 x 2 */
.ec-stimmen{display:grid;gap:var(--r6);grid-template-columns:1fr}
@media(min-width:768px){.ec-stimmen{grid-template-columns:1fr 1fr}}

/* ============================================================
   16 · Bühne auf allen Seiten gleich — Werte der Startseite
   (GF-Anpassung im Editor, per Klasse übernommen 08.10.2026).
   Keine Typo und kein Layout mehr im Widget.
   ============================================================ */
.e-con.ec-buehne{--min-height:0px;min-height:0;--justify-content:center;justify-content:center;
  --padding-top:150px;--padding-bottom:150px;--padding-left:0px;--padding-right:0px;padding:150px 0}
/* mobil 50 px Luft — gemessen unter der fixierten Kopfleiste */
@media(max-width:767px){
  .e-con.ec-buehne{--padding-top:calc(var(--ec-kopfhoehe) + 32px);--padding-bottom:50px;
    padding:calc(var(--ec-kopfhoehe) + 32px) 0 50px}
}
.ec-buehne .e-con.ec-inhalt{--width:80%;width:80%;max-width:1120px;margin-inline:auto}
.ec-buehne .ec-d1{font-size:calc(55px * var(--ec-f-display))}
.ec-buehne .ec-z2{font-size:calc(30px * var(--ec-f-display))}
.ec-buehne .ec-e-zahl>.e-con{--width:25%;width:25%}
@media(max-width:1024px){.ec-buehne .ec-d1{font-size:calc(40px * var(--ec-f-display))}}
@media(max-width:767px){
  .ec-buehne .ec-d1{font-size:calc(30px * var(--ec-f-display))}
  .ec-buehne .ec-z2{font-size:calc(25px * var(--ec-f-display))}
  .ec-buehne .ec-e-zahl>.e-con{--width:100%;width:100%}
}

/* ============================================================
   17 · Fassung 7 — Bausteine der Startseite (08.10.2026)
   ============================================================ */

/* Platzhalter im Seitenverhältnis 3:2 */
.ec-3zu2{aspect-ratio:3/2;width:100%}

/* Kundenstimmen 2 x 2 — Elementor-Container auf Raster umstellen */
.e-con.ec-stimmen{--display:grid;display:grid;gap:var(--r7) var(--r6)}
.ec-stimmen>.e-con{--width:100%;width:100%;min-width:0}
.ec-stimmen .ec-zitat{margin:var(--r3) 0 0}
.ec-stimmen .ec-gold-flaeche{align-self:flex-start}

/* FCM: zwei Logos auf weißer Fläche, Breiten etwa 3 : 2 */
.e-con.ec-fcm-flaeche{--flex-wrap:nowrap;align-items:center}
.ec-fcm-flaeche>.elementor-widget{min-width:0;max-width:none}
.ec-fcm-flaeche>.ec-fcm-gross{flex:3 1 0}
.ec-fcm-flaeche>.ec-fcm-klein{flex:2 1 0}
.ec-fcm-flaeche img{width:100%;height:auto;display:block}
@media(max-width:767px){
  .e-con.ec-fcm-flaeche{--flex-direction:column;flex-direction:column}
  .ec-fcm-flaeche>.ec-fcm-gross,.ec-fcm-flaeche>.ec-fcm-klein{flex:0 0 auto;width:100%}
  .ec-fcm-flaeche>.ec-fcm-klein{width:70%}
}

/* Kundenlogowand: Überschrift links, Platzhalter volle Breite */
.e-con.ec-kundenwand{align-items:stretch;justify-content:flex-start;gap:var(--r5)}
.ec-kundenwand>.e-con{--width:100%;width:100%}

/* Textlink zur digitalfabrik */
.ec-textlink a{color:var(--ec-navy);text-decoration:underline;text-underline-offset:.2em}
.ec-textlink a:hover{text-decoration-thickness:2px}

/* Award-Leiste auf Navy: Logo auf weißer Fläche */
.e-con.ec-award{align-items:center;gap:var(--r6);flex-wrap:wrap}
.ec-badge img{display:block;width:260px;max-width:100%;height:auto}
@media(max-width:767px){.e-con.ec-award{--flex-direction:column;flex-direction:column;align-items:flex-start}}

/* Wortmarke 28 px hoch — Kopfleiste, Menü und Fuß */
.elementor-widget.ec-logo img{height:28px;width:auto;max-width:none}

/* Bildöffnung mobil: Text steht unter dem Foto — dort bleibt Navy Tief,
   damit die weiße Schrift lesbar bleibt (Desktop: Fläche Sand). */
@media(max-width:767px){.ec-oe-kleber{background:var(--ec-navy-tief)}}

/* 17b · Nachträge nach Sichtprüfung */
/* Stern bleibt gold — die Wrapper-Regel aus 1b setzt sonst color:inherit */
.elementor-widget .elementor-heading-title .ec-stern{color:var(--ec-gold)}
/* Award: Logofläche nur so breit wie das Logo */
.ec-award>.e-con.ec-badge{--width:auto;width:auto;flex:0 0 auto}
/* Wortmarke: Seitenverhältnis fest, falls die SVG keine Maße mitbringt */
.elementor-widget.ec-logo img{aspect-ratio:622/166}
/* Große Zahl: Pluszeichen hochgestellt — auf hellem Grund Navy, auf dunklem Gold */
.ec-z1 .elementor-counter-number-wrapper{font:inherit;letter-spacing:inherit;line-height:inherit;justify-content:flex-start}
.ec-z1 .elementor-counter-number-suffix{font-size:.19em;vertical-align:super;align-self:flex-start;color:var(--ec-navy);margin-left:.04em}
.ec-auf-dunkel .ec-z1 .elementor-counter-number-suffix{color:var(--ec-gold)}
/* Sternreihe über der Bewertung */
.ec-sterne .elementor-heading-title{letter-spacing:.14em}
/* Kicker mobil: eine Zeile — Text darf umbrechen, Goldlinie füllt den Rest */
@media(max-width:767px){
  .e-con.ec-e-kick{--flex-wrap:nowrap;flex-wrap:nowrap}
  .ec-e-kick>.elementor-widget-heading{flex:0 1 auto;min-width:0}
  .ec-e-kick>.elementor-widget-divider{flex:1 1 24px;min-width:24px}
  .ec-e-kick>.elementor-widget-divider ~ .elementor-widget-divider{display:none}
}

/* 18 · Rückmeldung GF/Charlotte 08.10.2026 */
/* Kein Maus-Symbol mehr in der Bühnen-Fußzeile */
.ec-e-unten .elementor-heading-title::after{content:none;display:none}
/* Wortmarke größer: 40 px, mobil 34 px */
.elementor-widget.ec-logo img{height:40px}
@media(max-width:767px){.elementor-widget.ec-logo img{height:34px}}
/* Beweis auf den Leistungsseiten: nichts klebt, nichts schiebt sich über die Zahl */
.ec-kleber{position:relative;top:auto;padding:var(--r9) 0 var(--r7)}
.ec-ueberkleber{position:relative;z-index:auto}
@media(max-width:767px){.ec-kleber{padding:var(--r8) 0 var(--r6)}}
/* FCM-Logos ohne weiße Fläche — die Schilder bringen ihren eigenen Grund mit */
.ec-partnerflaeche.ec-fcm-flaeche{background:transparent;padding:0}
/* Keine Unterstreichungen — Links zeigen sich über Farbe und Hover */
.ec-inhalt a,.ec-textlink a,.ec-e-kick a{text-decoration:none!important}
.ec-inhalt a:hover,.ec-textlink a:hover,.ec-e-kick a:hover{text-decoration:none!important;opacity:.72}

/* 19 · Startseite nachgeschärft (Rückmeldung 08.10.2026) */
/* Bildöffnung: kürzerer Scrollweg */
@media(min-width:768px){.ec-oe{height:130svh}}
/* Kundenstimmen kompakt: Bild links, Zitat rechts */
.e-con.ec-stimme{--flex-direction:row;flex-direction:row;align-items:flex-start;gap:var(--r5)}
.ec-stimme>.ec-platzhalter{--width:42%;width:42%;flex:0 0 42%}
.ec-stimme>.ec-stimme-text{flex:1 1 0;min-width:0}
.ec-stimme .ec-zitat{margin:0}
@media(max-width:767px){
  .e-con.ec-stimme{--flex-direction:column;flex-direction:column}
  .ec-stimme>.ec-platzhalter{--width:100%;width:100%;flex:0 0 auto}
}
/* Partnerblock: zwei Spalten je Zeile */
.e-con.ec-zweispalt{--flex-direction:row;flex-direction:row;align-items:center;gap:var(--r7)}
.ec-zweispalt>.e-con:first-child{--width:36%;width:36%;flex:0 0 36%}
.ec-zweispalt>.e-con:last-child{flex:1 1 0;min-width:0}
@media(max-width:767px){
  .e-con.ec-zweispalt{--flex-direction:column;flex-direction:column;align-items:flex-start;gap:var(--r5)}
  .ec-zweispalt>.e-con:first-child,.ec-zweispalt>.e-con:last-child{--width:100%;width:100%;flex:0 0 auto}
}
/* Kundenlogowand als schlanke Zeile */
.e-con.ec-kundenwand{background:transparent;padding:0;align-items:stretch;gap:var(--r4)}
.ec-kundenwand .ec-platzhalter{--padding-top:20px;--padding-bottom:20px;padding-top:20px!important;padding-bottom:20px!important}
/* Textlink auf dunklem Grund */
.ec-auf-dunkel .ec-textlink a{color:var(--ec-weiss)}

/* 20 · Kundenvideos — Standbild 3:2, Video läuft im selben Rahmen */
.ec-video{margin:0;position:relative;aspect-ratio:3/2;width:100%;background:var(--ec-navy-tief);overflow:hidden}
.ec-video-start{all:unset;cursor:pointer;display:block;width:100%;height:100%;position:relative}
.ec-video-start img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.ec-video-start:hover img,.ec-video-start:focus-visible img{transform:scale(1.03)}
.ec-video-start:focus-visible{outline:2px solid var(--ec-gold);outline-offset:3px}
.ec-video-hinweis{position:absolute;left:0;bottom:0;background:var(--ec-navy-tief);color:var(--ec-weiss);
  font-size:calc(12px * var(--ec-f-display));letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:10px 14px}
.ec-video video{display:block;width:100%;height:100%;object-fit:contain;background:#000}

/* 21 · Überarbeitung nach Apple-Design-Prüfung (08.10.2026) */
/* Ausgeblendet, bis Inhalt freigegeben ist — im Editor sichtbar, aber blass */
.ec-ausgeblendet{display:none!important}
body.elementor-editor-active .ec-ausgeblendet{display:flex!important;opacity:.35;outline:1px dashed var(--ec-gold)}
/* Kopfleiste sofort da — Orientierung vor Effekt */
.ec-kopfleiste{opacity:1;transform:none;transition:min-height .35s cubic-bezier(.22,1,.36,1),top .2s linear}
/* Buttons reagieren beim Drücken, nicht erst beim Loslassen */
.elementor-widget.ec-btn .elementor-button:active,.elementor-widget.ec-btn-2 .elementor-button:active,
.ec-video-start:active img{transform:scale(.97);transition:transform .1s ease-out}
@media (prefers-reduced-motion: reduce){
  .elementor-widget.ec-btn .elementor-button:active,.elementor-widget.ec-btn-2 .elementor-button:active{transform:none}
}
/* Bildöffnung: kein Leerlauf nach dem Andocken */
@media(min-width:768px){.ec-oe{height:115svh}}
/* Hero mobil volle Breite */
@media(max-width:767px){.ec-buehne .e-con.ec-inhalt{--width:100%;width:100%}}
/* Fotos im 3:2-Rahmen */
.ec-bild-3zu2 img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
/* Team: solange eine Karte ausgeblendet ist, drei Spalten statt Lücke */
@media(min-width:1025px){.e-con.ec-team:has(> .ec-ausgeblendet){--e-con-grid-template-columns:repeat(3,1fr);grid-template-columns:repeat(3,1fr)}}
/* Kopfleiste und Menü ohne Unterstreichung */
.ec-kopfleiste a,.ec-kopfleiste a *,.elementor-location-header a{text-decoration:none!important}