/* Zusatzseite im bestehenden EccoVerd-Farbsystem. */
.integration-skip{position:fixed;left:20px;top:-100px;z-index:30;background:#fff;padding:14px;border:2px solid var(--brand-deep);border-radius:8px}
.integration-skip:focus{top:12px}
body[data-page=integration] main{overflow-wrap:break-word}
body[data-page=integration] :is(section,main)[id]{scroll-margin-top:125px}
body[data-page=integration] :is(a,button):focus-visible{outline:3px solid var(--brand-brown);outline-offset:5px}
.integration-hero{background:var(--cream);padding-top:66px}
.integration-hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center;padding-bottom:56px}
.integration-hero-copy{min-width:0}
.integration-hero h1{font-size:clamp(2.5rem,3.8vw,3.5rem);line-height:1.08;letter-spacing:-.045em;color:var(--brand-deep);margin:20px 0 28px}
.integration-hero h1 em{color:var(--brand-deep);font-style:normal;text-decoration:underline;text-decoration-color:var(--brand-roof);text-decoration-thickness:.05em;text-underline-offset:.13em}
.integration-hero-copy>p:not(.eyebrow){color:var(--muted);max-width:57ch;line-height:1.7}
.integration-lead{font-size:1.14rem}
.integration-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:30px}
.integration-text-link{font-size:.88rem;font-weight:700;text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--brand-roof)}
.integration-map{margin:0;border:1px solid var(--line);padding:30px;background:#fff;border-radius:22px;box-shadow:0 20px 55px #2d7d0b0c}
.integration-map figcaption{font-size:1.03rem;font-weight:700;margin-bottom:25px;line-height:1.4}
.integration-map-inputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;position:relative}
.integration-map-inputs>div{border:1px solid var(--line);border-radius:10px;background:var(--cream);padding:14px 6px;text-align:center;font-size:.73rem;line-height:1.5;display:grid;align-content:start;gap:8px}
.integration-symbol{color:var(--brand-deep);font-size:1.7rem;line-height:1.3}
.integration-map-connector{height:28px;width:1px;background:var(--brand-roof);margin:auto;position:relative}
.integration-map-connector::after{content:'';position:absolute;bottom:0;left:-3px;width:7px;height:7px;border-bottom:1px solid var(--brand-deep);border-right:1px solid var(--brand-deep);transform:rotate(45deg)}
.integration-map-inputs::after{content:'';position:absolute;height:13px;left:16%;right:16%;bottom:-14px;border:1px solid var(--brand-roof);border-top:0}
.integration-map-core{background:var(--brand-deep);color:#fff;border-top:4px solid var(--brand-roof);border-radius:12px;padding:23px 20px;display:grid;text-align:center;gap:12px}
.integration-map-label{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
.integration-map-core strong{font-size:1.65rem;line-height:1.2;letter-spacing:-.025em}
.integration-map-core>span:last-child{font-size:.73rem}
.integration-map-output{padding:13px 12px;text-align:center;border:1px solid var(--brand-roof);background:var(--sage);border-radius:10px;font-size:.8rem;font-weight:600}
.integration-jump-links{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-block:22px;font-size:.8rem;font-weight:600;color:var(--brand-deep)}
.integration-jump-links a{padding:6px 0;text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--brand-roof)}
.integration-section{padding-block:82px}
.integration-section-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:0 70px;align-items:end;margin-bottom:40px}
.integration-section-heading .eyebrow{grid-column:1/-1}
.integration-section-heading h2,.integration-existing-heading h2,.integration-energy h2{font-size:clamp(2rem,3.2vw,2.7rem);line-height:1.14;letter-spacing:-.035em;margin:14px 0 0}
.integration-section-heading>p:last-child{color:var(--muted);line-height:1.75;margin:0;max-width:53ch}
.integration-service{display:grid;grid-template-columns:90px minmax(0,1fr);border-top:1px solid var(--line);padding:30px 0;gap:20px}
.integration-service:last-child{border-bottom:1px solid var(--line)}
.integration-service-number{color:var(--brand-brown);font-size:.85rem;padding-top:5px}
.integration-service h3,.integration-network h3,.integration-steps h3{font-size:1.4rem;letter-spacing:-.025em;line-height:1.25;margin:0 0 14px}
.integration-service p{max-width:83ch;line-height:1.75;margin:0;color:var(--muted)}
.integration-service .integration-service-detail,.integration-service-detail{font-size:.76rem!important;font-weight:600;color:var(--brand-deep)!important;margin:16px 0 0!important;line-height:1.7}
.integration-network{padding:76px 0;background:var(--sage)}
.integration-network-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.integration-network-grid article{background:#fff;border:1px solid var(--line);border-radius:16px;padding:32px}
.integration-small-label{display:block;font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--brand-brown);margin-bottom:15px}
.integration-network-grid p{font-size:.95rem;line-height:1.75;color:var(--muted);margin-bottom:0}
.integration-energy{background:var(--brand-deep);color:#fff;padding:74px 0;border-bottom:5px solid var(--brand-roof)}
.integration-energy-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px}
.integration-energy .eyebrow{color:#fff}
.integration-energy p{line-height:1.75}
.integration-energy-lead{font-size:1.13rem;margin-top:0}
.integration-energy-example{border-left:2px solid var(--brand-roof);padding-left:20px;font-size:.88rem;margin:25px 0}
.integration-existing-heading{max-width:750px;margin-bottom:38px}
.integration-existing-heading>p:last-child{color:var(--muted);line-height:1.75;margin-top:24px}
.integration-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;margin:0}
.integration-steps li{border-top:2px solid var(--brand-roof);padding-top:22px}
.integration-steps li>span{color:var(--brand-brown);font-size:.8rem;display:block;margin-bottom:20px}
.integration-steps h3{font-size:1.2rem}
.integration-steps p{font-size:.93rem;line-height:1.7;color:var(--muted)}
.integration-contact{display:flex;align-items:center;justify-content:space-between;gap:35px;padding:35px;background:var(--sage);border-radius:16px;margin-top:52px}
.integration-contact h2{font-size:1.5rem;line-height:1.25;letter-spacing:-.025em;margin:0 0 14px}
.integration-contact p{color:var(--muted);max-width:65ch;margin:0;line-height:1.7}
.integration-contact .button{flex-shrink:0}
.integration-victron{background:#eaf4fb;padding:48px 0;color:#063f73}
.integration-victron-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:70px;align-items:center}
.integration-victron img{width:261px;max-width:100%;height:auto}
.integration-program-label{font-size:.76rem;font-weight:700;letter-spacing:.04em;margin:20px 0 0}
.integration-victron h2{font-size:1.85rem;line-height:1.2;letter-spacing:-.025em;margin:0 0 22px}
.integration-victron p{line-height:1.75}
.integration-victron .integration-text-link{text-decoration-color:#0b66a7}
@media(max-width:700px){.integration-victron-grid{grid-template-columns:1fr;gap:30px}.integration-victron{padding-block:40px}.integration-victron h2{font-size:1.6rem}}
@media(max-width:1100px){.integration-hero-grid{gap:32px}.integration-map{padding:24px}.integration-section-heading{gap:0 36px}}
@media(max-width:850px){.integration-hero-grid{grid-template-columns:1fr;gap:40px}.integration-hero-copy>p:not(.eyebrow){max-width:65ch}.integration-map{width:100%;max-width:600px}.integration-map-inputs>div{font-size:.8rem}.integration-section-heading{grid-template-columns:1fr;gap:22px}.integration-section-heading h2{margin:0}.integration-section-heading>p:last-child{max-width:65ch}.integration-energy-grid{grid-template-columns:1fr;gap:32px}.integration-contact{align-items:flex-start;flex-direction:column;gap:24px}}
@media(max-width:600px){.integration-hero{padding-top:38px}.integration-hero h1{font-size:clamp(2.05rem,8.8vw,2.75rem)}.integration-hero-grid{padding-bottom:35px}.integration-lead{font-size:1.05rem}.integration-map{padding:20px 15px}.integration-map-inputs{gap:7px}.integration-map-inputs>div{font-size:.7rem;padding:12px 5px}.integration-map-core strong{font-size:1.5rem}.integration-jump-links{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:.72rem}.integration-service{grid-template-columns:28px minmax(0,1fr);gap:12px;padding-block:25px}.integration-service h3,.integration-network h3{font-size:1.25rem}.integration-service p{font-size:.95rem}.integration-section,.integration-network{padding-block:52px}.integration-network-grid,.integration-steps{grid-template-columns:1fr}.integration-network-grid article{padding:25px}.integration-energy{padding:52px 0}.integration-energy-grid{gap:28px}.integration-energy-lead{font-size:1.05rem}.integration-steps{gap:20px}.integration-contact{padding:25px;margin-top:35px}.integration-contact .button{width:100%}}
@media(prefers-reduced-motion:reduce){body[data-page=integration] .button{transition:none}}