/* =========================================================================
   ADA ELEKTRO — UNIFY LAYER
   Bringt ALLE Unterseiten (Elektro, Smart Home, PV, Wallbox, Netzwerk/
   Video/Alarm/Beleuchtung, Blitzschutz) in die geliebte "Elektrobefund"-
   Optik (.at-*): helle Akzent-Hero-Bühnen, gefüllte Icon-Quadrate, saubere
   weiße Karten, Akzent-Prozessnummern, Kicker mit Akzentbalken.
   Alles akzent-abhängig — nutzt --c / --rgb / --c-read / --c-ink der
   jeweiligen Seite (gesetzt von .adav7-accent-*). Wird ZULETZT geladen,
   damit es das Alt-Design sauber überschreibt.
   ========================================================================= */

/* ---- Gemeinsame Akzent-Ableitungen ---- */
.adav7{
  --u-c:var(--c);
  --u-read:var(--c-read,var(--c));
  --u-ink:#0b1f2a;
  --u-body:#4a6273;
  --u-border:#dde8ee;
  --u-soft:rgba(var(--rgb),.10);
  --u-line:rgba(var(--rgb),.45);
  --u-shadow:0 16px 44px -20px rgba(11,31,42,.16);
}

/* =========================================================================
   1) HERO — von dunkler Foto-Bühne auf helle Akzent-Bühne (Elektrobefund-Stil)
   ========================================================================= */
