
/*
 * Datei: ka-radial-network.css
 * 
 * * Diese Datei ist Teil des Projektes 'Kolping Landingpage WP-Theme'.
 * * 
 * * Standard Kolping WP-Theme für Landingpages
 * * 
 * * Copyright (c) 2026, Kolping-Mainfranken GmbH - Florian Leonhardt
 * * Alle Rechte vorbehalten.
 * *
 * * Lizenz / Nutzungsrechte (unternehmensintern):
 * * - Dieses Theme und der dazugehörige Quellcode sind proprietär und ausschließlich für die
 * *   interne Nutzung innerhalb von Kolping-Mainfranken GmbH bestimmt (inkl. verbundener Einrichtungen, sofern
 * *   diese organisatorisch zu Kolping-Mainfranken GmbH gehören).
 * * - Nutzung, Betrieb, Vervielfältigung und Anpassungen sind für interne Zwecke erlaubt.
 * * - Eine Weitergabe an externe Dritte (z. B. Agenturen, Dienstleister, andere Unternehmen),
 * *   Veröffentlichung (öffentliches Repository, Code-Sharing) oder Nutzung außerhalb des
 * *   Unternehmenskontextes ist ohne vorherige schriftliche Freigabe von Kolping-Mainfranken GmbH nicht gestattet.
 * * - Der Einsatz bei Kundenprojekten ist nur zulässig, wenn Kolping-Mainfranken GmbH Auftraggeber ist und die
 * *   Nutzung vertraglich im Rahmen des jeweiligen Projekts erfolgt.
 * * 
 * * Hinweis zur Herkunft:
 * * Entwickelt im Rahmen der Tätigkeit für Kolping-Mainfranken GmbH.
 * *
 * * @package    Kolping Landingpage WP-Theme
 * * @version    1.3.0
 * * @license    Proprietäre Kundenlizenz
 * * @author     Florian Leonhardt
 * * @update     Tue Feb 24 2026 - 09:23:22
 * *
 */



.ka-rn-text {
text-transform: uppercase;
}


/* Datei: /wp-content/themes/kolping-akademie-v2/assets/css/ka-radial-network.css */

/* (dein bestehendes CSS bleibt) */

.ka-rn-wrap{
  position:relative;
  width:100%;
  border-radius:22px;
  overflow:hidden;
    /*
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);*/
  background:
    radial-gradient(1200px 700px at 50% 50%, rgba(255,255,255,.10), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}

.ka-rn-center{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:3;
  border-radius:999px;
  display:grid;
  place-items:center;
  background: rgba(255,255,255,1);
  border: 3px solid rgba(255,140,0,.5);
  box-shadow: 0 20px 60px rgba(0,0,0,.18);
}

.ka-rn-logo{
  object-fit:contain;
  border-radius:999px;
  display:block;
}

.ka-rn-lines{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:1;
  pointer-events:none;
}

.ka-rn-node{
  position:absolute;              /* ✅ immer absolute – auch im Editor */
  z-index:2;
  padding:12px 14px;
  border-radius:999px;
  white-space:nowrap;
  font:600 14px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.2px;
  border:1px solid rgba(0,0,0,.18);
  box-shadow: 0 12px 30px rgba(0,0,0,.14);
  transform:translate(-50%,-50%);
  user-select:none;
  transition: transform .18s ease;
  text-decoration:none;
  left:50%;                       /* ✅ Default: Zentrum (bis JS gelayoutet hat) */
  top:50%;
}

.ka-rn-node:hover{
  transform:translate(-50%,-50%) scale(1.03);
}

.ka-rn-dot{
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:999px;
  margin-right:10px;
  vertical-align:-1px;
}

/* ✅ Editor: wrapper darf nicht kollabieren */
.elementor-editor-active .ka-rn-wrap,
.elementor-editor-preview .ka-rn-wrap{
  min-height: 520px;
}

/* ❌ WICHTIG: ALLE Inline-Fallback-Regeln raus!
   Wenn du sowas noch irgendwo hast, LÖSCHEN:
   .ka-rn-wrap.ka-rn-fallback .ka-rn-node { position:relative; display:inline-flex; ... }
*/
@media (max-width: 767px){
  .ka-rn-node{font-size:13px;padding:10px 12px;}
}


.ka-rn-node .ka-rn-dot{
  position: relative;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  display: inline-block;
  margin-right: 10px;
  flex: 0 0 auto;

  /* Kern */
  background: rgba(255,255,255,.96);

  /* klare Absetzung + innerer Glow */
  box-shadow:
    0 0 0 2px rgba(0,0,0,.16),       /* Kontrastkante */
    0 0 10px rgba(255,255,255,.35),  /* Nah-Glow */
    0 0 20px rgba(255,255,255,.20);  /* Mittlerer Glow */
}

/* echter Blur-Halo */
.ka-rn-node .ka-rn-dot::before{
  content: "";
  position: absolute;
  inset: -12px;                 /* Halo-Größe */
  border-radius: 999px;
  background: rgba(255,255,255,.45);
  filter: blur(10px);           /* echter Nebel */
  opacity: .75;
  pointer-events: none;
  transition: opacity .2s ease, inset .2s ease;
}

/* subtiler Interaktions-Puls */
.ka-rn-node:hover .ka-rn-dot::before{
  opacity: .95;
  inset: -14px;
}


