/* billigxxl · Version 2026.11.03.1 */
.strom{--blue:#075fff;--navy:#0c1f44;--muted:#4d607d;--line:#dce5f1;--pale:#eef5ff;--price:#a84000;color-scheme:light}
.strom img{display:block;max-width:100%}
.strom svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.wrap,.hp-wrap{width:min(1360px,calc(100% - 48px));margin-inline:auto}
html{scroll-padding-top:150px}.skip{position:fixed;top:8px;left:16px;z-index:40;transform:translateY(-160%);background:white;padding:12px 20px;min-height:44px}.skip:focus{transform:none}summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.strom{--ink:#0c1f44;--soft:#f0f5fb;background:#fff;color:var(--ink);padding-bottom:0}.strom h1,.strom h2,.strom h3{text-wrap:balance}.strom h1{font-size:clamp(40px,3.5vw,68px);font-weight:850;line-height:1.04;letter-spacing:-.04em}.strom h2{font-size:clamp(28px,2.2vw,40px);font-weight:800;line-height:1.12;letter-spacing:-.035em}.strom h3{font-weight:750;letter-spacing:-.025em}.strom .hero{position:relative;height:530px;background:#eaf3fc}.hero picture{position:absolute;inset:0}.hero picture img{width:100%;height:100%;object-fit:cover}.hero-content{position:relative;padding-top:65px}.hero-title-box{max-width:720px}.hero-content p{margin-top:24px;max-width:530px;font-size:20px;line-height:1.5}.selector{position:relative;background:white;border-radius:24px;box-shadow:0 16px 42px #0c1f441c;padding:24px 28px;margin-top:-90px}.route-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.route{display:flex;align-items:center;gap:12px;color:var(--navy);text-decoration:none;min-height:68px;font-weight:750;padding:12px 16px;border-radius:12px;line-height:1.3}.route>svg:first-child{width:26px;height:26px;color:var(--blue)}.route>svg:last-child{width:20px;height:20px;margin-left:auto;color:var(--blue)}.route:hover{background:#e4eeff}.route-strom{background:#edf4ff;color:#004ac7}.selector-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}.partner{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:14px}.partner-logo{width:108px;height:30px;object-fit:contain}.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:54px;min-width:44px;padding:14px 24px;border:0;border-radius:10px;background:#075fff;color:white;text-decoration:none;font-size:16px;font-weight:750;line-height:1.3}.button:hover{background:#004bd5}.button svg{width:20px;height:20px}.facts{display:flex;align-items:center;justify-content:center;gap:32px;padding-top:28px;padding-bottom:10px;color:#354b69;font-size:14px;font-weight:600}.facts>span{display:flex;align-items:center;gap:9px}.facts svg{width:18px;height:18px}.needs{padding-top:60px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.section-heading p{font-size:16px;color:var(--muted)}.photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.photo-card{min-width:0;display:flex;flex-direction:column;color:var(--navy);text-decoration:none;position:relative}.photo-frame{overflow:hidden;border-radius:18px;background:#e7eef4}.photo-frame img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.photo-label{padding:18px 0 0;display:flex;flex-direction:column;flex:1}.photo-label h3{font-size:23px;line-height:1.2;max-width:290px}.photo-label>span{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:14px;color:#004ac7;font-size:14px;min-height:44px}.photo-card:hover .photo-label h3{text-decoration:underline;text-underline-offset:5px}.photo-label svg{width:20px;height:20px}.knowledge{margin-top:80px}.knowledge h2{margin-bottom:32px}.knowledge-split{display:grid;grid-template-columns:1fr 1fr;gap:72px}.knowledge-block h3{font-size:24px;line-height:1.2;margin-bottom:16px}.knowledge-block nav{display:flex;flex-wrap:wrap;gap:8px 28px}.knowledge-block a{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;font-size:16px;font-weight:650;text-decoration:none;max-width:100%;line-height:1.4}.knowledge-block a:hover{text-decoration:underline}.knowledge-block a svg{width:18px;height:18px}.seo{margin-top:80px;padding-top:56px;padding-bottom:64px;border-top:1px solid var(--line);display:grid;grid-template-columns:.85fr 1.15fr;gap:90px}.seo-intro h2{font-size:28px;max-width:450px}.seo-intro p{margin-top:22px;color:var(--muted);max-width:58ch;line-height:1.7}.faq h2{font-size:26px;margin-bottom:18px}.faq details{border-bottom:1px solid var(--line)}.faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;min-height:60px;font-weight:700;font-size:16px;cursor:pointer;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary>span{font-size:26px;font-weight:400;flex:none}.faq details[open] summary>span{transform:rotate(45deg)}.faq details>div{padding:0 0 18px;color:var(--muted)}.faq details p{line-height:1.7;max-width:65ch}.faq details a{display:inline-flex;align-items:center;gap:12px;min-height:48px;font-weight:650;margin-top:8px}.preview-menu form{margin:0}.preview-menu .button{margin-top:16px}.preview-menu::backdrop{background:#0c1f4466}.preview-menu{overscroll-behavior:contain}.preview-menu nav{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.preview-menu a{font-size:16px}.preview-menu .button{font-size:16px}
@media(min-width:601px) and (max-width:1100px){.strom .wrap{width:calc(100% - 48px)}.strom .hero{height:470px}.hero-content{padding-top:48px}.strom h1{font-size:48px}.hero-title-box{max-width:520px}.hero-content p{font-size:18px;max-width:400px}.selector{padding:20px}.route-nav{gap:6px}.route{padding:12px 8px;gap:8px;font-size:14px}.route>svg:first-child{width:22px;height:22px}.route>svg:last-child{display:none}.facts{gap:14px;justify-content:space-between;align-items:start}.facts>span{flex:1;align-items:start;gap:6px}.facts svg{flex:none;margin-top:2px}.needs{padding-top:42px}.photo-grid{gap:12px}.photo-label h3{font-size:19px;max-width:180px}.photo-frame img{aspect-ratio:3/4}.photo-label>span{font-size:14px;align-items:start;line-height:1.45}.section-heading p{font-size:14px}.knowledge{margin-top:60px}.knowledge-split{gap:32px}.knowledge-block h3{font-size:21px}.seo{gap:36px;margin-top:60px}.seo-intro h2{font-size:26px}.faq h2{font-size:24px}}
@media(max-width:600px){html{scroll-padding-top:148px}.wrap,.strom .wrap{width:calc(100% - 32px)}.strom .hero{height:460px}.hero picture img{object-position:center}.hero-content{padding-top:28px}.strom h1{font-size:40px;letter-spacing:-.035em}.hero-content p{font-size:16px;max-width:300px;margin-top:18px}.hero-title-box{padding:18px 18px 20px;background:#f4f9fe;max-width:100%;border-radius:16px}.selector{padding:18px;margin-top:-54px;border-radius:20px}.route-nav{grid-template-columns:1fr 1fr;gap:8px}.route{font-size:16px;gap:8px;min-height:78px;padding:12px;flex-wrap:wrap;align-content:center}.route span{flex:1;min-width:80px}.route>svg:first-child{width:24px;height:24px}.route>svg:last-child{display:none}.selector-bottom{margin-top:16px;padding-top:16px;gap:16px;flex-direction:column;align-items:stretch}.partner{justify-content:center}.button{width:100%;gap:20px;min-height:54px}.facts{gap:10px 16px;flex-direction:column;align-items:start;padding-top:24px;font-size:14px}.facts>span{gap:10px}.needs{padding-top:36px}.section-heading{display:block;margin-bottom:20px}.section-heading p{margin-top:10px;font-size:16px}.strom h2{font-size:30px}.photo-grid{grid-template-columns:1fr;gap:24px}.photo-frame{border-radius:16px}.photo-frame img{aspect-ratio:4/3}.photo-label{padding-top:14px}.photo-label h3{font-size:25px;max-width:310px}.photo-label>span{padding-top:8px;font-size:15px}.knowledge{margin-top:48px}.knowledge h2{margin-bottom:26px}.knowledge-split{grid-template-columns:1fr;gap:32px}.knowledge-block h3{font-size:23px;margin-bottom:12px}.knowledge-block nav{gap:4px 24px}.knowledge-block a{font-size:16px;min-height:48px}.seo{margin-top:48px;padding-top:36px;padding-bottom:40px;grid-template-columns:1fr;gap:36px}.seo-intro h2{font-size:27px}.seo-intro p{margin-top:18px}.faq h2{font-size:26px}.faq summary{font-size:16px;padding:18px 0}}
@media(prefers-reduced-motion:no-preference){.selector{animation:arrive .5s cubic-bezier(.16,1,.3,1) both}.photo-frame img{transition:transform .4s cubic-bezier(.16,1,.3,1)}.photo-card:hover img{transform:scale(1.025)}@keyframes arrive{from{transform:translateY(10px)}to{transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.photo-label h3{overflow-wrap:anywhere}.knowledge-block a{color:#004ac7}
/* Windlandschaft und großzügige Auswahl. */
.variant-b{background:#f7faf5}.variant-b:not(.hero-a) .hero{height:580px}.variant-b:not(.hero-a) .hero-content{padding-top:64px}.variant-b:not(.hero-a) .hero-title-box{background:#f4f9ed;padding:30px 36px;max-width:730px;border-radius:4px 60px 4px 4px}.variant-b:not(.hero-a) h1{font-size:64px}.variant-b:not(.hero-a) .hero-content p{max-width:540px}.selector-b{margin-top:-106px;padding:28px 32px}.selector-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.strom .selector-heading h2{font-size:26px}.selector-b .route-nav{gap:16px}.selector-b .route{background:#f1f6ed;min-height:90px;border-radius:14px;padding:16px 20px}.selector-b .route-strom{background:#eaf1ff}.selector-b .route:hover{background:#e0ebd9}.selector-b .selector-bottom{border:0;padding-top:0}.selector-bottom>span:not(.partner){font-size:16px;color:var(--muted)}.variant-b .photo-card{background:white;border-radius:20px;overflow:hidden}.variant-b .photo-frame{border-radius:0}.variant-b .photo-label{padding:20px 22px}.variant-b .photo-label h3{font-size:23px}.variant-b .knowledge-band{margin-top:80px;background:#eaf2e3;padding:56px 0}.variant-b .knowledge{margin-top:0;display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.variant-b .knowledge-intro h2{font-size:46px;max-width:400px}.variant-b .knowledge-split{gap:36px}.variant-b .knowledge-block nav{flex-direction:column;align-items:start}.variant-b .knowledge-block h3{font-size:21px}.variant-b .seo{border-top:0;margin-top:0;padding-top:64px}
@media(min-width:601px) and (max-width:1100px){.variant-b:not(.hero-a) .hero{height:530px}.variant-b:not(.hero-a) .hero-content{padding-top:48px}.variant-b:not(.hero-a) .hero-title-box{max-width:560px;padding:26px}.variant-b:not(.hero-a) h1{font-size:48px}.selector-b .route{padding:14px 10px}.selector-b .route-nav{gap:8px}.selector-b{padding:22px}.strom .selector-heading h2{font-size:23px}.variant-b .photo-label{padding:16px 12px}.variant-b .photo-label h3{font-size:19px}.variant-b .knowledge{grid-template-columns:1fr;gap:20px}.variant-b .knowledge-intro h2{font-size:38px;max-width:650px}.variant-b .knowledge-band{margin-top:60px}}
@media(max-width:600px){.variant-b:not(.hero-a) .hero{height:490px}.variant-b:not(.hero-a) .hero-content{padding-top:28px}.variant-b:not(.hero-a) .hero-title-box{padding:22px;border-radius:4px 32px 4px 4px}.variant-b:not(.hero-a) h1{font-size:38px}.selector-b{margin-top:-64px;padding:20px}.selector-heading{display:block;margin-bottom:18px}.strom .selector-heading h2{font-size:23px}.selector-heading .partner{justify-content:start;margin-top:12px}.selector-b .route-nav{gap:8px}.selector-b .route{min-height:100px;padding:12px;flex-direction:column;align-items:start;align-content:start}.selector-b .route span{min-width:0}.selector-b .selector-bottom>span{font-size:14px;text-align:center}.variant-b .photo-label{padding:20px}.variant-b .photo-label h3{font-size:25px}.variant-b .knowledge-band{margin-top:48px;padding:36px 0}.variant-b .knowledge{display:block}.variant-b .knowledge-intro h2{font-size:32px}.variant-b .knowledge-split{gap:30px}.variant-b .seo{padding-top:40px}.variant-b .knowledge-block h3{font-size:23px}}

/* Kopfbereich aus Vorschlag A */
.hero-a .hero picture img{object-position:center 56%}
.hero-a .hero-title-box{max-width:720px}
.hero-a .route-nav{border-bottom:1px solid var(--line);padding-bottom:16px}
.hero-a .selector-bottom{border:0;margin-top:0;padding-top:16px}
@media(min-width:601px) and (max-width:1100px){.hero-a .hero-title-box{max-width:510px}}
@media(max-width:600px){.hero-a .hero-title-box{max-width:100%}.hero-a .hero picture img{object-position:center}}

/* billigxxl · Version 2026.11.03.2 */
.strom .lower-section{padding-block:64px 0}
.strom .lower-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}
.strom .lower-heading h2{max-width:920px}
.strom .lower-heading>p,.strom .energy-date{color:var(--muted);font-size:15px;line-height:1.6}
.strom .eyebrow{font-size:14px;font-weight:700;color:#365b48;margin-bottom:12px;letter-spacing:.035em}
.strom .energy-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.strom .energy-partner{display:flex;flex-direction:column;align-items:start;min-width:0;padding:26px 24px 20px;background:white;border:1px solid var(--line);border-radius:20px}
.strom .energy-partner>img{width:128px;height:auto;aspect-ratio:15/4;object-fit:contain;margin-bottom:30px}
.strom .energy-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:#edf3ff;color:#004ac7;flex:none}
.strom .energy-icon svg{width:28px;height:28px}
.strom .energy-partner>.energy-icon{margin-bottom:16px}
.strom .energy-partner h3{font-size:22px;line-height:1.3;overflow-wrap:anywhere;margin:0 0 20px}
.strom .energy-action{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;min-width:44px;color:#004ac7;font-weight:700;line-height:1.4;text-decoration:underline;text-underline-offset:4px}
.strom .energy-partner .energy-action{margin-top:auto;width:100%;font-size:15px}
.strom .energy-action svg{width:18px;height:18px}
.strom .energy-topic{min-width:0;background:#fff;border-radius:20px;padding:24px;color:var(--navy);display:flex;flex-direction:column;align-items:start;text-decoration:none;border:1px solid #e0e8df}
.strom .topic-category{font-size:14px;color:var(--muted);margin-top:20px;margin-bottom:8px}
.strom .energy-topic h3{font-size:22px;line-height:1.25;margin:0 0 22px;overflow-wrap:anywhere}
.strom .topic-action{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;min-height:44px;font-size:14px;color:#004ac7;font-weight:700}
.strom .topic-action svg{width:18px;height:18px}
.strom .topic-ökostrom .energy-icon{background:#e9f3e4;color:#315f39}
.strom .topic-gas .energy-icon{background:#fff0e6;color:#8c4015}
.strom .energy-topic:hover,.strom .energy-partner:has(a:hover){border-color:#99b9e8;box-shadow:0 6px 20px #0c1f440a}
.strom .energy-topic:hover h3{text-decoration:underline;text-underline-offset:4px}
.strom .lower-facts-band{margin-top:64px;background:#edf3f9}
.strom .lower-facts-band .lower-section{padding-block:48px}
.strom .energy-facts{margin:0}
.strom .energy-facts>div{min-width:0;display:flex;flex-direction:column;padding:0 12px 0 0}
.strom .energy-facts dt{font-size:20px;font-weight:750;line-height:1.3;margin-bottom:12px}
.strom .energy-facts dd{margin:0;font-size:16px;line-height:1.65;color:#354b69}
.strom .energy-facts .fact-source{margin-top:auto;padding-top:12px}
.strom .fact-source a{display:inline-flex;align-items:center;gap:12px;min-height:44px;min-width:44px;color:#004ac7;font-size:14px}
.strom .fact-source svg{width:16px;height:16px}
.strom .energy-date{margin-top:24px}
.strom .energy-sources{margin-top:12px;border-top:1px solid #ccd9e9}
.strom .energy-sources summary{padding:12px 0;min-height:48px;cursor:pointer;font-weight:700}
.strom .energy-sources ol{margin:8px 0 0;padding-left:24px;display:grid;gap:8px}
.strom .energy-sources li{scroll-margin-block:160px}
.strom .energy-sources a{display:inline-flex;align-items:center;min-height:44px;color:#004ac7}
.strom .energy-sources li span{display:block;font-size:14px;color:var(--muted)}
.strom .energy-steps{list-style:none;padding:0;margin:0;counter-reset:energy-step}
.strom .energy-steps li{counter-increment:energy-step;min-width:0}
.strom .energy-steps li::before{content:counter(energy-step,decimal-leading-zero);display:block;margin-bottom:20px;font-size:32px;line-height:1;font-weight:750;color:#365b48}
.strom .energy-steps h3{font-size:22px;line-height:1.3;margin-bottom:12px}
.strom .energy-steps p{font-size:16px;line-height:1.65;color:var(--muted)}
.strom .guide-action{margin-top:28px}
.strom .lower-section a:focus-visible,.strom .energy-sources summary:focus-visible{outline:3px solid #075fff;outline-offset:5px;border-radius:4px}
@media(min-width:601px) and (max-width:1100px){.strom .energy-grid{gap:12px}.strom .energy-partner,.strom .energy-topic{padding:20px 14px}.strom .energy-partner h3,.strom .energy-topic h3,.strom .energy-steps h3{font-size:19px}.strom .lower-heading{display:block}.strom .lower-heading>p{margin-top:12px}.strom .energy-partner .energy-action{font-size:14px;gap:6px}.strom .energy-partner>img{width:112px}.strom .energy-facts dt{font-size:18px}.strom .energy-facts dd,.strom .energy-steps p{font-size:15px}}
@media(max-width:600px){.strom .lower-section{padding-top:44px}.strom .lower-heading{display:block;margin-bottom:24px}.strom .lower-heading>p{margin-top:12px}.strom .energy-grid{grid-template-columns:1fr;gap:16px}.strom .energy-partner{padding:24px}.strom .energy-partner>img{margin-bottom:24px}.strom .energy-partner h3{font-size:24px}.strom .energy-topic{display:grid;grid-template-columns:52px minmax(0,1fr);gap:0 18px;padding:22px}.strom .energy-topic .energy-icon{grid-row:1/3;align-self:start}.strom .topic-category{margin:0 0 6px}.strom .energy-topic h3{font-size:22px;margin:0 0 12px}.strom .topic-action{grid-column:2}.strom .lower-facts-band{margin-top:44px}.strom .lower-facts-band .lower-section{padding-block:36px}.strom .energy-facts{gap:26px}.strom .energy-facts>div{padding:0}.strom .energy-steps{gap:28px}.strom .energy-steps li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px}.strom .energy-steps li::before{grid-row:1/3;font-size:28px;margin-top:2px}.strom .energy-steps h3{font-size:22px}.strom .energy-steps p{grid-column:2}.strom .energy-guide .guide-action{width:100%}}
/* KI-Kasten: Kurzantwort mit Stand */
.ki-kasten{margin-top:56px;padding:28px 32px;background:#eef5ff;border:1px solid #c9ddff;border-left:6px solid #075fff;border-radius:16px;color:#0c1f44}
.ki-kasten h2{font-size:24px;line-height:1.25;margin-bottom:10px}
.ki-kasten p{font-size:17px;line-height:1.6;max-width:900px}
.ki-kasten strong{color:#0c1f44;background:#fff3c4;padding:0 3px;border-radius:3px}
.ki-kasten a{color:#0755db;text-decoration:underline;text-underline-offset:3px;font-weight:600}
.ki-kasten .ki-stand{margin-top:12px;font-size:14px;color:#4d607d}
@media(max-width:600px){.ki-kasten{margin-top:36px;padding:20px}.ki-kasten h2{font-size:21px}.ki-kasten p{font-size:16px}}