.adav7 .ep-hero,.adav7 .sm-hero,.adav7 .pv-hero,
.adav7 .wb-hero,.adav7 .svc-hero,.adav7 .bs-hero{
  position:relative;display:flex;align-items:center;
  min-height:clamp(320px,42vh,440px)!important;
  background:linear-gradient(135deg,rgba(var(--rgb),.13) 0%,#f5fafb 55%,rgba(var(--rgb),.07) 100%)!important;
  border:1px solid var(--u-border);
}
/* dunkles Foto/Overlay entfernen */
.adav7 .ep-hero-bg,.adav7 .sm-hero-bg,.adav7 .pv-hero-bg,
.adav7 .wb-hero-bg,.adav7 .svc-hero-bg,.adav7 .bs-hero-bg{display:none!important}
/* Punkteraster oben rechts (wie im Elektrobefund-Hero) */
.adav7 .ep-hero::before,.adav7 .sm-hero::before,.adav7 .pv-hero::before,
.adav7 .wb-hero::before,.adav7 .svc-hero::before,.adav7 .bs-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(var(--rgb),.16) 1.5px,transparent 1.5px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(circle at 84% 22%,#000 0%,transparent 60%);
  mask-image:radial-gradient(circle at 84% 22%,#000 0%,transparent 60%);
}
.adav7 .ep-hero-content,.adav7 .sm-hero-content,.adav7 .pv-hero-content,
.adav7 .wb-hero-content,.adav7 .svc-hero-content,.adav7 .bs-hero-content{
  position:relative;z-index:2;
  padding:clamp(38px,5.5vw,68px) clamp(22px,4vw,56px)!important;max-width:820px;
}
/* Überschrift + Fließtext dunkel, Akzent-em in lesbarer Akzentfarbe */
.adav7 .ep-hero h1,.adav7 .sm-hero h1,.adav7 .pv-hero h1,
.adav7 .wb-hero h1,.adav7 .svc-hero h1,.adav7 .bs-hero h1{color:var(--u-ink)!important;text-shadow:none!important}
.adav7 .ep-hero h1 em,.adav7 .sm-hero h1 em,.adav7 .pv-hero h1 em,
.adav7 .wb-hero h1 em,.adav7 .bs-hero h1 em,.adav7 .svc-hero h1 em{color:var(--u-read)!important;filter:none!important}
.adav7 .ep-hero-sub,.adav7 .sm-hero-sub,.adav7 .pv-hero-sub,
.adav7 .wb-hero-sub,.adav7 .svc-hero-sub,.adav7 .bs-hero-sub{color:var(--u-body)!important;text-shadow:none!important}
/* Hero-Kicker in Akzentfarbe */
.adav7 .ep-hero .ep-kicker,.adav7 .sm-hero .sm-kicker,.adav7 .pv-hero .pv-kicker,
.adav7 .wb-hero .wb-kicker,.adav7 .bs-hero .bs-kicker{color:var(--u-read)!important}
/* Badges als weiße Pillen */
.adav7 .ep-hero .ep-badge,.adav7 .sm-hero .sm-badge,.adav7 .pv-hero .pv-badge,
.adav7 .wb-hero .wb-badge,.adav7 .svc-hero .svc-badge,.adav7 .bs-hero .bs-badge{
  background:#fff!important;border:1px solid var(--u-border)!important;color:var(--u-ink)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;text-shadow:none!important}
/* Ghost-Button IM HERO: hell (weißer Grund, Akzentschrift) — Final-CTA bleibt dunkel */
.adav7 .ep-hero .ep-btn-ghost,.adav7 .sm-hero .sm-btn-ghost,.adav7 .pv-hero .pv-btn-ghost,
.adav7 .wb-hero .wb-btn-ghost,.adav7 .svc-hero .svc-btn-ghost,.adav7 .bs-hero .bs-btn-ghost{
  background:#fff!important;color:var(--u-read)!important;border:2px solid var(--u-line)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important}

/* =========================================================================
   2) ICON-QUADRATE — gefüllt, Akzent-soft (das prägende Elektrobefund-Detail)
   ========================================================================= */
.adav7 .ep-icon,.adav7 .sm-icon,.adav7 .pv-icon,
.adav7 .wb-icon,.adav7 .svc-icon,.adav7 .bs-icon{
  display:grid!important;place-items:center!important;
  width:52px!important;height:52px!important;border-radius:15px!important;
  background:var(--u-soft)!important;color:var(--u-read)!important;border:none!important;
  font-size:1.4rem!important;line-height:1!important;margin-bottom:14px!important;
  box-shadow:none!important}

/* =========================================================================
   3) KARTEN — weiß, feiner Rahmen, weicher Schatten, sanfter Hover-Lift
   ========================================================================= */
.adav7 .ep-card,.adav7 .sm-card,.adav7 .pv-card,
.adav7 .wb-card,.adav7 .svc-card,.adav7 .bs-card{
  background:#fff!important;border:1px solid var(--u-border)!important;
  border-radius:22px!important;box-shadow:var(--u-shadow)!important;
  transition:transform .2s,border-color .2s,box-shadow .2s}
.adav7 .ep-card:hover,.adav7 .sm-card:hover,.adav7 .pv-card:hover,
.adav7 .wb-card:hover,.adav7 .svc-card:hover,.adav7 .bs-card:hover{
  transform:translateY(-4px);border-color:var(--u-line)!important;box-shadow:var(--es-shadow-hover,0 24px 48px -20px rgba(11,31,42,.22))!important}
.adav7 .ep-card h3,.adav7 .sm-card h3,.adav7 .pv-card h3,
.adav7 .wb-card h3,.adav7 .svc-card h3,.adav7 .bs-card h3{color:var(--u-ink)!important}
.adav7 .ep-card p,.adav7 .sm-card p,.adav7 .pv-card p,
.adav7 .wb-card p,.adav7 .svc-card p,.adav7 .bs-card p{color:var(--u-body)!important}

/* =========================================================================
   4) KICKER — Akzentbalken + Akzentfarbe (einheitlich über alle Seiten)
   ========================================================================= */
.adav7 .ep-kicker,.adav7 .sm-kicker,.adav7 .pv-kicker,
.adav7 .wb-kicker,.adav7 .svc-kicker,.adav7 .bs-kicker{
  color:var(--u-read)!important;font-family:Manrope,Inter,sans-serif!important;
  font-weight:800!important;letter-spacing:.16em!important;text-transform:uppercase!important}
.adav7 .ep-kicker::before,.adav7 .sm-kicker::before,.adav7 .pv-kicker::before,
.adav7 .wb-kicker::before,.adav7 .bs-kicker::before{background:var(--u-read)!important}

/* =========================================================================
   5) PROZESS-NUMMERN — Akzent-Quadrate mit lesbarer Schrift
   ========================================================================= */
.adav7 .ep-step-num,.adav7 .sm-step-num,.adav7 .pv-step-num,
.adav7 .svc-step-num,.adav7 .bs-step-num{
  background:var(--u-c)!important;color:var(--c-ink,#fff)!important;
  width:44px!important;height:44px!important;border-radius:12px!important;
  display:grid!important;place-items:center!important;
  font:800 .95rem 'JetBrains Mono',ui-monospace,monospace!important;
  margin-bottom:12px!important;box-shadow:0 10px 22px -10px rgba(var(--rgb),.6)!important}
.adav7 .ep-step,.adav7 .sm-step,.adav7 .pv-step,
.adav7 .svc-step,.adav7 .bs-step{
  background:#fff!important;border:1px solid var(--u-border)!important;border-radius:20px!important;
  box-shadow:var(--u-shadow)!important}
.adav7 .ep-step h4,.adav7 .sm-step h4,.adav7 .pv-step h4,
.adav7 .svc-step h4,.adav7 .bs-step h4{color:var(--u-ink)!important}

/* =========================================================================
   6) STAT-ZAHLEN, FAQ-Plus, Pillen — Akzent einheitlich
   ========================================================================= */
.adav7 .ep-stat b,.adav7 .sm-stat b,.adav7 .pv-stat b,.adav7 .wb-stat b,
.adav7 .svc-stat b,.adav7 .bs-stat b{color:var(--u-read)!important}
.adav7 .ep-plus,.adav7 .sm-plus,.adav7 .pv-plus,
.adav7 .wb-plus,.adav7 .svc-plus,.adav7 .bs-plus{color:var(--u-read)!important}

/* =========================================================================
   7) BUTTONS — Primär (Akzent) + Pillenform einheitlich
   ========================================================================= */
.adav7 .ep-btn,.adav7 .sm-btn,.adav7 .pv-btn,
.adav7 .wb-btn,.adav7 .svc-btn,.adav7 .bs-btn{border-radius:999px!important;font-family:Manrope,Inter,sans-serif!important}
.adav7 .ep-btn-primary,.adav7 .sm-btn-primary,.adav7 .pv-btn-primary,
.adav7 .wb-btn-primary,.adav7 .svc-btn-primary,.adav7 .bs-btn-primary{
  background:var(--u-c)!important;color:var(--c-ink,#fff)!important;border:2px solid transparent!important;
  box-shadow:0 12px 26px -12px rgba(var(--rgb),.65)!important}

/* =========================================================================
   8) GLOBALE HEROS OHNE FOTO (Förderungen, Kontakt, Über uns, FAQ) — hell
   Die Startseite behält bewusst ihre dunkle Foto-Bühne (Landing-Wirkung);
   nur die bild-losen Info-Seiten werden auf die helle Optik umgestellt.
   ========================================================================= */
.adav7 .adav7-hero:not([style*="hero-image"]){
  background:linear-gradient(135deg,rgba(var(--rgb),.13) 0%,#f5fafb 55%,rgba(var(--rgb),.07) 100%)!important;
  border:1px solid var(--u-border)}
.adav7 .adav7-hero:not([style*="hero-image"]) .adav7-hero-bg{display:none!important}
.adav7 .adav7-hero:not([style*="hero-image"])::before{
  content:""!important;position:absolute!important;inset:0!important;pointer-events:none;
  background-image:radial-gradient(rgba(var(--rgb),.16) 1.5px,transparent 1.5px)!important;
  background-size:26px 26px!important;
  -webkit-mask-image:radial-gradient(circle at 84% 22%,#000 0%,transparent 60%)!important;
  mask-image:radial-gradient(circle at 84% 22%,#000 0%,transparent 60%)!important}
.adav7 .adav7-hero:not([style*="hero-image"]) .adav7-hero-inner{position:relative;z-index:2}
.adav7 .adav7-hero:not([style*="hero-image"]) h1{color:var(--u-ink)!important;text-shadow:none!important}
.adav7 .adav7-hero:not([style*="hero-image"]) h1 em{color:var(--u-read)!important}
.adav7 .adav7-hero:not([style*="hero-image"]) h1 em::after{background:rgba(var(--rgb),.26)!important}
.adav7 .adav7-hero:not([style*="hero-image"]) p{color:var(--u-body)!important;text-shadow:none!important}
.adav7 .adav7-hero:not([style*="hero-image"]) .adav7-eyebrow{
  color:var(--u-read)!important;background:#fff!important;border:1px solid var(--u-border)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.adav7 .adav7-hero:not([style*="hero-image"]) .adav7-hero-assure span{color:var(--u-body)!important;text-shadow:none!important}
.adav7 .adav7-hero:not([style*="hero-image"]) .adav7-btn.ghost{
  background:#fff!important;color:var(--u-read)!important;border:2px solid var(--u-line)!important}