/* GENERIERT von build/tools/css-elementor.py aus fx.css. Nicht von Hand ändern. */
/* emazings Effekt-Schicht: Startzustände und Module. Farben kommen aus den Kit-Variablen (--emz-*). */

/* Startzustände nur, wenn JS läuft */
html.fx-js .elementor .fx-reveal, html.fx-js .elementor .fx-split { visibility: hidden; }

/* fx-stage: gerahmte Bühne */
.elementor .fx-stage { --stage-inset: 0px; --stage-radius: 0px; margin-inline: var(--stage-inset); border-radius: var(--stage-radius); overflow: hidden; }
html.fx-js .elementor .fx-stage { --stage-inset: 16px; --stage-radius: 28px; }

/* fx-stack: Karten-Stapel (Tablet und Desktop sticky, Handy Liste). Grenze wie wide in fx.js */
.elementor .fx-stack { display: grid; gap: 20px; }
@media (min-width: 768px) and (min-height: 600px) {
  .elementor .fx-stack > *, .elementor .fx-stack > .elementor-widget-html > * { position: sticky; top: calc(96px + var(--i, 0) * 14px); transform-origin: 50% 0; will-change: transform; }
}

/* ===== fx-xray: Röntgenblick ===== */
.elementor .fx-xray { position: relative; }
.elementor .xray-sticky { display: grid; gap: 32px; grid-template-areas: "copy" "vis" "list"; }
.elementor .xray-copy { grid-area: copy; } .elementor .xray-visual { grid-area: vis; } .elementor .xray-list { grid-area: list; }
.elementor .xray-frame { --scan: 100%; position: relative; border: 1px solid var(--emz-raster); border-radius: 18px; background: var(--emz-flaeche-d); overflow: hidden; }
.elementor .xray-frame { border-color: var(--emz-linie-b); }
html.fx-js .elementor .xray-frame { --scan: 0%; }
.elementor .xray-bar { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--emz-raster); font: 500 12px/1 var(--emz-sans); color: var(--emz-gedaempft-hell); }
.elementor .xray-bar i { width: 9px; height: 9px; border-radius: 50%; background: var(--emz-raster); }
.elementor .xray-bar span { margin-left: 10px; padding: 6px 12px; border-radius: 99px; background: var(--emz-rahmen); flex: 1; max-width: 320px; }
.elementor .xray-bar em { margin-left: auto; font-style: normal; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; }
.elementor .xray-view { position: relative; aspect-ratio: 16 / 10.5; }
.elementor .xray-layer { position: absolute; inset: 0; padding: 6% 7%; }

/* Menschen-Ebene: Beispiel-Website der fiktiven Hautarztpraxis Bogenhausen (warm, ruhig, wie eine echte Praxis-Website).
   Maße in cqw, damit dieselbe Seite im Röntgenblick und als Hero-Ebene identisch skaliert. */
