/*! Copyright (c) 2026 copuNET GmbH · https://copunet.de/
 * Eigene Entwicklung fuer copuNET GmbH. Weiterverwendung eigenstaendig lizenzierbarer Bestandteile nur mit schriftlicher Zustimmung; gesetzliche Rechte und geltende Drittlizenzen bleiben unberuehrt. */
/* COPUNET · Technische SVG-Hintergründe.
   Farbe, Deckkraft, Größe und Position: Elementor · Stil · Technische Linien. */

/* === Hauptzeichnung === */
/* Nur die Dekoration beschneiden; Inhalt, Schatten und Menüs bleiben frei. */
.elementor .copunet-tech-enabled > .copunet-hauptlinien {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
}


.elementor .copunet-tech-enabled {
  isolation: isolate;
}

.elementor .copunet-tech-enabled > .copunet-hauptlinien:after {
  transform: translate(var(--copunet-tech-offset_x,0%),var(--copunet-tech-offset_y,0%)) scale(var(--copunet-tech-zoom,1));
  transform-origin: right center;
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  right: 0;
  top: 0;
  bottom: 0;
  width: var(--copunet-tech-breite,min(38%,520px));
  background-color: var(--copunet-tech-color,#ff6238);
  opacity: var(--copunet-tech-opacity,.16);
  /* SVG und vierseitiger Auslauf teilen dieselbe Zeichenfläche. */
  mask-image: var(--copunet-tech-grafik,url('technical/technical-lines.svg')), linear-gradient(to right,transparent,#000 var(--copunet-tech-randfade,10%),#000 calc(100% - var(--copunet-tech-randfade,10%)),transparent), linear-gradient(to bottom,transparent,#000 var(--copunet-tech-randfade,10%),#000 calc(100% - var(--copunet-tech-randfade,10%)),transparent);
  mask-position: right bottom, center, center;
  mask-size: var(--copunet-tech-massstab,auto 100%), 100% 100%, 100% 100%;
  mask-repeat: no-repeat;
  mask-composite: intersect;
}

/* Weicher Auslauf nur der dekorativen Ebenen, über Elementor regelbar. */
.elementor .copunet-tech-enabled > .copunet-hauptlinien,
.elementor .copunet-tech-enabled > .copunet-linienebenen {
  mask-image: linear-gradient(to right,transparent,#000 var(--copunet-tech-randfade,10%),#000 calc(100% - var(--copunet-tech-randfade,10%)),transparent),linear-gradient(to bottom,transparent,#000 var(--copunet-tech-randfade,10%),#000 calc(100% - var(--copunet-tech-randfade,10%)),transparent);
  mask-composite: intersect;
}
/* === Ausrichtung und responsive Standardwerte === */
.elementor .copunet-tech-side-left > .copunet-hauptlinien:after {
  right: auto;
  left: 0;
  transform: translate(var(--copunet-tech-offset_x,0%),var(--copunet-tech-offset_y,0%)) scale(var(--copunet-tech-zoom,1)) scaleX(-1);
  transform-origin: center center;
}

@media(max-width:767px) {
.elementor .copunet-tech-enabled > .copunet-hauptlinien:after {
  width: var(--copunet-tech-breite,28%);
}
}

/* === Zusätzliche Zeichnungsebenen · Darstellung über Elementor === */
:where(.copunet-tech-enabled) {
  --copunet-tech-zoom: 1;
  --copunet-tech-offset_x: 0%;
  --copunet-tech-offset_y: 0%;
}

.elementor .copunet-tech-enabled > .copunet-linienebenen {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.elementor .copunet-linienebene {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--copunet-ebene-links,auto);
  right: var(--copunet-ebene-rechts,0);
  width: var(--copunet-ebene-width,38%);
  opacity: var(--copunet-ebene-deckkraft,.06);
  transform: translate(var(--copunet-ebene-offset_x,0%),var(--copunet-ebene-offset_y,0%)) scale(var(--copunet-ebene-zoom,1));
  transform-origin: var(--copunet-ebene-ursprung,right center);
  pointer-events: none;
}

.elementor .copunet-linienebene::after {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--copunet-ebene-farbe,#ff6238);
  mask-image: var(--copunet-ebene-grafik,none), linear-gradient(to right,transparent,#000 var(--copunet-tech-randfade,10%),#000 calc(100% - var(--copunet-tech-randfade,10%)),transparent), linear-gradient(to bottom,transparent,#000 var(--copunet-tech-randfade,10%),#000 calc(100% - var(--copunet-tech-randfade,10%)),transparent);
  mask-position: center;
  mask-size: contain, 100% 100%, 100% 100%;
  mask-repeat: no-repeat;
  mask-composite: intersect;
  transform: scaleX(var(--copunet-ebene-spiegel,1));
  pointer-events: none;
}

/* === Motivbibliothek · Industrie und IT === */
.elementor .copunet-tech-grafik-feinraster {
  --copunet-tech-grafik: url('technical/linien-feinraster.svg');
}

.elementor .copunet-tech-grafik-signalwege {
  --copunet-tech-grafik: url('technical/linien-signalwege.svg');
}

.elementor .copunet-tech-grafik-achsenfeld {
  --copunet-tech-grafik: url('technical/linien-achsenfeld.svg');
}

.elementor .copunet-tech-grafik-tragwerk {
  --copunet-tech-grafik: url('technical/technical-lines-tragwerk.svg');
}

.elementor .copunet-tech-grafik-maschinenbau {
  --copunet-tech-grafik: url('technical/technical-lines-maschinenbau.svg');
}

.elementor .copunet-tech-grafik-stahltragwerk {
  --copunet-tech-grafik: url('technical/zeichnung-stahltragwerk.svg?v=20261025-4');
}

.elementor .copunet-tech-grafik-industrieanlage {
  --copunet-tech-grafik: url('technical/zeichnung-industrieanlage.svg');
}

.elementor .copunet-tech-grafik-skyline {
  --copunet-tech-grafik: url('technical/zeichnung-skyline.svg');
}

.elementor .copunet-tech-grafik-skyline-panorama {
  --copunet-tech-grafik: url('technical/referenzen-skyline.svg');
}

.elementor .copunet-tech-grafik-referenzen-stahltragwerk {
  --copunet-tech-grafik: url('technical/referenzen-stahlbuehne.svg');
}

.elementor .copunet-tech-grafik-it-server {
  --copunet-tech-grafik: url('technical/it-server.svg');
}

.elementor .copunet-tech-grafik-it-netzwerk {
  --copunet-tech-grafik: url('technical/it-netzwerk.svg');
}

.elementor .copunet-tech-grafik-it-cloud {
  --copunet-tech-grafik: url('technical/it-cloud.svg');
}

.elementor .copunet-tech-grafik-it-security {
  --copunet-tech-grafik: url('technical/it-security.svg');
}

.elementor .copunet-tech-grafik-it-telefonie {
  --copunet-tech-grafik: url('technical/it-telefonie.svg');
}

.elementor .copunet-tech-grafik-it-api {
  --copunet-tech-grafik: url('technical/it-api.svg');
}

.elementor .copunet-tech-grafik-leiterbahnen { --copunet-tech-grafik: url('technical/linien-leiterbahnen.svg'); }

.elementor .copunet-tech-grafik-binaer { --copunet-tech-grafik: url('technical/linien-binaer.svg'); }

.elementor .copunet-tech-grafik-binaer-stroeme { --copunet-tech-grafik: url("technical/linien-binaer-stroeme.svg"); }