/*! 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 · Gemeinsame Komponenten und Effekte.
   Darstellung und Layoutwerte werden über das Grafik-Widget in Elementor gepflegt.
   Grafikstruktur, Kartenpfeile und Buttonbewegungen sind hier nach Aufgaben geordnet. */
/* === Zeichenfläche und dekorative SVG-Ebene === */
.copunet-grafik-flaeche {
    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
}
.copunet-grafik canvas, .copunet-zeichnung, .copunet-zeichnung svg {
    display: block;
    width: 100%;
    height: 100%;
}
.copunet-zeichnung {
    pointer-events: none;
    position: absolute;
    inset: 0;
    color: var(--copunet-farbe);
}
/* === Widget-eigene Auswahl und Bedienhinweis === */
.copunet-grafik-auswahl {
    display: flex;
    flex-wrap: wrap;
    gap: .5em;
}
.copunet-grafik-auswahl button {
    flex: 1 1 140px;
    cursor: pointer;
    background: transparent;
    border: 1px solid currentColor;
    color: inherit;
    padding: 1em;
    text-align: left;
    font: inherit;
}
.copunet-grafik-auswahl button:hover, .copunet-grafik-auswahl button:focus, .copunet-grafik-auswahl button:active {
    background-color: transparent;
    color: inherit;
    text-decoration: none;
}
.copunet-grafik-hinweis {
    margin-block: 1em 0;
    font-size: .75em;
}
/* === Fokus und Drehen === */
.copunet-grafik button:focus-visible {
    outline: 2px solid var(--copunet-farbe);
    outline-offset: 3px;
}
.copunet-grafik[data-drehbar="true"] canvas {
    cursor: grab;
    touch-action: pan-y;
}
.copunet-grafik[data-drehbar="true"] canvas:active {
    cursor: grabbing;
}
/* === Kartenpfeile · Farben, Größen und Bewegung kommen aus Elementor === */
.copunet-kartenpfeile-yes .e-n-tabs-heading > .e-n-tab-title::after {
    content: '';
    display: block;
    flex: 0 0 var(--copunet-pfeilgroesse, 22px);
    width: var(--copunet-pfeilgroesse, 22px);
    height: var(--copunet-pfeilgroesse, 22px);
    margin-inline-start: auto;
    background: var(--copunet-pfeil-normal, currentColor);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19L19 5M7 5h12v12' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='square'/%3E%3C/svg%3E") center / contain no-repeat;
    transition: transform var(--copunet-pfeildauer, 220ms) ease;
}
.copunet-kartenpfeile-yes .e-n-tabs-heading > .e-n-tab-title:hover::after, .copunet-kartenpfeile-yes .e-n-tabs-heading > .e-n-tab-title:focus-visible::after {
    background: var(--copunet-pfeil-hover, currentColor);
    transform: translate(var(--copunet-pfeilweg, 3px), calc(-1 * var(--copunet-pfeilweg, 3px)));
}
.copunet-kartenpfeile-yes .e-n-tabs-heading > .e-n-tab-title[aria-selected="true"]::after {
    background: var(--copunet-pfeil-aktiv, currentColor);
}
.copunet-kartenpfeile-yes .e-n-tabs-heading > .e-n-tab-title::before {
    content: '';
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: var(--copunet-markierungsbreite, 0px);
    background: transparent;
    pointer-events: none;
}
.copunet-kartenpfeile-yes .e-n-tabs-heading > .e-n-tab-title[aria-selected="true"]::before {
    background: var(--copunet-pfeil-aktiv, currentColor);
}
/* === Gleich hohe native Karten · Alle Inhalte bestimmen gemeinsam die Höhe === */
.copunet-karten-gleichhoch-yes .e-n-tabs > .e-n-tabs-content {
    display: grid;
    align-items: stretch;
}
.copunet-karten-gleichhoch-yes .e-n-tabs > .e-n-tabs-content > .e-con:not(.copunet-karten-alt) {
    display: flex;
    grid-area: 1 / 1;
    min-width: 0;
}
.copunet-karten-gleichhoch-yes .e-n-tabs > .e-n-tabs-content > .e-con:not(.e-active) {
    visibility: hidden;
    pointer-events: none;
}
/* === Gerichteter Kartenwechsel · Zwei deckende Flächen im festen Ausschnitt === */
:is(.copunet-karten-schieben, .copunet-karten-ueberblenden) .e-n-tabs > .e-n-tabs-content {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}
:is(.copunet-karten-schieben, .copunet-karten-ueberblenden) .e-n-tabs-content > .copunet-karten-alt {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}
/* === Native Buttons · Nur das Icon bewegt sich === */
.copunet-buttonpfeil-yes .elementor-button-icon {
    transform: rotate(-45deg);
    transition: transform var(--copunet-pfeildauer, 220ms) ease;
}
.copunet-buttonpfeil-yes .elementor-button:hover .elementor-button-icon, .copunet-buttonpfeil-yes .elementor-button:focus-visible .elementor-button-icon {
    transform: translate(var(--copunet-pfeilweg, 3px), calc(-1 * var(--copunet-pfeilweg, 3px))) rotate(-45deg);
}
/* === Symbolbuttons · Aktivierbare Geometrie, Größe aus Elementor === */
.copunet-symbolbutton-yes .elementor-button {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--copunet-symbolbutton-groesse, 48px);
    height: var(--copunet-symbolbutton-groesse, 48px);
}
.copunet-symbolbutton-yes .elementor-button-content-wrapper {
    align-items: center;
    justify-content: center;
}
.copunet-symbolbutton-yes .elementor-button-icon, .copunet-symbolbutton-yes .elementor-button-icon svg {
    display: block;
}
.copunet-symbolbutton-yes .elementor-button-text:empty {
    display: none;
}
/* === Grafikbeschriftungen · Texte und Typografie im Grafik-Widget === */
.copunet-grafik {
    position: relative;
}
.copunet-grafik-legende {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--copunet-legendenabstand, 20px);
    margin-block-start: var(--copunet-legendenabstand-oben, 12px);
}
.copunet-grafik-legende .copunet-grafik-hinweis {
    margin: 0;
    font: inherit;
    text-align: end;
}
.copunet-grafik-legende [hidden] {
    display: none;
}
.copunet-grafik-randtext {
    position: absolute;
    writing-mode: vertical-rl;
    right: var(--copunet-randtext-rechts, 0px);
    top: var(--copunet-randtext-oben, 40px);
    pointer-events: none;
}
/* Reference index: content remains native Elementor. */
.cp-reference-row {
    transition:background-color .25s,transform .25s
}
.cp-reference-row:hover,.cp-reference-row:focus-within {
    background-color:#e1e5dd;
    transform:translateX(5px)
}
@media(prefers-reduced-motion:reduce) {
    .cp-reference-row {
        transition:none
    }
    .cp-reference-row:hover,.cp-reference-row:focus-within {
        transform:none
    }
}
/* Legal copy: allow long source URLs to wrap on narrow screens. */
.page-id-3 a {
    overflow-wrap:anywhere;
    word-break:normal
}
@media(min-width:1025px) {
    .elementor-location-header .elementor-widget-nav-menu nav.elementor-nav-menu--main ul.elementor-nav-menu>li.elementor-hidden-desktop {
        display:none
    }
}
/*! Copyright (c) 2026 copuNET GmbH · https://copunet.de/
 * Eigene Entwicklung fuer copuNET GmbH. Gesetzliche Rechte und Drittlizenzen bleiben unberuehrt. */
/* Match the Full-HD composition on larger desktop viewports using real
   responsive lengths. Browser zoom and the page coordinate system stay native. */
@media screen and (min-width:1921px) {
    html {
        font-size:calc(100% * var(--copunet-desktop-scale,1))
    }
}