@font-face { font-family: "Cormorant Garamond"; src: url("fonts/CormorantGaramond-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("fonts/CormorantGaramond-500i.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
.elementor .xray-layer, .elementor .dl-design, .elementor .tg-site { container-type: inline-size; }
.elementor .xray-human, .elementor .dl-design, .elementor .tg-site { --xh-serif: "Cormorant Garamond", Georgia, serif; --xh-ink: #2B2420; --xh-mut: #6E625B; --xh-acc: #9A6F5B; --xh-btn: #34504A;
  background: #F8F4EF; color: var(--xh-ink); }
.elementor .xh-top { display: flex; justify-content: space-between; margin: -6.5cqw -7.5cqw 3.2cqw; padding: 1.4cqw 7.5cqw; background: #EFE6DD; font: 500 1.2cqw/1 var(--emz-sans); letter-spacing: .03em; color: var(--xh-mut); }
.elementor .xh-nav { display: flex; align-items: center; gap: 2.4cqw; font: 500 1.5cqw/1 var(--emz-sans); color: var(--xh-mut); white-space: nowrap; }
.elementor .xh-logo { flex: none; display: grid; place-items: center; width: 4.4cqw; height: 4.4cqw; border-radius: 50%; border: .16cqw solid var(--xh-acc); font: 500 1.8cqw/1 var(--xh-serif); color: var(--xh-acc); }
.elementor .xh-brand { margin-right: auto; display: grid; gap: .5cqw; }
.elementor .xh-brand b { font: 500 2.2cqw/1 var(--xh-serif); color: var(--xh-ink); }
.elementor .xh-brand small { font: 500 1.05cqw/1 var(--emz-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--xh-acc); }
.elementor .xh-btn { display: inline-flex; align-items: center; padding: 1.25cqw 2.1cqw; border-radius: 99px; background: var(--xh-btn); color: #fff; font: 600 1.4cqw/1 var(--emz-sans); white-space: nowrap; }
.elementor .xh-btn.ghost { background: transparent; color: var(--xh-btn); box-shadow: inset 0 0 0 .14cqw var(--xh-btn); }
.elementor .xh-hero { display: grid; grid-template-columns: 1.12fr .88fr; gap: 4.5cqw; margin-top: 4.6cqw; align-items: center; }
.elementor .xh-eyebrow { display: block; margin-bottom: 1.6cqw; font: 600 1.15cqw/1 var(--emz-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--xh-acc); }
.elementor .xh-h { margin: 0 0 2cqw; font: 500 5.6cqw/1 var(--xh-serif); letter-spacing: -.01em; color: var(--xh-ink); }
.elementor .xh-h em { font-style: italic; color: var(--xh-acc); }
.elementor .xh-p { margin: 0 0 2.6cqw; font: 400 1.6cqw/1.5 var(--emz-sans); color: var(--xh-mut); }
.elementor .xh-ctas { display: flex; flex-wrap: wrap; gap: 1.3cqw; }
.elementor .xh-photo { position: relative; margin: 0; aspect-ratio: 1 / 1.1; border-radius: 2.4cqw; overflow: hidden; background: #E9DFD6; }
.elementor .elementor-widget-html:not(.elementor-widget-text-editor):not(.elementor-widget-theme-post-content) .xh-photo { margin: 0; }
.elementor .xh-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; display: block; }
.elementor .xh-photo figcaption { position: absolute; left: 1.6cqw; right: 1.6cqw; bottom: 1.6cqw; display: grid; gap: .6cqw; padding: 1.4cqw 1.8cqw; border-radius: 1.6cqw; background: rgba(248, 244, 239, .94); font: 400 1.15cqw/1.2 var(--emz-sans); color: var(--xh-mut); }
.elementor .xh-photo figcaption b { font: 500 1.75cqw/1.05 var(--xh-serif); color: var(--xh-ink); }
.elementor .xh-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2cqw; margin-top: 4.4cqw; }
.elementor .xh-tiles div { display: grid; gap: .8cqw; padding: 2.1cqw; border-radius: 1.8cqw; background: #fff; box-shadow: 0 .2cqw .8cqw rgba(43, 36, 32, .07); }
.elementor .xh-tiles svg { width: 3.2cqw; height: 3.2cqw; fill: none; stroke: var(--xh-acc); stroke-width: 1.5; stroke-linecap: round; }
.elementor .xh-tiles b { font: 500 2cqw/1.05 var(--xh-serif); color: var(--xh-ink); }
.elementor .xh-tiles span { font: 400 1.2cqw/1.35 var(--emz-sans); color: var(--xh-mut); }

/* Maschinen-Ebene: dieselbe Seite, wie Google und KI sie lesen */
.elementor .xray-machine { background: var(--emz-rahmen); color: var(--emz-akzent-hell); font: 400 clamp(8px, .9vw, 12px)/1.35 var(--emz-sans);
  background-image: linear-gradient(var(--emz-raster) 1px, transparent 1px), linear-gradient(90deg, var(--emz-raster) 1px, transparent 1px);
  background-size: 32px 32px; background-position: -1px -1px;
  clip-path: inset(0 0 calc(100% - var(--scan)) 0); }
.elementor .xm-box { position: absolute; border: 1px dashed var(--emz-akzent-hell); border-radius: 8px; padding: 6px 8px; background: rgba(4, 25, 24, .86); color: var(--emz-akzent-hell); opacity: .35; transition: opacity .4s, border-color .4s, color .4s; }
.elementor .xm-box.is-on { opacity: 1; border-style: solid; }
.elementor .xm-box b { display: block; font-weight: 500; color: var(--emz-text-hell); }
.elementor .xm-box .ok { color: var(--emz-signal); }
.elementor .xray-scanline { position: absolute; left: 0; right: 0; top: var(--scan); height: 2px; background: var(--emz-signal); transform: translateY(-1px); pointer-events: none; }
.elementor .xray-scanline::after { content: "SCAN " attr(data-label); position: absolute; right: 12px; top: 8px; font: 500 10px/1 var(--emz-sans); letter-spacing: .14em; color: var(--emz-signal); }
html:not(.fx-js) .elementor .xray-scanline, .elementor .fx-xray.is-done .xray-scanline { opacity: 0; transition: opacity .5s; }
html:not(.fx-js) .elementor .xm-box { opacity: 1; }

.elementor .xray-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; counter-reset: xs; }
.elementor .xray-steps li { counter-increment: xs; display: grid; grid-template-columns: 44px 1fr; gap: 0 12px; padding: 12px 0; border-top: 1px solid var(--emz-raster); color: var(--emz-gedaempft-hell); transition: color .4s; }
.elementor .xray-steps li::before { content: counter(xs) "."; font: 500 12px/1.6 var(--emz-sans); color: var(--emz-gedaempft-hell); }
.elementor .xray-steps b { color: var(--emz-text-hell); font-weight: 500; }
.elementor .fx-xray.is-live .xray-steps li { opacity: .45; transition: opacity .4s; }
.elementor .fx-xray.is-live .xray-steps li.is-on { opacity: 1; }
.elementor .fx-xray.is-live .xray-steps li.is-on::before { color: var(--emz-signal); }
.elementor .xray-score { margin-top: 24px; font: 400 14px/1.5 var(--emz-sans); color: var(--emz-gedaempft-hell); }
.elementor .xray-score strong { font: 500 15px/1 var(--emz-sans); color: var(--emz-text-hell); }

/* Pin auf Tablet und Desktop (Grenze wie wide in fx.js), auf dem Handy kein Pin */
@media (min-width: 768px) and (min-height: 600px) {
  .elementor .fx-xray { min-height: 320vh; }
  .elementor .xray-sticky { position: sticky; top: 0; min-height: 100vh; align-content: center; padding-block: 96px 32px; }
}
/* Querformat und Desktop: Text links, Grafik rechts */
@media (min-width: 1025px) and (min-height: 600px), (min-width: 768px) and (min-height: 600px) and (orientation: landscape) {
  .elementor .xray-sticky { grid-template-columns: minmax(300px, 1fr) 1.45fr; grid-template-areas: "copy vis" "list vis"; grid-template-rows: auto 1fr; column-gap: clamp(32px, 4vw, 56px); row-gap: 24px; }
  .elementor .xray-visual { align-self: center; justify-self: end; }
  html.fx-js .elementor .xray-sticky .xray-visual { width: min(100%, calc((100vh - 220px) * 1.52)); }
  /* Bühne höher als der Bildschirm: Grafik sitzt unten, damit der Header sie nie verdeckt */
  .elementor .xray-sticky.is-over .xray-visual { align-self: end; }
}
/* Tablet hochkant: Grafik in voller Breite, Schritte zweispaltig darunter, alles auf 1 Bildschirm */
@media (min-width: 768px) and (max-width: 1024px) and (min-height: 600px) and (orientation: portrait) {
  html.fx-js .elementor .xray-sticky { gap: 20px; padding-block: 88px 20px; }
  html.fx-js .elementor .xray-copy .lead { max-width: none; margin-bottom: 0; }
  /* Grafik so breit, wie die Höhe erlaubt: Bildfläche 16:10,5 plus Leiste und Hinweis */
  html.fx-js .elementor .xray-sticky .xray-visual { width: min(100%, calc(152vh - 960px)); min-width: min(100%, 520px); justify-self: center; }
  .elementor .xray-steps { grid-template-columns: 1fr 1fr; column-gap: 32px; }
  html.fx-js .elementor .xray-steps li { padding-block: 9px; font-size: 15px; line-height: 1.45; }
  .elementor .xray-score { margin-top: 10px; }
}
/* Geringe Bildschirmhöhe im Pin: Schritte dichter */
@media (min-width: 768px) and (min-height: 600px) and (max-height: 900px) {
  .elementor .xray-sticky { padding-block: 88px 20px; row-gap: 16px; }
  .elementor .xray-copy h2 { margin-bottom: 14px; font-size: clamp(38px, min(4.4vw, 7.4vh), 62px); }
  .elementor .xray-steps li { padding-block: 8px; font-size: 15px; line-height: 1.45; }
  .elementor .xray-score { margin-top: 12px; }
}

/* ===== fx-toggle: Umschalter ===== */
.elementor .tg-switch { display: none; }
.elementor .fx-toggle.is-interactive .tg-switch { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--emz-raster); border-radius: 99px; background: var(--emz-flaeche-d); }
.elementor .tg-switch button { min-height: 44px; padding: 0 20px; border: 0; border-radius: 99px; background: transparent; color: var(--emz-gedaempft-hell); font: 500 15px/1 var(--emz-sans); cursor: pointer; }
.elementor .tg-switch button[aria-pressed="true"] { background: var(--emz-btn-2, #00ABA4); color: var(--emz-text-dunkel, #03161A); font-weight: 600; }

.elementor .tg-panels { display: grid; gap: 24px; margin-top: 28px; }
.elementor .tg-panel h3 { margin: 0 0 12px; font: 500 12px/1 var(--emz-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--emz-gedaempft-hell); }
.elementor .fx-toggle.is-interactive .tg-panel h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.elementor .tg-panel dl { margin: 0; display: grid; border-top: 1px solid var(--emz-raster); }
.elementor .tg-panel dl > div, .elementor .tg-panel dl > .elementor-widget-html > div { display: grid; grid-template-columns: 150px 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--emz-raster); }
.elementor .tg-panel dt { font: 500 12px/1.6 var(--emz-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--emz-gedaempft-hell); }
.elementor .tg-panel dd { margin: 0; font-size: 18px; line-height: 1.45; }
.elementor .tg-panel[data-variant="stange"] dd { color: var(--emz-gedaempft-hell); }
.elementor .tg-panel[data-variant="stange"] dd::before { content: "×"; margin-right: 10px; color: var(--emz-gedaempft-hell); }
.elementor .tg-panel[data-variant="emazings"] dd::before { content: "✓"; margin-right: 10px; color: var(--emz-signal); }
@media (max-width: 600px) { .elementor .tg-panel dl > div, .elementor .tg-panel dl > .elementor-widget-html > div { grid-template-columns: 1fr; gap: 4px; } }

/* Barrierefreiheit und Fallbacks */
@media (prefers-reduced-motion: reduce) {
  html.fx-js .elementor .fx-reveal, html.fx-js .elementor .fx-split { visibility: visible; }
  .elementor .xray-frame { --scan: 100% !important; }
  .elementor .xray-scanline { display: none; }
  .elementor .xm-box { opacity: 1 !important; }
  .elementor .fx-stack > *, .elementor .fx-stack > .elementor-widget-html > * { position: static !important; }
}
@media (pointer: coarse) { .elementor .elementor-button { min-height: 44px; } }

/* ===== fx-depth: Website in 3 Ebenen (Design, Struktur, Daten), Hero-Grafik ===== */
.elementor .fx-depth { position: relative; perspective: 1800px; height: clamp(300px, 40vw, 560px); --gap: 56px; --tx: 0deg; --ty: 0deg; }
.elementor .depth-stage { position: absolute; left: 50%; top: 46%; width: min(540px, 80%); aspect-ratio: 16 / 11; transform-style: preserve-3d;
  transform: translate(-50%, -50%) rotateX(calc(56deg + var(--ty))) rotateZ(calc(-36deg + var(--tx))); }
.elementor .dl { position: absolute; inset: 0; border-radius: 16px; transform: translateZ(calc(var(--z) * var(--gap))); overflow: hidden; }
.elementor .dl-data { --z: 0; border: 1px solid var(--emz-linie-b); padding: 7% 8%; font: 400 clamp(8px, .8vw, 11px)/1.7 var(--emz-sans); color: var(--emz-akzent-hell);
  background: linear-gradient(var(--emz-linie-a) 1px, transparent 1px) 0 0 / 24px 24px, linear-gradient(90deg, var(--emz-linie-a) 1px, transparent 1px) 0 0 / 24px 24px, rgba(4, 25, 24, .94); }
.elementor .dl-data b { color: var(--emz-text-hell); font-weight: 500; }
.elementor .dl-struct { --z: 1; border: 1px dashed rgba(0, 171, 164, .7); background: rgba(8, 43, 42, .28); }
.elementor .dl-struct i { position: absolute; border: 1px solid rgba(0, 171, 164, .75); border-radius: 6px; background: rgba(0, 171, 164, .07); }
.elementor .dl-struct em { position: absolute; font: 500 clamp(7px, .7vw, 10px)/1 var(--emz-sans); font-style: normal; letter-spacing: .08em; color: var(--emz-signal); }
.elementor .dl-design { --z: 2; padding: 6% 7%; border: 1px solid rgba(255, 255, 255, .8); overflow: hidden; }
.elementor .dl-design::after { content: ""; position: absolute; left: 0; right: 0; height: 30%; top: -30%; pointer-events: none;
  background: linear-gradient(to bottom, transparent, rgba(0, 171, 164, .35) 92%, var(--emz-signal-2) 100%); animation: depthscan 5.5s cubic-bezier(.5, 0, .5, 1) infinite; }
@keyframes depthscan { 0% { top: -30%; } 70%, 100% { top: 100%; } }
/* Lichtschienen zwischen den Ebenen an den 4 Ecken */
.elementor .rail { position: absolute; width: 1px; height: calc(var(--gap) * 2); transform-origin: 50% 0; transform: rotateX(90deg);
  background: linear-gradient(to bottom, rgba(0, 171, 164, .9), rgba(0, 171, 164, .15)); }
.elementor .rail:nth-of-type(1) { left: 0; top: 0; } .elementor .rail:nth-of-type(2) { right: 0; top: 0; } .elementor .rail:nth-of-type(3) { left: 0; top: 100%; } .elementor .rail:nth-of-type(4) { right: 0; top: 100%; }
.elementor .depth-legend { position: absolute; right: 0; bottom: 0; display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; font: 500 11px/1.3 var(--emz-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--emz-gedaempft-hell); }
.elementor .depth-legend li { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 9px; background: rgba(4, 25, 24, .72); border: 1px solid var(--emz-linie-a); }
.elementor .depth-legend b { color: var(--emz-orange-text, #FF7A2E); font-weight: 500; }
@media (max-width: 1024px) {
  .elementor .fx-depth { --gap: 38px; height: clamp(300px, 78vw, 440px); }
  .elementor .depth-stage { width: min(420px, 74%); top: 42%; }
  .elementor .depth-legend { position: static; margin-top: -8px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .elementor .dl-design::after { animation: none; display: none; } }
.elementor .hero-vis { position: relative; }
/* Hero-3D: Tacho aus Petrol-Metall unter den Ebenen (Tablet und Desktop, nach load). Ohne WebGL bleibt die CSS-Fassung. */
.elementor .fx-3d-canvas { position: absolute; left: 50%; top: 46%; translate: -50% -50%; z-index: 0; pointer-events: none; opacity: 0; transition: opacity 1.2s ease;
  -webkit-mask-image: radial-gradient(closest-side, #000 62%, transparent 100%); mask-image: radial-gradient(closest-side, #000 62%, transparent 100%); }
.elementor .fx-3d.is-3d .fx-3d-canvas { opacity: 1; }
.elementor .fx-3d > .fx-depth, .elementor .fx-3d > .elementor-widget-html > .fx-depth { position: relative; z-index: 1; }
.elementor .xray-bar span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.elementor .xray-sticky > *, .elementor .xray-sticky > .elementor-widget-html > * { min-width: 0; }

/* ===== fx-toggle Bühne: gleiche Beispielseite, 2 Ergebnisse (Beweis zeigen) ===== */
.elementor .tg-lead { margin: 16px 0 0; max-width: 46ch; }
.elementor .tg-stage { display: grid; gap: 24px; margin-top: 32px; align-items: stretch; }
@media (min-width: 980px) { .elementor .tg-stage { grid-template-columns: 1.15fr .85fr; } }
.elementor .tg-stage > *, .elementor .tg-stage > .elementor-widget-html > * { min-width: 0; }
.elementor .tg-frame { position: relative; border: 1px solid var(--emz-linie-b); border-radius: 18px; background: var(--emz-flaeche-d); overflow: hidden;
  box-shadow: 0 2px 4px rgba(1, 9, 9, .35), 0 24px 48px -20px rgba(1, 9, 9, .8); }
.elementor .tg-site { position: relative; padding: 5.5% 6.5% 7%; }
.elementor .tg-toast { position: absolute; right: 4%; top: 15%; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px;
  font: 500 13px/1.35 var(--emz-sans); background: #fff; color: var(--xh-mut); box-shadow: 0 10px 30px -10px rgba(43, 36, 32, .35); transition: transform .5s ease, background .5s ease; }
.elementor .tg-toast b { display: block; color: var(--xh-ink); }
.elementor .tg-toast::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: #C9BFB6; }
.elementor .fx-toggle[data-active="emazings"] .tg-toast::before { background: var(--emz-cta, #FF5F00); box-shadow: 0 0 0 0 rgba(255, 95, 0, .55); animation: tg-ping 1.8s ease-out infinite; }
@keyframes tg-ping { to { box-shadow: 0 0 0 10px rgba(255, 95, 0, 0); } }

.elementor .tg-meter { display: grid; align-content: start; gap: 4px; padding: clamp(20px, 2.6vw, 32px); }
.elementor .tg-meter-h { margin: 0 0 8px; font: 600 13px/1.4 var(--emz-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--emz-gedaempft-hell); }
.elementor .tg-meter ul { list-style: none; margin: 0; padding: 0; display: grid; }
.elementor .tg-m { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; padding: 14px 0; border-bottom: 1px solid var(--emz-raster); }
.elementor .tg-k { font-size: 15px; line-height: 1.35; color: var(--emz-text-hell); }
.elementor .tg-v { grid-row: span 2; align-self: center; text-align: right; font: 400 clamp(30px, 2.8vw, 40px)/1 var(--emz-head); letter-spacing: .01em; white-space: nowrap; }
.elementor .tg-bar { position: relative; height: 6px; border-radius: 99px; background: var(--emz-rahmen); overflow: hidden; }
.elementor .tg-bar i { position: absolute; inset: 0 auto 0 0; width: var(--vs); border-radius: inherit; background: var(--emz-gedaempft-hell); transition: width 1.1s cubic-bezier(.2, .7, .2, 1), background .6s ease; }
.elementor .fx-toggle[data-active="emazings"] .tg-bar i { width: var(--ve); background: linear-gradient(90deg, var(--emz-akzent), var(--emz-btn-1)); }
.elementor .fx-toggle[data-active="emazings"] .tg-v { color: var(--emz-akzent-hell); }
.elementor .fx-toggle[data-active="stange"] .tg-v { color: var(--emz-gedaempft-hell); }
.elementor .tg-m small { grid-column: 1 / -1; font-size: 13px; color: var(--emz-gedaempft-hell); }
.elementor .tg-verdict { margin: 18px 0 0; font: 400 clamp(28px, 2.6vw, 36px)/1 var(--emz-head); letter-spacing: .012em; text-transform: uppercase; }
.elementor .fx-toggle[data-active="emazings"] .tg-verdict { color: var(--emz-akzent-hell); }
.elementor .tg-note { margin: 10px 0 0; font-size: 12px; color: var(--emz-gedaempft-hell); }
/* Ohne JavaScript stehen beide Werte nebeneinander, mit JavaScript nur der aktive */
.elementor .v + .v::before { content: " / "; color: var(--emz-gedaempft-hell); }
.elementor .fx-toggle.is-interactive .v + .v::before { content: none; }
.elementor .fx-toggle.is-interactive[data-active="stange"] .v-emazings, .elementor .fx-toggle.is-interactive[data-active="emazings"] .v-stange { display: none; }
@media (max-width: 760px) { .elementor .tg-toast { position: static; margin-top: 4%; font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { .elementor .tg-bar i { transition: none; } .elementor .tg-toast::before { animation: none !important; } }
.elementor .tg-frame { display: flex; flex-direction: column; }
.elementor .tg-site { flex: 1; }
.elementor .tg-m { grid-template-columns: 1fr auto; }
.elementor .tg-v { grid-row: auto; }
.elementor .tg-bar { grid-column: 1 / -1; }

/* ===== fx-scrubvideo: Video über dem Poster-Bild, Tablet und Desktop ===== */
.elementor .fx-scrubvideo { position: relative; }
.elementor .fx-scrubvideo video { position: absolute; inset: 10px; width: calc(100% - 20px); height: calc(100% - 20px); object-fit: cover; object-position: 70% 40%;
  border-radius: calc(var(--r, 24px) - 8px); opacity: 0; transition: opacity .6s ease; pointer-events: none; }
.elementor .fx-scrubvideo.is-ready video { opacity: 1; }
.elementor .fx-scrubvideo.is-failed video { display: none; }
.elementor .fx-scrubvideo > figcaption, .elementor .fx-scrubvideo > .elementor-widget-html > figcaption, .elementor .fx-scrubvideo > .ai-note, .elementor .fx-scrubvideo > .elementor-widget-html > .ai-note { z-index: 2; }
@media (max-width: 767px), (max-height: 599px), (prefers-reduced-motion: reduce) { .elementor .fx-scrubvideo video { display: none; } }

/* fx-marquee: Spalten laufen langsam gegenläufig (Beweis zeigen). Nur mit JS aktiv, sonst statisches Raster */
.elementor .fx-marquee.is-loop { height: clamp(560px, 72vh, 760px); overflow: hidden;
  -webkit-mask-image: linear-gradient(transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(transparent, #000 12%, #000 88%, transparent); }
.elementor .fx-marquee.is-loop > *, .elementor .fx-marquee.is-loop > .elementor-widget-html > * { min-width: 0; overflow: hidden; }
.elementor .fx-marquee.is-loop .rv-track { animation: fx-marquee var(--fx-dur, 90s) linear infinite; will-change: transform; }
.elementor .fx-marquee.is-loop > :nth-child(even) .rv-track, .elementor .fx-marquee.is-loop > .elementor-widget-html > :nth-child(even) .rv-track { animation-direction: reverse; }
.elementor .fx-marquee.is-loop > :hover .rv-track, .elementor .fx-marquee.is-loop > .elementor-widget-html > :hover .rv-track, .elementor .fx-marquee.is-loop > :focus-within .rv-track, .elementor .fx-marquee.is-loop > .elementor-widget-html > :focus-within .rv-track, .elementor .fx-marquee.is-paused .rv-track, .elementor .fx-marquee.is-off .rv-track { animation-play-state: paused; }
.elementor .fx-marquee.is-loop > .is-empty, .elementor .fx-marquee.is-loop > .elementor-widget-html > .is-empty { display: none; }
@keyframes fx-marquee { to { transform: translate3d(0, -50%, 0); } }
@media (prefers-reduced-motion: reduce) { .elementor .fx-marquee .rv-track { animation: none !important; } }

/* fx-logobar: Kundenlogos laufen langsam von links nach rechts (Beweis zeigen). Ohne JS: umbrechende Reihe */
.elementor .fx-logobar { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.elementor .fx-logobar > ul, .elementor .fx-logobar > .elementor-widget-html > ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 28px 56px; margin: 0; padding: 0; list-style: none; }
.elementor .fx-logobar.is-loop > ul, .elementor .fx-logobar.is-loop > .elementor-widget-html > ul { flex-wrap: nowrap; justify-content: flex-start; width: max-content; animation: fx-logobar var(--fx-dur, 80s) linear infinite; }
.elementor .fx-logobar.is-loop:hover > ul, .elementor .fx-logobar.is-loop:hover > .elementor-widget-html > ul, .elementor .fx-logobar.is-loop:focus-within > ul, .elementor .fx-logobar.is-loop:focus-within > .elementor-widget-html > ul, .elementor .fx-logobar.is-off > ul, .elementor .fx-logobar.is-off > .elementor-widget-html > ul { animation-play-state: paused; }
.elementor .fx-logobar li { flex: none; }
.elementor .fx-logobar li + li { margin: 0; }
@keyframes fx-logobar { from { transform: translate3d(-50%, 0, 0); } to { transform: translate3d(0, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .elementor .fx-logobar > ul, .elementor .fx-logobar > .elementor-widget-html > ul { animation: none !important; } }

/* fx-wof: Wall of Fame. Gekippte Wand richtet sich beim Scrollen auf; Hover scrollt die ganze Startseite im Fenster */
.elementor .fx-wof { perspective: 1800px; }
.elementor .wof-grid { display: grid; gap: clamp(14px, 1.8vw, 24px); grid-template-columns: repeat(2, minmax(0, 1fr)); transform-origin: 50% 0; }
@media (min-width: 760px) { .elementor .wof-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .elementor .wof-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.elementor .wof-card { display: grid; gap: 10px; text-decoration: none; color: inherit; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.elementor .wof-frame, .elementor .wof-win { display: block; }
.elementor .wof-frame { border-radius: 12px; overflow: hidden; border: 1px solid rgba(0, 171, 164, .3); background: #041918; }
.elementor .wof-bar { display: flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; background: #0B3736; border-bottom: 1px solid rgba(0, 171, 164, .2); }
.elementor .wof-bar i { width: 6px; height: 6px; border-radius: 50%; background: rgba(162, 180, 178, .45); }
.elementor .wof-bar span { margin-left: 8px; font: 500 10px/1 var(--emz-sans, sans-serif); color: var(--emz-gedaempft-hell, #A2B4B2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.elementor .wof-win { position: relative; aspect-ratio: 16 / 10; overflow: hidden; container-type: size; }
.elementor .wof-win img { display: block; width: 100%; height: auto; transition: transform var(--d, 6s) cubic-bezier(.45, 0, .55, 1); }
.elementor .wof-card:hover .wof-win img, .elementor .wof-card:focus-visible .wof-win img { transform: translateY(calc(-100% + 100cqh)); transition-duration: var(--d, 6s); }
.elementor .wof-card:not(:hover) .wof-win img { transition-duration: .9s; }
.elementor .wof-meta { display: grid; gap: 2px; padding-inline: 2px; }
.elementor .wof-meta b { font: 600 14px/1.3 var(--emz-sans, sans-serif); color: var(--emz-text-hell, #F2F7F6); }
.elementor .wof-meta small { font: 400 12.5px/1.35 var(--emz-sans, sans-serif); color: var(--emz-gedaempft-hell, #A2B4B2); }
@media (hover: hover) and (min-width: 1025px) { .elementor .wof-card:hover { transform: translateY(-8px) scale(1.035); } }
.elementor .fx-wof.is-collapsed .wof-card.is-extra { display: none; }
@media (prefers-reduced-motion: reduce) { .elementor .wof-win img { transition: none !important; } .elementor .wof-card:hover .wof-win img { transform: none; } }
.elementor .fx-wof .on-touch { display: none; }
@media (hover: none) { .elementor .fx-wof .on-hover { display: none; } .elementor .fx-wof .on-touch { display: inline; } }
/* Ohne JS und bei reduzierter Bewegung kein leerer Pin-Scrollweg */
html:not(.fx-js) .elementor .fx-xray { min-height: 0; }