:root{--green:#3d993d;--deep:#225d2e;--ink:#292e30;--muted:#5b666b;--blue:#0066cc;--red:#cc294f;--paper:#f5f7f8;--line:#dce2e5}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;font:17px/1.65 Arial,Helvetica,sans-serif;color:var(--ink);background:#fff}a{color:inherit;text-underline-offset:4px}button{font:inherit;cursor:pointer}button,a,input{touch-action:manipulation}:focus-visible{outline:3px solid var(--blue);outline-offset:5px}.wrap{width:min(1200px,calc(100% - 64px));margin:auto}.eyebrow{font-size:13px;letter-spacing:2px;font-weight:700;text-transform:uppercase;color:var(--deep)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(40px,5vw,68px);line-height:1.06;letter-spacing:-2.7px;font-weight:600;margin-bottom:26px}h2{font-size:clamp(30px,3.6vw,46px);line-height:1.16;letter-spacing:-1.5px;font-weight:600}h3{font-size:23px;line-height:1.3;letter-spacing:-.5px}p{margin-bottom:20px}.intro{font-size:20px;line-height:1.6;color:var(--muted);max-width:680px}.header{position:sticky;top:0;background:rgba(255,255,255,.97);z-index:10;border-bottom:1px solid var(--line)}.nav{display:flex;align-items:center;justify-content:space-between;height:92px;gap:20px}.brand{display:flex;align-items:center;text-decoration:none}.brand img{width:270px;height:auto}.links{display:flex;gap:25px;align-items:center;font-size:15px;font-weight:600}.links a{text-decoration:none}.links a:hover{color:var(--deep)}.button{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;text-decoration:none;font-size:15px;font-weight:700;border:1px solid transparent;background:var(--deep);color:#fff;border-radius:3px}.button.secondary{background:transparent;border-color:#a5b0b6;color:var(--ink)}.menu{display:none;background:white;border:1px solid var(--line);padding:8px 12px}.hero{padding:62px 0 48px}.hero-grid{display:grid;grid-template-columns:1.04fr 1fr;gap:58px;align-items:center}.hero .eyebrow{margin-bottom:24px}.hero p{max-width:590px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.hero-photo{position:relative;min-width:0}.hero-photo img{width:100%;height:560px;object-fit:cover;display:block;border-radius:4px}.image-label{position:absolute;bottom:22px;left:22px;right:22px;background:rgba(16,31,37,.9);color:#fff;padding:17px 22px;border-left:3px solid #72bf57;font-size:14px}.image-label strong{display:block;font-size:18px}.facts{display:flex;gap:32px;border-top:1px solid var(--line);margin-top:50px;padding-top:22px;font-size:14px;color:var(--muted)}.facts strong{display:block;font-size:16px;color:var(--ink)}section{padding:90px 0}.pale{background:var(--paper)}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-bottom:42px;align-items:start}.section-head h2{margin-bottom:0}.section-head p{margin:0}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.card{padding:30px;border:1px solid var(--line);background:white;border-radius:4px}.card p{font-size:16px;color:var(--muted)}.card p:last-child{margin-bottom:0}.number{display:block;color:var(--deep);font-size:14px;letter-spacing:1px;margin-bottom:20px;font-weight:700}.knx-explain{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.system{background:#fff;padding:32px;border:1px solid var(--line)}.system-center{background:var(--deep);padding:20px;color:#fff;text-align:center;font-size:28px;letter-spacing:2px;margin:14px 0}.system-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.system-grid span{padding:17px;background:var(--paper);font-size:15px;text-align:center}.note{font-size:14px;color:var(--muted)}.system .note{margin-top:20px;margin-bottom:0}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.tab{background:#fff;border:1px solid var(--line);padding:12px 17px;font-size:15px;border-radius:3px}.tab[aria-selected=true]{color:#fff;background:var(--deep);border-color:var(--deep)}.scenario{display:grid;grid-template-columns:1fr 1fr;gap:44px;border:1px solid var(--line);padding:38px;background:#fff;min-height:340px}.scenario ol{padding-left:22px}.scenario li{padding:0 0 14px 9px}.benefit{background:#eaf3ec;border-left:3px solid var(--green);padding:22px}.benefit p{margin-bottom:0}.tag{display:inline-block;font-size:13px;color:var(--deep);background:#eaf3ec;padding:5px 10px;margin:0 5px 10px 0}.dark{background:#17292f;color:#fff}.dark .eyebrow{color:#85c87a}.dark .intro,.dark p{color:#c5d3d8}.dark .card{background:#22383f;border-color:#3b5159}.dark .card h3{color:#fff}.split{display:grid;grid-template-columns:1fr 1fr;gap:65px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:25px;border-top:1px solid var(--line);padding-top:28px}.steps p{color:var(--muted);font-size:16px}.product-link{font-size:14px;color:var(--blue);display:block;margin-top:18px}.manufacturers .card{border-top:3px solid var(--green)}.manufacturer-name{font-size:30px;font-weight:700;margin-bottom:25px}.manufacturer-name.abb{color:#d22128}.manufacturer-name.bj{color:var(--ink)}.manufacturer-name.jung{letter-spacing:3px}.product{padding:16px 0;border-top:1px solid var(--line)}.product strong{font-size:16px;display:block}.product p{margin:5px 0 0;font-size:15px}.contact{background:#eaf3ec}.contact h2{max-width:650px}.contact-details{font-size:19px}.contact-details a{display:block;margin-bottom:12px}.region{border-top:1px solid #bdcfbf;padding-top:24px;margin-top:26px;font-size:15px}.footer{padding:38px 0 25px;background:#fff}.footer-top{display:flex;justify-content:space-between;gap:25px;font-size:14px}.footer-links{display:flex;gap:24px;flex-wrap:wrap}.footer-bottom{margin-top:25px;border-top:1px solid var(--line);padding-top:20px;font-size:13px;color:var(--muted)}details{border-bottom:1px solid var(--line);padding:19px 0}summary{font-weight:600;font-size:18px;cursor:pointer}details p{padding-top:15px;color:var(--muted);font-size:16px;margin-bottom:0}.legal{max-width:800px;padding:65px 0 85px}.legal h1{font-size:46px;line-height:1.15}.legal h2{font-size:25px;letter-spacing:-.4px;margin-top:35px}.legal p,.legal li{font-size:16px}.back{display:inline-block;margin-bottom:32px;font-size:15px;color:var(--deep)}[hidden]{display:none!important}@media(max-width:1050px){.links{gap:15px;font-size:14px}.brand img{width:230px}.hero-grid{gap:30px}.hero-photo img{height:520px}.wrap{width:calc(100% - 48px)}}@media(max-width:800px){.wrap{width:calc(100% - 36px)}.nav{height:78px}.brand img{width:225px}.menu{display:block;font-size:14px}.links{display:none;position:absolute;top:78px;left:0;right:0;background:white;padding:22px;box-shadow:0 8px 10px #0001;flex-direction:column;align-items:stretch;gap:20px}.links.open{display:flex}.hero{padding:36px 0}.hero-grid,.section-head,.knx-explain,.scenario,.split{grid-template-columns:1fr;gap:25px}h1{font-size:44px;letter-spacing:-1.8px}.intro{font-size:18px}.hero-photo img{height:310px}.hero-photo{margin-top:4px}.image-label{left:15px;right:15px;bottom:15px;padding:12px 16px}.image-label strong{font-size:16px}.facts{gap:18px;margin-top:30px;flex-wrap:wrap}.facts>div{flex:1;min-width:130px}section{padding:58px 0}.section-head{margin-bottom:28px}.three{grid-template-columns:1fr}.card{padding:25px}.tabs{gap:7px}.tab{padding:10px 12px;font-size:14px}.scenario{padding:25px;min-height:0}.steps{grid-template-columns:1fr 1fr;gap:20px}.footer-top{flex-direction:column}.system{padding:22px}.legal h1{font-size:36px}.legal{padding-top:40px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.skip{position:absolute;top:-100px;left:16px;z-index:50;background:white;padding:12px}.skip:focus{top:10px}

.credentials{background:#fff;border:1px solid var(--line);padding:32px;align-self:start}.credential-logos{display:flex;align-items:center;justify-content:space-around;gap:30px;border-bottom:1px solid var(--line);padding-bottom:30px;margin-bottom:30px}.credential-logos img{width:42%;max-width:180px;height:auto;object-fit:contain}.credentials a{color:var(--deep)}@media(max-width:800px){.credentials{padding:25px}.credential-logos{gap:24px}}

.manufacturer-identity{margin-bottom:24px}.manufacturer-logo{height:70px;display:flex;align-items:center}.manufacturer-logo img{width:auto;max-width:100%;max-height:52px;object-fit:contain}.manufacturer-company{font-size:15px;font-weight:600;line-height:1.4;min-height:42px;margin:14px 0 0;color:var(--ink)}.credential-logos img{height:100px;width:auto;max-width:none;object-fit:contain}@media(max-width:800px){.credential-logos img{height:60px;width:auto;max-width:none}.manufacturer-company{min-height:0}}

.manufacturer-logo img{height:44px;width:auto;max-height:44px}

/* Einheitliche Abstände zwischen Abschnittslabel, Überschrift und Einleitung. */
section .eyebrow{margin-bottom:8px}
section h2{margin-bottom:20px}
section .section-head h2{margin-bottom:0}
#qualifikation .section-head .intro{margin:0}

/* Ausrichtung nach KNX-Buchstaben: Partner y=157..263, Advanced y=54..110. */
.credentials{container-type:inline-size}
.credential-logos{--knx-letter-height:32px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.credential-logo-frame{display:block;position:relative;height:calc(var(--knx-letter-height)*3.28)}
.credential-logos .credential-logo-frame img{position:absolute;left:50%;transform:translateX(-50%);max-width:none;max-height:none;object-fit:contain}
.credential-logos .partner img{width:calc(var(--knx-letter-height)*3.85046729);height:calc(var(--knx-letter-height)*2.53271028);top:calc(var(--knx-letter-height)*0.05271028)}
.credential-logos .advanced img{width:calc(var(--knx-letter-height)*4.57894737);height:calc(var(--knx-letter-height)*2.70175439);top:calc(var(--knx-letter-height)*0.57263158)}

.contact-details a{text-decoration:none}.contact-details a:hover{color:var(--deep)}

.contact-line{display:block;margin-bottom:12px}.signature-slogan{color:var(--blue);font-size:20px;font-weight:600;line-height:1.5;margin:30px 0 0;max-width:520px}.signature-slogan span{display:block}@media(max-width:800px){.signature-slogan{font-size:18px;margin-top:25px}}

.contact-details .signature-slogan{text-align:right;margin-left:auto}.ventilation-info{margin-top:24px}.ventilation-info h3{margin-bottom:12px}.ventilation-info p{font-size:16px}

/* Standardsbasierte Fallbacks und schmale Displays. */
@supports(width:1cqw){.credential-logos{--knx-letter-height:clamp(18px,9cqw,44px)}}
.brand{min-width:0}.brand img{max-width:100%}.menu{flex-shrink:0}.hero-photo picture{display:block}.split>div,.section-head>div,.three>article{min-width:0}.contact-line,.legal a{overflow-wrap:anywhere}
@media(max-width:800px){.brand{flex:1}.nav{gap:12px}.brand img{width:225px;max-width:100%}.nav>.button{padding:10px 12px;flex-shrink:0}}
@media(max-width:380px){.credentials{padding:20px}.credential-logos{gap:14px;--knx-letter-height:22px}.system-grid span{padding:12px 8px}}
