/* Speicher v2 (Übersicht, GoodWe, Sungrow, Solarwatt): Effekte für native Divi-Module mit stx-*-Klassen.
   Geladen nur auf /speicher/ und deren drei Unterseiten (body.stx-page). Ohne JS und bei reduzierter Bewegung
   bleiben alle Inhalte statisch sichtbar; Grafiken aus speicher-fx.js sind reine Dekoration. */
:root{--stx-red:#e00000;--stx-red-2:#ff5a3c;--stx-ink:#0f172a;--stx-ease:cubic-bezier(.16,1,.3,1)}

/* Divi setzt per JS overflow-y:hidden auf #page-container – das bricht position:sticky. */
body.stx-page #page-container{overflow:clip!important}
.stx-sr{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0);margin:0!important;padding:0!important}

.stx-layered{position:relative;isolation:isolate;overflow:clip}
.stx-layered>.et_pb_row{position:relative;z-index:1}

/* Akzentwort */
.stx-page .stx-dark .al-h em{color:#ff5a4d}
.stx-page .stx-hero .al-h em{padding:0 .04em;background:linear-gradient(100deg,#e00000 10%,#ff4d2e 45%,#ff9f1c 90%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:stx-grad 6s ease-in-out infinite alternate}
.stx-page .stx-hero.stx-dark .al-h em{background-image:linear-gradient(100deg,#ff3b30 10%,#ff6b3d 45%,#ffb04d 90%)}
@keyframes stx-grad{to{background-position:100% 0}}
.stx-mono p{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;letter-spacing:.02em}
.stx-logo-light img{filter:brightness(0) invert(1)}
.stx-on-red .al-h em{color:#ffd2c9!important}
.stx-on-red .al-h em,.stx-on-red .et_pb_text p{text-shadow:none}
.stx-light-link a{color:#fff!important;text-decoration:underline;text-underline-offset:3px}

/* Einstieg */
.stx-rise>.et_pb_module{animation:stx-rise .95s var(--stx-ease) both}
.stx-rise>.et_pb_module:nth-child(2){animation-delay:.08s}
.stx-rise>.et_pb_module:nth-child(3){animation-delay:.16s}
.stx-rise>.et_pb_module:nth-child(4){animation-delay:.24s}
.stx-rise>.et_pb_module:nth-child(5){animation-delay:.32s}
.stx-rise>.et_pb_module:nth-child(n+6){animation-delay:.4s}
@keyframes stx-rise{from{opacity:0;transform:translateY(28px)}}
.stx-pop{animation:stx-pop 1.3s .25s var(--stx-ease) both}
@keyframes stx-pop{from{opacity:0;transform:translateY(40px) scale(.94)}}
.stx-float{animation:stx-float 6s ease-in-out infinite}
.stx-float-2{animation:stx-float 7.5s ease-in-out -3s infinite}
@keyframes stx-float{50%{transform:translateY(-12px)}}

/* Hintergründe */
.stx-aurora::before,.stx-aurora::after{content:"";position:absolute;z-index:0;width:62vw;height:62vw;max-width:920px;max-height:920px;border-radius:50%;filter:blur(80px);pointer-events:none}
.stx-aurora::before{top:-34%;right:-14%;background:radial-gradient(circle,rgba(224,0,0,.5) 0,transparent 66%);animation:stx-drift 17s ease-in-out infinite alternate}
.stx-aurora::after{bottom:-44%;left:-18%;background:radial-gradient(circle,rgba(255,110,40,.28) 0,transparent 66%);animation:stx-drift 21s ease-in-out infinite alternate-reverse}
@keyframes stx-drift{to{transform:translate3d(-8%,10%,0) scale(1.15)}}
.stx-grid::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(15,23,42,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.07) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse 75% 70% at 50% 40%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse 75% 70% at 50% 40%,#000 30%,transparent 80%);animation:stx-gridmove 24s linear infinite}
.stx-grid-dark::before{background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px)}
.stx-grid::after{content:"";position:absolute;z-index:0;top:-10%;right:-10%;width:60vw;max-width:900px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(224,0,0,.16),transparent 62%);pointer-events:none}
@keyframes stx-gridmove{to{background-position:44px 44px}}
.stx-dots::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle,rgba(15,23,42,.13) 1.2px,transparent 1.6px) 0 0/22px 22px;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 75% 45%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 60% 70% at 75% 45%,#000 20%,transparent 75%)}
.stx-dots::after{content:"";position:absolute;z-index:0;top:10%;right:5%;width:46vw;max-width:700px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(224,0,0,.12),transparent 65%);animation:stx-breathe 7s ease-in-out infinite;pointer-events:none}
@keyframes stx-breathe{50%{transform:scale(1.12);opacity:.7}}

/* ---------- Übersicht: Fächer aus drei Speichern ---------- */
.stx-fan{min-height:470px;padding:20px 0 80px!important}
.stx-fan>.stx-fan-card{flex:0 0 40%!important;width:40%!important;max-width:40%!important;transition:transform .9s var(--stx-ease),box-shadow .6s}
.stx-fan-0{transform:rotate(-10deg) translate(34%,8%);z-index:1}
.stx-fan-1{transform:translateY(-5%) scale(1.08);z-index:3}
.stx-fan-2{transform:rotate(10deg) translate(-34%,8%);z-index:2}
.stx-fan:hover .stx-fan-0{transform:rotate(-14deg) translate(10%,6%)}
.stx-fan:hover .stx-fan-2{transform:rotate(14deg) translate(-10%,6%)}
.stx-fan:hover .stx-fan-1{transform:translateY(-9%) scale(1.1)}
.stx-fan-card .et_pb_image{animation:stx-float 6s ease-in-out infinite}
.stx-fan-1 .et_pb_image{animation-delay:-2s}.stx-fan-2 .et_pb_image{animation-delay:-4s}
.stx-cell-badge{min-width:210px}
@media(max-width:767px){.stx-fan{min-height:300px;padding-bottom:70px!important}.stx-cell-badge{min-width:0}}

/* Akku-Grafik (Badge im Hero und im Himmel) */
.stx-batt{position:relative;width:34px;height:58px;border:2.5px solid #fff;border-radius:7px;flex:none}
.stx-batt::before{content:"";position:absolute;top:-7px;left:50%;width:12px;height:5px;margin-left:-6px;border-radius:2px 2px 0 0;background:#fff}
.stx-batt i{position:absolute;left:3px;right:3px;bottom:3px;height:calc((100% - 6px) * var(--lvl,.6));border-radius:3px;background:linear-gradient(0deg,#e00000,#ff6b3d);overflow:hidden;transition:height .4s linear}
.stx-batt i::after{content:"";position:absolute;top:0;bottom:0;left:-24px;right:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.28) 0 6px,transparent 6px 12px);opacity:var(--chg,0);animation:stx-stripes 1s linear infinite;will-change:transform}
/* exakt eine Musterperiode (12px Streifenabstand diagonal = 12px*sqrt2 horizontal), sonst springt das Muster */
@keyframes stx-stripes{to{transform:translateX(calc(12px * 1.41421356))}}
.stx-cell-ui{display:flex;align-items:center;gap:14px;color:#fff;font-family:"Plus Jakarta Sans",sans-serif}
.stx-cell-ui b{display:block;font-size:24px;font-weight:800;line-height:1}
.stx-cell-ui span{display:block;font-size:12px;color:#94a3b8;margin-top:4px;letter-spacing:.06em;text-transform:uppercase}

/* ---------- Übersicht: 24 Stunden (Himmel + Akku) ---------- */
.stx-sky{position:relative;min-height:540px;border-radius:32px;overflow:hidden;box-shadow:0 40px 80px -24px rgba(15,23,42,.35)}
.stx-scene{position:absolute;inset:0;font-family:"Plus Jakarta Sans",sans-serif}
.stx-scene .bg{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.stx-scene .bg-0{background:linear-gradient(180deg,#9ec5f0 0%,#fbd3b0 70%,#ffe9d6 100%)}
.stx-scene .bg-1{background:linear-gradient(180deg,#3f8fe8 0%,#8cc4ff 60%,#e3f2ff 100%)}
.stx-scene .bg-2{background:linear-gradient(180deg,#3b2a6b 0%,#c2456b 55%,#ff9a5a 100%)}
.stx-scene .bg-3{background:linear-gradient(180deg,#05070d 0%,#111a33 60%,#1f1b4b 100%)}
.stx-sky[data-step="0"] .bg-0,.stx-sky[data-step="1"] .bg-1,.stx-sky[data-step="2"] .bg-2,.stx-sky[data-step="3"] .bg-3,.stx-sky:not([data-step]) .bg-1{opacity:1}
.stx-scene .sun,.stx-scene .moon{position:absolute;width:70px;height:70px;margin:-35px 0 0 -35px;border-radius:50%;transition:left 1.2s var(--stx-ease),top 1.2s var(--stx-ease),opacity .8s}
.stx-scene .sun{left:var(--sx,50%);top:var(--sy,22%);background:radial-gradient(circle at 35% 35%,#fff6cf,#ffc233 55%,#ff7a1a);box-shadow:0 0 0 14px rgba(255,194,51,.18),0 0 90px rgba(255,150,30,.75)}
.stx-scene .sun::after{content:"";position:absolute;inset:-34px;border-radius:50%;background:repeating-conic-gradient(rgba(255,210,90,.38) 0 6deg,transparent 6deg 30deg);-webkit-mask:radial-gradient(circle,transparent 46%,#000 48%,transparent 72%);mask:radial-gradient(circle,transparent 46%,#000 48%,transparent 72%);animation:stx-spin 22s linear infinite}
.stx-scene .moon{left:72%;top:22%;background:radial-gradient(circle at 65% 40%,transparent 28px,#fef3c7 29px);box-shadow:none;opacity:0}
.stx-scene .stars{position:absolute;inset:0 0 40% 0;opacity:0;transition:opacity 1s;background-image:radial-gradient(1.5px 1.5px at 12% 20%,#fff,transparent),radial-gradient(1.5px 1.5px at 30% 60%,#fff,transparent),radial-gradient(2px 2px at 48% 18%,#fff,transparent),radial-gradient(1.5px 1.5px at 62% 44%,#fff,transparent),radial-gradient(1.5px 1.5px at 85% 12%,#fff,transparent),radial-gradient(2px 2px at 92% 52%,#fff,transparent),radial-gradient(1.5px 1.5px at 20% 80%,#fff,transparent),radial-gradient(1.5px 1.5px at 75% 75%,#fff,transparent);animation:stx-twinkle 3.4s ease-in-out infinite}
.stx-sky[data-step="0"]{--sx:16%;--sy:58%}
.stx-sky[data-step="1"]{--sx:50%;--sy:16%}
.stx-sky[data-step="2"]{--sx:84%;--sy:60%}
.stx-sky[data-step="3"]{--sx:84%;--sy:110%}
.stx-sky[data-step="3"] .sun{opacity:0}
.stx-sky[data-step="3"] .moon,.stx-sky[data-step="3"] .stars{opacity:1}
.stx-scene .hill{position:absolute;left:-10%;right:-10%;bottom:0;height:34%;border-radius:50% 50% 0 0/100% 100% 0 0;background:linear-gradient(180deg,rgba(15,23,42,.55),rgba(15,23,42,.85))}
.stx-scene .hill-2{left:30%;right:-30%;height:26%;background:linear-gradient(180deg,rgba(15,23,42,.7),#0b1120)}
.stx-scene .house{position:absolute;left:14%;bottom:27%;width:120px;height:78px;background:#0b1120;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.stx-scene .house::before{content:"";position:absolute;left:-12px;right:-12px;bottom:100%;height:56px;background:#0b1120;clip-path:polygon(50% 0,100% 100%,0 100%)}
.stx-scene .house::after{content:"";position:absolute;left:22px;top:24px;width:22px;height:22px;background:#ffd36b;box-shadow:52px 0 0 #ffd36b;opacity:.15;transition:opacity .8s}
.stx-sky[data-step="0"] .house::after,.stx-sky[data-step="2"] .house::after,.stx-sky[data-step="3"] .house::after{opacity:1}
.stx-scene .panel{position:absolute;left:calc(14% + 8px);bottom:calc(27% + 98px);width:68px;height:10px;transform:skewX(-30deg) rotate(-25deg);background:linear-gradient(90deg,#1e293b,#334155);border:1px solid #64748b}
.stx-scene .flow{position:absolute;left:calc(14% + 130px);bottom:calc(27% + 30px);width:calc(52% - 130px);height:6px;background:radial-gradient(circle,#ff6b3d 0 2.5px,transparent 3px) 0 50%/14px 6px repeat-x;opacity:0;transition:opacity .6s}
.stx-sky[data-step="1"] .flow{opacity:1;animation:stx-dots-x .6s linear infinite}
.stx-sky[data-step="0"] .flow,.stx-sky[data-step="2"] .flow{opacity:1;animation:stx-dots-x .6s linear infinite reverse}
@keyframes stx-dots-x{to{background-position:14px 50%}}
.stx-scene .meter{position:absolute;right:10%;bottom:12%;display:flex;flex-direction:column;align-items:center;gap:12px;color:#fff}
.stx-scene .meter .stx-batt{width:86px;height:150px;border-width:4px;border-radius:16px;background:rgba(15,23,42,.35);backdrop-filter:blur(6px)}
.stx-scene .meter .stx-batt::before{width:30px;height:9px;margin-left:-15px;top:-13px}
.stx-scene .meter .stx-batt i{left:7px;right:7px;bottom:7px;height:calc((100% - 14px) * var(--lvl));border-radius:9px;transition:height 1.2s var(--stx-ease)}
.stx-scene .meter b{font-size:30px;font-weight:800;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.stx-scene .meter span{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:6px 12px;border-radius:999px;background:rgba(15,23,42,.55)}
.stx-sky[data-step="0"]{--lvl:.35}.stx-sky[data-step="1"]{--lvl:.8;--chg:1}.stx-sky[data-step="2"]{--lvl:.65}.stx-sky[data-step="3"]{--lvl:.08}
.stx-scene .clock{position:absolute;left:28px;top:24px;color:#fff;font:800 44px/1 "Plus Jakarta Sans",sans-serif;letter-spacing:-.02em;text-shadow:0 2px 18px rgba(0,0,0,.3)}
@media(max-width:767px){.stx-sky{min-height:380px}.stx-scene .house{width:84px;height:56px;left:8%;bottom:24%}.stx-scene .house::before{height:40px}.stx-scene .house::after{left:14px;top:16px;width:16px;height:16px;box-shadow:38px 0 0 #ffd36b}.stx-scene .panel{left:calc(8% + 6px);bottom:calc(24% + 70px);width:48px}.stx-scene .flow{left:calc(8% + 92px);bottom:calc(24% + 22px);width:calc(56% - 92px)}.stx-scene .meter .stx-batt{width:64px;height:110px}.stx-scene .clock{font-size:32px}}

/* Scrollytelling (Übersicht, GoodWe, Solarwatt) */
@media(min-width:981px){
 .stx-scrolly,.stx-scrolly-lite{align-items:flex-start!important}
 .stx-sticky{position:sticky!important;top:112px;align-self:flex-start!important}
 .stx-step{min-height:52vh;justify-content:center!important}
 .stx-js .stx-scrolly .stx-step{opacity:.25;transform:translateX(14px);transition:opacity .6s,transform .8s var(--stx-ease)}
 .stx-js .stx-scrolly .stx-step.is-active{opacity:1;transform:none}
 .stx-day .stx-sky{min-height:calc(100vh - 220px);max-height:640px}
}
@media(max-width:980px){.stx-steps>.stx-step:not(.stx-pack-txt){padding-bottom:40px!important}.stx-steps>.stx-step:last-child{padding-bottom:0!important}}

/* ---------- Übersicht: Herstellerkarten ---------- */
.stx-brand{position:relative!important}
.stx-brand .stx-stretch,.stx-brand .stx-stretch .et_pb_text_inner,.stx-brand .stx-stretch p,.stx-brand .stx-stretch a{position:static!important}
.stx-stretch a::after{content:"";position:absolute;inset:0;z-index:5;border-radius:30px}
.stx-stretch a{font-weight:800}
.stx-zoom{overflow:hidden}
.stx-zoom img{transition:transform .9s var(--stx-ease)}
.stx-brand:hover .stx-zoom img{transform:scale(1.07) rotate(-1.5deg)}
.stx-meter{position:relative;height:34px;justify-content:center!important;padding-left:14px!important;border-radius:999px;background:#eceef2;overflow:hidden}
.stx-meter::before{content:"";position:absolute;inset:0;width:var(--w,50%);border-radius:inherit;background:linear-gradient(90deg,#e00000,#ff5a3c);transform-origin:left;transition:transform 1.8s var(--stx-ease) .2s}
.stx-js .stx-meter:not(.is-in)::before{transform:scaleX(0)}
.stx-meter>.et_pb_module{position:relative;z-index:1;margin-left:14px!important}
.stx-meter p{color:#fff!important}
.stx-w-48{--w:48%}.stx-w-92{--w:92%}.stx-w-100{--w:100%}

/* ---------- GoodWe: Geräte rasten ein ---------- */
.stx-snap{overflow:visible}
.stx-snap-top{animation:stx-drop-top 1s var(--stx-ease) .3s both,stx-reclick 6s ease-in-out 2.4s infinite;position:relative;z-index:2}
.stx-snap-bottom{animation:stx-drop-bot 1s var(--stx-ease) .3s both}
@keyframes stx-drop-top{from{opacity:0;transform:translateY(-80px)}}
@keyframes stx-drop-bot{from{opacity:0;transform:translateY(80px)}}
@keyframes stx-reclick{0%,78%,100%{transform:none}86%{transform:translateY(-16px)}92%{transform:translateY(2px)}}
.stx-seam{position:relative;height:12px;margin:0 10%!important}
.stx-seam::before{content:"";position:absolute;left:0;right:0;top:50%;height:3px;margin-top:-1.5px;border-radius:3px;background:linear-gradient(90deg,transparent,#e00000 20%,#ff8a3c 50%,#e00000 80%,transparent);box-shadow:0 0 18px rgba(224,0,0,.8);animation:stx-seam-in .7s 1.1s both,stx-seam-pulse 6s ease-in-out 2.4s infinite}
@keyframes stx-seam-in{from{transform:scaleX(0);opacity:0}}
@keyframes stx-seam-pulse{0%,88%{opacity:.35}92%{opacity:1;transform:scaleY(2)}100%{opacity:.35}}

/* GoodWe: Modulstapel */
.stx-stackviz{display:flex!important;align-items:center!important;justify-content:center!important;min-height:520px;border-radius:32px;background:radial-gradient(circle at 50% 40%,#fff1f1,#fff 62%);border:1px solid #eef0f3}
.stx-stack{display:flex;flex-direction:column;align-items:center;gap:6px;width:min(280px,80%);padding:30px 0}
.stx-stack>div{position:relative;width:100%;border-radius:14px;background:linear-gradient(180deg,#fff,#eef1f5);border:1px solid #dfe3ea;box-shadow:0 18px 30px -18px rgba(15,23,42,.35);display:flex;align-items:center;justify-content:space-between;padding:0 18px;font:700 13px/1 "Plus Jakarta Sans",sans-serif;color:#475569;transition:transform .8s var(--stx-ease),opacity .6s}
.stx-stack .inv{height:120px}
.stx-stack .inv::after{content:"";width:34px;height:34px;border-radius:50%;background:conic-gradient(#e00000,#ff9f1c,#22c55e,#3b82f6,#e00000);-webkit-mask:radial-gradient(circle,transparent 11px,#000 12px);mask:radial-gradient(circle,transparent 11px,#000 12px);animation:stx-spin 6s linear infinite}
.stx-stack .mod{height:66px}
.stx-stack .mod em{font-style:normal;color:#e00000;font-weight:800}
.stx-stack .ghost{background:transparent;border:2px dashed rgba(224,0,0,.45);box-shadow:none;color:#e00000}
.stx-js .stx-build:not([data-step="1"]):not([data-step="2"]) .stx-stack .mod,.stx-js .stx-build[data-step="1"] .stx-stack .ghost{opacity:0;transform:translateY(-40px)}
.stx-build[data-step="2"] .stx-stack .ghost{animation:stx-ghost 2.4s ease-in-out infinite}
.stx-stack .ghost:nth-child(4){transition-delay:.15s}.stx-stack .ghost:nth-child(5){transition-delay:.3s}
@keyframes stx-ghost{50%{border-color:rgba(224,0,0,.9)}}
@media(max-width:980px){.stx-stackviz{min-height:420px}.stx-js .stx-build .stx-stack>div{opacity:1!important;transform:none!important}}

/* Symbol-Mikroanimationen */
.stx-pulse .et_pb_icon_wrap{animation:stx-pulse 2.2s ease-in-out infinite}
.stx-flash .et_pb_icon_wrap{animation:stx-flash 2.8s ease-in-out infinite}
.stx-wiggle .et_pb_icon_wrap{animation:stx-wiggle 3.2s ease-in-out infinite}
@keyframes stx-pulse{50%{transform:scale(1.18)}}
@keyframes stx-flash{0%,70%,100%{opacity:1}75%{opacity:.2}80%{opacity:1}85%{opacity:.3}}
@keyframes stx-wiggle{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-12deg)}80%{transform:rotate(10deg)}90%{transform:rotate(-4deg)}}
@keyframes stx-spin{to{transform:rotate(360deg)}}
@keyframes stx-twinkle{50%{opacity:.55}}

/* Zahlen */
.stx-num p{color:transparent!important;-webkit-text-stroke:1.5px var(--stx-red);transition:color .5s}
.stx-dark .stx-num p{-webkit-text-stroke-color:#ff5a4d}
.stx-step.is-active .stx-num p,.stx-num-fill p{color:var(--stx-red)!important}

/* Zeitleiste (GoodWe) */
.stx-timeline{position:relative}
.stx-timeline::before,.stx-timeline::after{content:"";position:absolute;left:0;right:0;top:27px;height:2px;border-radius:2px;background:rgba(15,23,42,.12)}
.stx-timeline::after{background:linear-gradient(90deg,var(--stx-red),var(--stx-red-2));transform-origin:left;transform:scaleX(var(--p,1))}
.stx-timeline>.et_pb_column{position:relative;z-index:1}
.stx-dot{transition:background .5s,box-shadow .5s,transform .5s var(--stx-ease)}
.stx-dot p{transition:color .5s}
.stx-timeline[data-reached="1"]>.et_pb_column:nth-child(-n+1) .stx-dot,.stx-timeline[data-reached="2"]>.et_pb_column:nth-child(-n+2) .stx-dot,.stx-timeline[data-reached="3"]>.et_pb_column:nth-child(-n+3) .stx-dot,.stx-timeline[data-reached="4"]>.et_pb_column .stx-dot{background:var(--stx-red)!important;box-shadow:0 0 0 8px rgba(224,0,0,.12);transform:scale(1.06)}
.stx-timeline[data-reached="1"]>.et_pb_column:nth-child(-n+1) .stx-dot p,.stx-timeline[data-reached="2"]>.et_pb_column:nth-child(-n+2) .stx-dot p,.stx-timeline[data-reached="3"]>.et_pb_column:nth-child(-n+3) .stx-dot p,.stx-timeline[data-reached="4"]>.et_pb_column .stx-dot p{color:#fff!important}
@media(max-width:980px){
 .stx-timeline::before,.stx-timeline::after{left:27px;right:auto;top:0;bottom:0;width:2px;height:auto}
 .stx-timeline::after{transform-origin:top;transform:scaleY(var(--p,1))}
}

/* Glanz */
.stx-shine{position:relative;overflow:hidden}
.stx-shine::after{content:"";position:absolute;top:-50%;bottom:-50%;left:-30%;width:22%;transform:translateX(-120%) rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);animation:stx-shine 6s ease-in-out 1s infinite;pointer-events:none}
@keyframes stx-shine{0%,60%{transform:translateX(-120%) rotate(18deg)}100%{transform:translateX(720%) rotate(18deg)}}

/* ---------- Sungrow: Ladering ---------- */
.stx-monitor{min-height:540px;align-items:center!important;justify-content:center!important}
.stx-monitor>.stx-ring{position:absolute!important;inset:0;margin:0!important;display:grid!important;place-items:center!important;pointer-events:none}
.stx-ring svg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(470px,100%);height:auto;overflow:visible}
.stx-ring .trk{stroke:rgba(255,255,255,.08)}
.stx-ring .ticks{stroke:rgba(255,255,255,.18)}
.stx-ring .orbit{transform-origin:50% 50%;animation:stx-spin 9s linear infinite}
.stx-ring-core{width:330px!important;max-width:330px!important;height:330px!important;flex:none!important;justify-content:center!important;align-items:center!important;position:relative;z-index:2;box-shadow:0 0 0 10px rgba(255,255,255,.04),0 30px 80px -20px rgba(0,0,0,.6)}
.stx-ring-core .et_pb_image{width:100%}
.stx-soc{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;background:rgba(15,23,42,.85);border:1px solid rgba(255,255,255,.14);color:#fff;font:800 22px/1 "Plus Jakarta Sans",sans-serif;white-space:nowrap}
.stx-soc span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#94a3b8}
@media(max-width:767px){.stx-monitor{min-height:400px}.stx-ring svg{width:min(340px,100%)}.stx-ring-core{width:236px!important;max-width:236px!important;height:236px!important}.stx-soc{font-size:18px}}

/* Sungrow: Modulturm */
.stx-modules{display:flex!important;align-items:center!important;justify-content:center!important}
.stx-tower{display:flex;flex-direction:column-reverse;gap:7px;width:min(320px,90%);padding:18px;border-radius:22px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1)}
.stx-tower div{height:40px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;font:700 13px/1 "Plus Jakarta Sans",sans-serif;color:rgba(255,255,255,.45);border:1.5px dashed rgba(255,255,255,.18);transition:background .6s,border-color .6s,color .6s,box-shadow .6s}
.stx-tower .on{color:#fff;border:1.5px solid transparent}
.stx-modules.is-in .stx-tower .on{background:linear-gradient(90deg,#b90000,#ff5a3c);box-shadow:0 10px 30px -10px rgba(224,0,0,.8)}
.stx-modules:not(.is-in) .stx-tower .on{background:rgba(255,255,255,.08)}
.stx-tower .on:nth-child(2){transition-delay:.35s}.stx-tower .on:nth-child(3){transition-delay:.7s}
.stx-modules.is-in .stx-tower .off{animation:stx-twinkle 3s ease-in-out infinite}
.stx-tower .on::after{content:"";width:8px;height:8px;border-radius:50%;background:#7CFFB2;box-shadow:0 0 10px #7CFFB2}

/* Sungrow: Tageskurve */
.stx-curve svg{display:block;width:100%;height:auto;font-family:"Plus Jakarta Sans",sans-serif}
.stx-curve .ln{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.stx-js .stx-curve .ln{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 2.2s var(--stx-ease)}
.stx-js .stx-curve .area{opacity:0;transition:opacity 1s 1.4s}
.stx-curve.is-in .ln{stroke-dashoffset:0}
.stx-curve.is-in .area{opacity:1}
.stx-curve .cursor{animation:stx-cursor 12s linear infinite}
@keyframes stx-cursor{from{transform:translateX(0)}to{transform:translateX(720px)}}
.stx-key{width:22px!important;height:8px;border-radius:4px;flex:none!important}
.stx-key--sun{background:#ffb020}.stx-key--use{background:#0f172a}.stx-key--bat{background:linear-gradient(90deg,rgba(224,0,0,.45),rgba(255,138,60,.45))}

/* Orbit hinter dem Wechselrichter */
.stx-orbit{position:relative;isolation:isolate}
.stx-orbit::before{content:"";position:absolute;z-index:-1;left:50%;top:50%;width:min(92%,500px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:2px dashed rgba(224,0,0,.3);animation:stx-orbit 36s linear infinite}
.stx-orbit::after{content:"";position:absolute;z-index:-1;left:50%;top:50%;width:min(66%,360px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fff1f1 0,#fff7f7 55%,transparent 72%)}
@keyframes stx-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* ---------- Solarwatt ---------- */
.stx-hero-copy{position:relative}
.stx-hero-copy>.et_pb_module:not(.stx-outline){position:relative;z-index:1}
.stx-outline{position:absolute!important;top:-80px;left:-14px;z-index:0!important;margin:0!important;pointer-events:none;transform:translateY(calc(var(--p,.5) * 90px - 45px))}
.stx-outline p{font-size:clamp(140px,17vw,300px)!important;line-height:.8!important;font-weight:800!important;letter-spacing:-.06em!important;color:transparent!important;-webkit-text-stroke:2px rgba(224,0,0,.16);white-space:nowrap}
.stx-tilt{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--stx-ease);will-change:transform}
.stx-tilt img{filter:drop-shadow(0 34px 40px rgba(15,23,42,.28))}

/* Pack für Pack */
.stx-packs{display:flex!important;align-items:center!important;justify-content:center!important;min-height:540px;border-radius:32px;background:radial-gradient(circle at 50% 70%,rgba(224,0,0,.18),transparent 60%),linear-gradient(180deg,#121419,#07080b);border:1px solid rgba(255,255,255,.08)}
.stx-pack-ui{display:flex;flex-direction:column;align-items:center;gap:26px;width:min(320px,82%)}
.stx-pack-ui .total{color:#fff;font:800 64px/1 "Plus Jakarta Sans",sans-serif;letter-spacing:-.03em}
.stx-pack-ui .total small{font-size:26px;color:#ff5a4d;margin-left:6px}
.stx-pack-stack{display:flex;flex-direction:column-reverse;gap:6px;width:100%}
.stx-pack-stack div{position:relative;height:62px;border-radius:12px;background:linear-gradient(180deg,#2a2d35,#15171c);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:box-shadow .7s,border-color .7s}
.stx-pack-stack div:last-child{height:78px;border-radius:12px 12px 16px 16px}
.stx-pack-stack div::after{content:"";position:absolute;left:18px;right:18px;top:50%;height:3px;margin-top:-1.5px;border-radius:3px;background:rgba(255,255,255,.12);transition:background .7s,box-shadow .7s}
.stx-pack-stack div.lit{border-color:rgba(255,90,77,.45);box-shadow:0 0 40px -10px rgba(224,0,0,.7),inset 0 1px 0 rgba(255,255,255,.1)}
.stx-pack-stack div.lit::after{background:linear-gradient(90deg,#e00000,#ff8a3c);box-shadow:0 0 14px #ff5a3c}
.stx-pack-ui .lbl{font:800 12px/1 "Plus Jakarta Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#94a3b8}
@media(max-width:980px){.stx-packs{min-height:440px}}
.stx-rule{position:relative;padding-top:28px!important;border-top:2px solid #e5e8ee}
.stx-rule::before{content:"";position:absolute;top:-2px;left:0;width:90px;height:2px;background:var(--stx-red);transform-origin:left;transition:transform 1.4s var(--stx-ease)}
.stx-js .stx-rule:not(.is-in)::before{transform:scaleX(0)}
.stx-bento>.et_pb_column{overflow:hidden}
.stx-bento>.et_pb_column img{transition:transform .9s var(--stx-ease)}
.stx-bento>.et_pb_column:hover img{transform:scale(1.06) rotate(-1deg)}

@media(prefers-reduced-motion:reduce){
 .stx-page [class*="stx-"],.stx-page [class*="stx-"]::before,.stx-page [class*="stx-"]::after,.stx-page [class*="stx-"] *{animation:none!important;transition:none!important}
 .stx-js .stx-scrolly .stx-step{opacity:1!important;transform:none!important}
 .stx-js .stx-meter::before,.stx-js .stx-rule::before{transform:none!important}
 .stx-timeline::after{transform:none!important}
 .stx-js .stx-curve .ln{stroke-dashoffset:0!important}.stx-js .stx-curve .area{opacity:1!important}
 .stx-tilt,.stx-outline{transform:none!important}
 .stx-js .stx-build .stx-stack>div{opacity:1!important;transform:none!important}
}

@media(min-width:981px){.stx-pack-txt{min-height:36vh}}

/* Divi erzeugt für diese Seiten die nachgeladene Modul-CSS (et-divi-dynamic-<id>.css) nicht: Icon-Schrift sowie
   Icon-/Trennlinien-Modulregeln deshalb hier (Quelle: Divi 5.13.1, et-divi-dynamic der Wärmepumpen-Seite). */
@font-face{font-family:FontAwesome;font-style:normal;font-weight:900;font-display:swap;src:url(/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.woff2) format("woff2"),url(/wp-content/themes/Divi/core/admin/fonts/fontawesome/fa-solid-900.woff) format("woff")}
.et_pb_code_inner{position:relative}
.et_pb_space{box-sizing:content-box;height:23px}.et_pb_divider_hidden{margin-bottom:0!important}.et_pb_divider_internal{display:inline-block;width:100%}.et_pb_divider{margin:0 0 30px;position:relative}.et_pb_divider:before{content:"";width:100%;height:1px;border-top:1px solid rgba(0,0,0,.1);position:absolute;left:0;top:0;z-index:10}.et_pb_divider:after,.et_pb_space:after{content:"";display:table}.et_pb_divider_position_bottom:before{top:auto!important;bottom:0!important}.et_pb_divider_position_center:before{top:50%!important}@media (max-width:980px){.et_pb_divider_position_top_tablet:before{top:0!important;bottom:auto!important}.et_pb_divider_position_bottom_tablet:before{top:auto!important;bottom:0!important}.et_pb_divider_position_center_tablet:before{top:50%!important}.et_pb_space.et-hide-mobile{display:none}}@media (max-width:767px){.et_pb_divider_position_top_phone:before{top:0!important;bottom:auto!important}.et_pb_divider_position_bottom_phone:before{top:auto!important;bottom:0!important}.et_pb_divider_position_center_phone:before{top:50%!important}}.ie .et_pb_divider{overflow:visible}
.et_pb_icon{text-align:center;height:auto}.et_pb_icon.et_clickable,.et_pb_icon:is(a){cursor:pointer}.et_pb_icon .et-pb-icon{position:relative}.et_pb_icon .et_pb_icon_wrap{display:inline-block;border-style:solid;border-width:0;line-height:0;animation-fill-mode:both;background-size:cover;position:relative}.et_pb_icon.et_flex_module{align-self:var(--et-pb-icon-self-align,center)}
.et_pb_with_border .et_pb_image_wrap{border:0 solid #333}.et_pb_image{margin-left:auto;margin-right:auto;line-height:0}.et_pb_image .et_pb_module{line-height:1.7em}.et_flex_column>.et_pb_image,.et_flex_group>.et_pb_image,.et_grid_column>.et_pb_image,.et_grid_group>.et_pb_image,.et_grid_module>.et_pb_image{margin-left:unset;margin-right:unset}.et_pb_image.aligncenter{text-align:center}.et_pb_image.et_pb_has_overlay a.et_pb_lightbox_image{display:block;position:relative}.et_pb_image.et_block_module{display:block}.et_pb_image .et_pb_image_wrap{display:inline-block;position:relative;max-width:100%}.et_pb_image .et_pb_image_wrap img[src*=".svg"]{width:auto}.et_pb_image:where(.et_flex_module)>.et_pb_image_wrap{width:-moz-fit-content;width:fit-content;display:flex}.et_pb_image img{position:relative}.et_pb_image_sticky{margin-bottom:0!important;display:inherit}.et_pb_image.et_pb_has_overlay:hover .et_pb_image_wrap .et_overlay{z-index:3;opacity:1}@media (min-width:981px){.et_pb_section_sticky,.et_pb_section_sticky.et_pb_bottom_divider .et_pb_row:nth-last-child(2),.et_pb_section_sticky .et_pb_column_single,.et_pb_section_sticky .et_pb_row.et-last-child,.et_pb_section_sticky .et_pb_row:last-child,.et_pb_section_sticky .et_pb_specialty_column .et_pb_row_inner.et-last-child,.et_pb_section_sticky .et_pb_specialty_column .et_pb_row_inner:last-child{padding-bottom:0!important}}@media (max-width:980px){.et_pb_image_sticky_tablet{margin-bottom:0!important;display:inherit}.et_pb_section_sticky_mobile,.et_pb_section_sticky_mobile.et_pb_bottom_divider .et_pb_row:nth-last-child(2),.et_pb_section_sticky_mobile .et_pb_column_single,.et_pb_section_sticky_mobile .et_pb_row.et-last-child,.et_pb_section_sticky_mobile .et_pb_row:last-child,.et_pb_section_sticky_mobile .et_pb_specialty_column .et_pb_row_inner.et-last-child,.et_pb_section_sticky_mobile .et_pb_specialty_column .et_pb_row_inner:last-child{padding-bottom:0!important}.et_pb_section_sticky .et_pb_row.et-last-child .et_pb_column.et_pb_row_sticky.et-last-child,.et_pb_section_sticky .et_pb_row:last-child .et_pb_column.et_pb_row_sticky:last-child{margin-bottom:0}.et_pb_image_bottom_space_tablet{margin-bottom:30px!important;display:block}.et_always_center_on_mobile{text-align:center!important;margin-left:auto!important;margin-right:auto!important}}@media (max-width:767px){.et_pb_image_sticky_phone{margin-bottom:0!important;display:inherit}.et_pb_image_bottom_space_phone{margin-bottom:30px!important;display:block}}
.et_overlay{z-index:-1;position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:hsla(0,0%,100%,.9);opacity:0;pointer-events:none;transition:all .3s;border:1px solid #e5e5e5;box-sizing:border-box;backface-visibility:hidden;-webkit-font-smoothing:antialiased}.et_overlay:before{color:#2ea3f2;content:"\E050";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:32px;transition:all .4s}.et_portfolio_image,.et_shop_image{position:relative;display:block}.et_pb_has_overlay:not(.et_pb_image):hover .et_overlay,.et_portfolio_image:hover .et_overlay,.et_shop_image:hover .et_overlay{z-index:3;opacity:1}#ie7 .et_overlay,#ie8 .et_overlay{display:none}.et_pb_module.et_pb_has_overlay{position:relative}.et_pb_module.et_pb_has_overlay .et_overlay,article.et_pb_has_overlay{border:none}
