/* Gestaltung ab 1.7.0: die ganze Website sieht aus wie SvG Agent von innen.
   Durchgehend dunkel, Karten mit feinem Rand, leuchtende Knoepfe.
   Wird nach agent.css und site.css geladen.

   Farben (aus der App abgelesen)
     Grund     #0D101F   Seitenhintergrund
     Flaeche   #111630   abgesetzte Abschnitte
     Karte     #161C34   Karten und Felder
     Rand      #28345C   Kartenrand
     Leuchten  #8CA0F5   Knoepfe, Symbole, Hervorhebung
     Text      #C9CDF0   Fliesstext, Ueberschriften in Weiss
   Schrift: Poppins (Ueberschriften) und Inter (Text), beide im Theme. */

@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-latin-wght-normal.woff2') format('woff2-variations')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/poppins-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/poppins-latin-700-normal.woff2') format('woff2')}

:root{--g:#0D101F;--fl:#111630;--ka:#161C34;--ra:#28345C;--le:#8CA0F5;--le2:#AEB8FF;--tx:#C9CDF0;--ls:#9AA3CC}

/* ---------- Grund ---------- */
body.svgn-rahmen{background:var(--g)!important;color:var(--tx)}
.svga,.svga-teaser,body.svgn-rahmen .svgm-lp{
  --ink:#fff;--ink2:#E4E7FF;--text:#C9CDF0;--muted:#9AA3CC;--soft:#111630;--line:#28345C;--ac:#8CA0F5;--ac2:#8CA0F5;
  color:var(--tx);background:var(--g);
}
.svga h1,.svga h2,.svga h3,.svga-teaser h2{color:#fff}
.svga a,.svga-teaser a{color:var(--le2)}
.svga-section{background:var(--g)}
.svga-soft{background:var(--fl)}
.svga-intro,.svga-schritt p,.svga-haken li,.svgn-text,.svga-card p,.svga-faq p,.svgn-wege-hinweis,.svga-klein,.svga-schluss,.svga-preis-einheit{color:var(--tx)}
.svga-klein,.svgn-wege-unsicher,.svga-tester,.svga .svga-tester a,.svga-preis-klein{color:var(--ls)}
.svga-eyebrow{color:var(--le)}
.svga-schluss{color:#fff}

/* ---------- Leuchten im Einstieg ---------- */
.svga-hero,.svgn-hero{position:relative;background:var(--g);isolation:isolate}
.svga-hero::before{content:'';position:absolute;inset:0;z-index:-2;background-image:radial-gradient(rgba(140,160,245,.16) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:linear-gradient(180deg,#000 0,transparent 85%);mask-image:linear-gradient(180deg,#000 0,transparent 85%)}
.svga-hero::after{content:'';position:absolute;z-index:-1;width:760px;height:760px;right:-180px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(91,108,255,.55) 0,rgba(91,108,255,.18) 38%,transparent 68%);filter:blur(10px);animation:svgn-schweben 14s ease-in-out infinite alternate}
@keyframes svgn-schweben{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-70px,50px,0) scale(1.12)}}
.svga-hero h1 span{color:var(--le2)}
.svga-phone-gross{box-shadow:0 -10px 90px rgba(120,140,255,.45);animation:svgn-heben 7s ease-in-out infinite alternate}
@keyframes svgn-heben{from{transform:translateY(8px)}to{transform:translateY(-8px)}}
.svgn-hero-bild{align-self:end}

/* ---------- Knoepfe ---------- */
.svga a.svga-btn-primary,.svga-teaser a.svga-btn-primary{background:linear-gradient(180deg,#9DAFFF,#8296F2);color:#0D101F;font-weight:700;box-shadow:0 0 0 1px rgba(174,184,255,.5) inset,0 10px 36px rgba(120,140,255,.5)}
.svga a.svga-btn-primary:hover,.svga-teaser a.svga-btn-primary:hover{box-shadow:0 0 0 1px rgba(255,255,255,.7) inset,0 14px 48px rgba(120,140,255,.75)}
.svga a.svga-btn-ghost,.svga-teaser a.svga-btn-ghost,.svga-hero a.svga-btn-ghost,.svga-cta a.svga-btn-ghost{background:var(--ka);color:#fff;border:1px solid #3A4680}
.svga a.svga-btn-ghost:hover,.svga-teaser a.svga-btn-ghost:hover{border-color:var(--le);background:#1C2444}

/* ---------- Karten ---------- */
.svga-card,.svga-soft .svga-card,.svgn-schritte li{background:var(--ka);border:1px solid var(--ra);border-radius:18px;transition:transform .2s,border-color .2s,box-shadow .2s}
.svga-card:hover,.svgn-schritte li:hover{border-color:#4A5AA8;transform:translateY(-3px);box-shadow:0 18px 50px rgba(0,0,0,.35)}
.svga a.svgn-card-link:hover{border-color:var(--le);box-shadow:0 18px 50px rgba(0,0,0,.35),0 0 0 1px rgba(140,160,245,.35)}
.svga-icon,.svga-soft .svga-icon{background:rgba(140,160,245,.14);color:var(--le2)}
.svgn-mehr{color:var(--le2)}
.svga-card-nein::before{background:rgba(240,110,110,.16)}
.svga-card-nein::after{color:#F08A8A}
.svgn-kennzahl{border-top-color:var(--ra);color:var(--ls)}
.svgn-kennzahl strong{color:#fff}
.svgn-schritte p{color:var(--tx)}
.svga-kicker{background:rgba(140,160,245,.14);border:0;color:var(--le2)}
.svga-chips li,.svga-chips-gross li{background:var(--ka);border-color:var(--ra);color:#E4E7FF}
.svga-haken li::before{background:var(--le)}
.svga-haken li::after{border-color:#0D101F}
.svga-screen{border-color:var(--ra);box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 60px rgba(91,108,255,.18)}
.svga-phone{border-color:#232B4D;box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 70px rgba(91,108,255,.22)}
.svga-video{box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 60px rgba(91,108,255,.2);border:1px solid var(--ra)}
.svga-dunkel{background:var(--fl)}

/* Kacheln mit Zahlen, wie in der App */
.svgn-kacheln{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px}
.svgn-kachel{background:var(--ka);border:1px solid var(--ra);border-radius:18px;padding:26px 22px;text-align:center}
.svgn-kachel-wert{display:block;font-family:'Poppins',sans-serif;font-weight:700;font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.1;color:var(--le2)}
.svgn-kachel-label{display:block;margin-top:8px;font-size:.95rem;color:var(--ls)}

/* ---------- Preis, Fragen, Abschluss ---------- */
.svga-preis{background:var(--ka);border:1px solid var(--ra);box-shadow:0 0 80px rgba(91,108,255,.16)}
.svga-preis-box{background:var(--g);border:1px solid #3A4680;color:var(--tx)}
.svga-preis-zahl{color:#fff}
.svga-preis-hinweis{color:#E4E7FF}
.svga-faq details{background:var(--ka);border-color:var(--ra)}
.svga-faq details[open]{border-color:#4A5AA8}
.svga-faq summary{color:#fff}
.svga-faq summary::after{color:var(--le)}
.svga-cta{background:radial-gradient(700px 320px at 80% 0,rgba(91,108,255,.5) 0,transparent 65%),var(--ka);border:1px solid var(--ra)}
.svga-teaser-in{background:radial-gradient(800px 420px at 90% -10%,rgba(91,108,255,.5) 0,transparent 62%),var(--ka);border:1px solid var(--ra)}
.svga-teaser{background:var(--g)}
.svga-stimme blockquote{color:var(--tx)}

/* ---------- Die zwei Wege ---------- */
.svgn-weg-hell{background:var(--ka);border:1px solid var(--ra);box-shadow:none;color:var(--tx)}
.svgn-weg-hell .svgn-weg-marke{background:rgba(255,255,255,.08);color:#E4E7FF}
.svgn-weg-hell .svgn-weg-preis{color:#fff}
.svgn-weg-hell p{color:var(--tx)}
.svgn-weg-dunkel{background:radial-gradient(600px 320px at 90% -10%,rgba(91,108,255,.55) 0,transparent 62%),var(--ka);border:1px solid var(--le);box-shadow:0 0 70px rgba(91,108,255,.28)}
.svgn-weg-dunkel .svgn-weg-marke{background:var(--le);color:#0D101F}

/* ---------- Kontakt ---------- */
.svgn-kontakt-daten,.svgn-kontakt-form{background:var(--ka);border-color:var(--ra)}
.svgn-kontakt-daten li{border-top-color:var(--ra);color:#fff}
.svgn-kontakt-daten li span{color:var(--ls)}
.svgn-kontakt-form label,.svgn-kontakt-form .wpforms-field-label,.svgn-kontakt-form legend{color:#E4E7FF!important}
.svgn-kontakt-form .wpforms-field-description,.svgn-kontakt-form .wpforms-field-sublabel{color:var(--ls)!important}
.svgn-kontakt-form input[type=text],.svgn-kontakt-form input[type=email],.svgn-kontakt-form input[type=tel],.svgn-kontakt-form textarea,.svgn-kontakt-form select{background:var(--g)!important;border-color:#3A4680!important;color:#fff!important}
.svgn-kontakt-form input::placeholder,.svgn-kontakt-form textarea::placeholder{color:#7D87B5}
.svgn-kontakt-form button[type=submit],.svgn-kontakt-form .wpforms-submit{background:linear-gradient(180deg,#9DAFFF,#8296F2)!important;color:#0D101F!important;font-weight:700!important;box-shadow:0 10px 36px rgba(120,140,255,.5)}

/* ---------- Kopf ---------- */
.svgn-kopf{background:rgba(13,16,31,.88);border-bottom:1px solid var(--ra)}
.svgn-logo svg{height:46px;width:auto;display:block}
.svgn-nav a{color:#E4E7FF}
.svgn-nav a:hover{background:var(--ka);color:#fff}
.svgn-nav a[aria-current="page"]{color:var(--le2)}
.svgn-nav .svgn-nav-agent span{background:var(--le);color:#0D101F}
.svgn-nav a.svgn-nav-btn{background:linear-gradient(180deg,#9DAFFF,#8296F2);color:#0D101F;font-weight:700;box-shadow:0 8px 28px rgba(120,140,255,.45)}
.svgn-nav a.svgn-nav-btn:hover{background:linear-gradient(180deg,#B3C1FF,#8FA2F7);color:#0D101F}
.svgn-drop-menu{background:var(--ka);border-color:var(--ra);box-shadow:0 20px 50px rgba(0,0,0,.5)}
.svgn-drop-menu a:hover{background:#1F2850}
.svgn-toggle{background:var(--ka);border-color:var(--ra)}
.svgn-toggle span{background:#fff}
.svgn-skip{background:var(--le);color:#0D101F}

/* ---------- Leiste und Fuss ---------- */
.svgn-leiste{background:var(--fl);border-top:1px solid var(--ra)}
.svgn-leiste a:hover{background:var(--ka)}
.svgn-fuss{background:#090B17;border-top:1px solid var(--ra)}

/* ---------- Standortseiten ---------- */
body.svgn-rahmen .svgm-lp h1,body.svgn-rahmen .svgm-lp h2,body.svgn-rahmen .svgm-lp h3{color:#fff}
body.svgn-rahmen .svgm-lp p,body.svgn-rahmen .svgm-lp li,body.svgn-rahmen .svgm-lp .svgm-lead,body.svgn-rahmen .svgm-lp .svgm-card p,body.svgn-rahmen .svgm-lp .svgm-faq p,body.svgn-rahmen .svgm-lp .svgm-leist__item p,body.svgn-rahmen .svgm-lp .svgm-leist__item li,body.svgn-rahmen .svgm-lp .svgm-liste li,body.svgn-rahmen .svgm-lp .svgm-schritte p,body.svgn-rahmen .svgm-lp .svgm-projekt p{color:var(--tx)}
body.svgn-rahmen .svgm-lp a{color:var(--le2)}
body.svgn-rahmen .svgm-lp strong,body.svgn-rahmen .svgm-lp .svgm-liste li strong{color:#fff}
body.svgn-rahmen .svgm-lp .svgm-section{border-top-color:var(--ra);background:var(--g)}
body.svgn-rahmen .svgm-lp .svgm-soft{background:var(--fl)}
body.svgk-standort.svgn-rahmen .svgm-lp .svgm-hero{background:radial-gradient(900px 520px at 85% -10%,rgba(91,108,255,.5) 0,transparent 62%),var(--g)}
body.svgn-rahmen .svgm-lp .svgm-card,body.svgn-rahmen .svgm-lp .svgm-zahl,body.svgn-rahmen .svgm-lp .svgm-leist__item,body.svgn-rahmen .svgm-lp .svgm-liste li,body.svgn-rahmen .svgm-lp .svgm-schritte li,body.svgn-rahmen .svgm-lp .svgm-projekt,body.svgn-rahmen .svgm-lp .svgm-faq details{background:var(--ka);border-color:var(--ra)}
body.svgn-rahmen .svgm-lp .svgm-zahl__wert,body.svgn-rahmen .svgm-lp .svgm-faq summary{color:#fff}
body.svgn-rahmen .svgm-lp .svgm-zahl__label,body.svgn-rahmen .svgm-lp .svgm-note,body.svgn-rahmen .svgm-lp .svgm-andere{color:var(--ls)}
body.svgn-rahmen .svgm-lp .svgm-eyebrow,body.svgn-rahmen .svgm-lp .svgm-projekt__branche{color:var(--le)}
body.svgn-rahmen .svgm-lp .svgm-liste li::before{background:rgba(140,160,245,.16);color:var(--le2)}
body.svgn-rahmen .svgm-lp .svgm-btn-primary{background:linear-gradient(180deg,#9DAFFF,#8296F2);color:#0D101F;box-shadow:0 10px 36px rgba(120,140,255,.5)}
body.svgn-rahmen .svgm-lp .svgm-btn-ghost{background:var(--ka);color:#fff;border-color:#3A4680}
body.svgn-rahmen .svgm-lp .svgm-badge{background:var(--ka);border-color:var(--ra);color:#E4E7FF}
body.svgn-rahmen .svgm-lp .svgm-cta{background:radial-gradient(700px 320px at 80% 0,rgba(91,108,255,.5) 0,transparent 65%),var(--ka);border:1px solid var(--ra)}
body.svgn-rahmen .svgm-lp .svgm-cta p{color:var(--tx)}
body.svgn-rahmen .svgm-lp .svgm-projekt__ergebnis{border-top-color:var(--ra)}

@media(max-width:1060px){
  .svgn-nav{background:#0D101F;border-bottom-color:var(--ra)}
  .svgn-drop-menu{background:transparent}
  .svgn-drop-menu a{color:var(--tx)}
}
@media(max-width:980px){.svgn-kacheln{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.svga-hero::after{width:480px;height:480px;right:-160px;top:-160px}}
@media(prefers-reduced-motion:reduce){.svga-hero::after,.svga-phone-gross{animation:none}.svga-card,.svgn-schritte li{transition:none}.svga-card:hover,.svgn-schritte li:hover{transform:none}}

/* Kundenstimmen (seit 1.8.0) */
.svgn-stimmen{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:8px}
.svgn-stimme{margin:0;background:var(--ka);border:1px solid var(--ra);border-radius:18px;padding:28px 26px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;position:relative}
.svgn-stimme::before{content:'\201E';position:absolute;top:6px;right:22px;font-family:'Poppins',sans-serif;font-size:4.2rem;line-height:1;color:var(--ra)}
.svgn-stimme blockquote{margin:0;padding:0;border:0}
.svgn-stimme blockquote p{margin:0;color:#fff;font-size:1.04rem;line-height:1.6}
.svgn-stimme figcaption{display:flex;flex-direction:column;gap:3px;font-size:.92rem;color:var(--ls)}
.svgn-stimme figcaption strong{color:#fff;font-weight:600}
.svgn-stimme figcaption a{color:var(--le2);text-decoration:none}
.svgn-stimme figcaption a:hover{text-decoration:underline}
.svgn-stimme-leistung{margin-top:6px;font-size:.82rem;letter-spacing:.02em;color:var(--le)}

/* Autorenbox unter Blogartikeln (seit 1.8.0) */
.svgn-autor{margin:48px 0 8px;padding:26px 26px 22px;background:var(--ka);border:1px solid var(--ra);border-radius:18px}
.svgn-autor-kopf{display:flex;flex-direction:column;gap:2px;margin-bottom:12px}
.svgn-autor-label{font-size:.78rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--le)}
.svgn-autor-name{font-family:'Poppins',sans-serif;font-size:1.25rem;color:#fff}
.svgn-autor-rolle{font-size:.92rem;color:var(--ls)}
.svgn-autor p{color:var(--tx);margin:0 0 12px}
.svgn-autor-quali{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.svgn-autor-quali li{font-size:.84rem;color:#fff;background:rgba(140,160,245,.12);border:1px solid var(--ra);border-radius:999px;padding:5px 12px}
.svgn-autor .svgn-autor-fuss{font-size:.86rem;color:var(--ls);margin:0}
.svgn-autor-fuss a{color:var(--le2)}

/* Ratgeber-Karten und Links unter Artikeln (seit 1.8.0) */
.svgn-ratgeber-datum{display:block;font-size:.8rem;color:var(--le);margin-bottom:10px}
.svgn-weiter{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0 8px}
.svgn-weiter>div{padding:24px;background:var(--ka);border:1px solid var(--ra);border-radius:18px}
.svgn-weiter-leistung>a{display:block;margin:4px 0 8px;color:#fff;font-family:'Poppins',sans-serif;font-size:1.15rem;text-decoration:none}
.svgn-weiter-leistung>a:hover{color:var(--le2)}
.svgn-weiter p{color:var(--tx);margin:0;font-size:.95rem}
.svgn-weiter a{color:var(--le2)}
.svgn-weiter ul{list-style:none;margin:8px 0 0;padding:0}
.svgn-weiter li{padding:8px 0;border-top:1px solid var(--ra)}
.svgn-weiter li:first-child{border-top:0}
@media(max-width:760px){.svgn-weiter{grid-template-columns:1fr}}

/* Referenzen / Fallstudien (seit 1.8.0) */
.svgn-fall{display:flex;flex-direction:column;gap:24px}
.svgn-fall-marke{font-size:.82rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--le)}
.svgn-fall-zahlen{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.svgn-fall-grid{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:20px}
.svgn-fall-grid>div{background:var(--ka);border:1px solid var(--ra);border-radius:18px;padding:24px}
.svgn-fall-grid h3{margin:0 0 10px;font-size:1.05rem;color:#fff}
.svgn-fall-grid p{margin:0;color:var(--tx)}
.svgn-fall-grid a,.svgn-fall a{color:var(--le2)}
.svgn-fall-zitat{max-width:820px}
.svgn-fall-quelle{margin:0;color:var(--ls)}
@media(max-width:980px){.svgn-fall-grid{grid-template-columns:1fr}}
