/* October revision: logo-led colour, one consistent rhythm. */
:root{--ink:#17191c;--red:#e5142b;--yellow:#ffe100;--brand-glow:linear-gradient(110deg,#e5142b 0%,#ef5030 50%,#ffe100 100%)}
html{scroll-padding-top:160px}
.header{background:#fffffff5;backdrop-filter:blur(16px)}
.header-inner{height:142px;gap:26px;position:relative}
.header-inner .brand svg{width:266px;height:129px}
.header-inner .brand{align-self:center}
.nav{gap:22px;align-items:center;font-size:13px;white-space:nowrap}
.nav a{padding:9px 0}
.header-phone{display:none}
.header-inner>.button{white-space:nowrap}
.hero{position:relative;padding:58px 0 64px;gap:72px;grid-template-columns:1fr 1fr}
.hero:before{content:"";position:absolute;pointer-events:none;width:490px;height:490px;z-index:-1;left:-20%;top:-10%;background:radial-gradient(ellipse,#ffe10010,transparent 65%)}
.hero h1{font-size:clamp(52px,5.2vw,72px);line-height:1.04;letter-spacing:-.055em}
.hero h1 em{color:var(--red)}
.hero .eyebrow{color:#5d6167;font-size:10px;letter-spacing:.09em}
.hero-visual{height:510px;box-shadow:0 22px 70px -48px #b36d1c60}
.hero-reassurance{color:#41454a;font-weight:500}
.hero-description{max-width:490px}
.button:not(.outline):not(.light){background:var(--red);border-color:var(--red);box-shadow:0 5px 16px -12px #e5142b80}
.button:not(.outline):not(.light):hover{background:#c81125;border-color:#c81125}
.values-section{border-block:1px solid var(--line);background:#fafafa}
.values-shell{padding-block:34px 42px}
.values-heading{display:flex;align-items:center;gap:15px;margin-bottom:25px}
.values-heading h2{font-size:14px;letter-spacing:0;line-height:1.4;font-weight:600}

.values-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.value-card{padding-top:19px;border-top:3px solid var(--ink)}
.value-card.efficiency{border-color:var(--red)}
.value-card.fairness{border-color:#e6bb00}
.value-card h3{font-size:22px;margin-bottom:12px;line-height:1.25}
.value-card.efficiency h3{color:#cb1126}
.value-card.fairness h3{color:#846100}
.value-card p{font-size:14px;line-height:1.75;color:var(--muted);margin:0}
.authorization-section{background:#fff;border-bottom:1px solid var(--line)}
.authorization-inner{display:flex;align-items:center;gap:25px;padding-block:30px}
.authorization-icon{width:46px;height:46px;flex:none;color:var(--ink)}
.authorization-icon svg{width:100%;height:100%}
.authorization-inner .eyebrow{font-size:10px;margin-bottom:7px;color:#656971}
.authorization-inner h2{font-size:21px;line-height:1.3;letter-spacing:-.025em;margin:0 0 5px}
.authorization-inner p:last-child{margin:0;font-size:13px;color:var(--muted)}
.route-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.route-grid-two .route-card{padding:36px;min-height:295px}
.route-grid-two .route-card h3{min-height:0;font-size:29px}
.route-grid-two .dark{background:linear-gradient(130deg,#17191c,#2b2929)}
.route-grid-two .route-card:not(.dark){background:linear-gradient(125deg,#fff 70%,#ffe10009)}
.region-section{background:#191a1d;position:relative}
.region-section:before{content:"";height:3px;position:absolute;inset:0 0 auto;background:var(--brand-glow)}
.region-section .eyebrow{color:#ffda88;font-size:10px}
.region-section h2{font-size:clamp(34px,3.5vw,46px)}
.region-section .split{grid-template-columns:1fr 1fr;gap:76px}
.map-wrap{background:#faf9f6}
.region-map{height:490px;padding:44px 14px 10px}
.map-heading{font-size:10px;top:20px;left:22px;letter-spacing:.1em}
.map-state{fill:#f0eadb;stroke:#bdb4a1;stroke-width:1}
.map-point{fill:#6b655e}
.map-label{font-family:inherit;font-size:11px;fill:#58534e}
.map-label-main{font-family:inherit;font-size:12px;fill:#d50c22;paint-order:stroke;stroke:#faf9f6;stroke-width:4;stroke-linejoin:round}
.remseck-point{fill:#e5142b;stroke:white;stroke-width:2}
.map-halo{fill:#e5142b12;stroke:#e5142b25;stroke-width:1}
.map-legend{font-size:11px;line-height:1.7;padding:13px 20px;color:#625d55;border-color:#e9e4d8}
.map-legend a{font-size:9px;color:#827c73;margin-top:5px}
.legend-red-dot{display:inline-block;background:#e5142b;width:7px;height:7px;border-radius:50%;margin-right:6px}
.knx-section{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:80px;border-bottom:1px solid var(--line)}
.knx-section h2{margin-bottom:22px}
.knx-section p:not(.eyebrow){max-width:440px;color:var(--muted);margin-bottom:23px}
.partner-logo{display:flex;align-items:center;justify-content:center;padding:25px 40px}
.partner-logo img{width:min(100%,240px);height:auto;object-fit:contain}
.service-illustration{height:225px;display:flex;justify-content:center;align-items:center;flex:none;background:#f5f4f0;color:#393b3f;position:relative;overflow:hidden}
.service-illustration svg{height:145px;width:220px;position:relative}
.service-illustration:before{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:#ffe10013}
.service-illustration.construction{background:#f8f2f2}
.service-illustration.construction:before{background:#e5142b08}
.illustration-accent{stroke:var(--red);stroke-width:3}
.required-note{font-size:12px!important;color:#696d73}
.field input,.field textarea{border-radius:7px}
.field span{font-weight:500}
.form{padding:32px}
.footer-main .brand svg{width:190px;height:92px}
@media(max-width:1100px){
 .header-inner{gap:20px;height:126px}
 .header-inner .brand svg{width:230px;height:111px}
 .nav{gap:18px;font-size:12px}
 .header-inner>.button{display:none}
 .hero{gap:42px}
 .hero-visual{height:490px}
 .values-grid{gap:28px}
 .region-section .split{gap:40px}
}
@media(max-width:800px){
 html{scroll-padding-top:120px}
 .header-inner{height:108px}
 .header-inner .brand svg{width:196px;height:95px}
 .header-inner>.button{display:inline-flex;margin-left:auto}
 .menu{display:block;margin-left:0}
 .nav{position:absolute;top:100%;left:-5.56%;right:-5.56%;padding:24px 5.56%;font-size:16px;white-space:normal;gap:10px;align-items:stretch}
 .nav a{padding:10px 0}
 .hero{grid-template-columns:1fr;gap:36px;padding:40px 0 48px}
 .hero h1{font-size:66px}
 .hero h1 br:nth-of-type(2){display:none}
 .hero-description{max-width:600px}
 .hero-visual{height:380px}
 .values-grid{grid-template-columns:1fr;gap:26px}
 .value-card{padding-top:17px}
 .values-shell{padding-block:28px 34px}
 .route-grid-two{grid-template-columns:1fr}
 .route-grid-two .route-card{min-height:0;padding:30px}
 .region-section .split{grid-template-columns:1fr;gap:35px}
 .map-wrap{max-width:540px;width:100%;justify-self:center}
 .knx-section{gap:40px;grid-template-columns:1.2fr 1fr}
 .partner-logo{padding:20px}
 .service-illustration{height:210px}
}
@media(max-width:550px){
 .header-inner{height:108px;gap:14px}
 .header-inner .brand svg{width:190px;height:92px}
 .header-inner>.button{display:none}
 .menu{margin-left:auto;font-size:26px}
 .hero h1{font-size:clamp(45px,11.5vw,62px)}
 .hero h1 br:nth-of-type(2){display:block}
 .hero-visual{height:310px}
 .hero .eyebrow{font-size:9px}
 .hero-actions{gap:10px}
 .hero-actions .button{padding:12px 17px;font-size:13px}
 .values-heading{margin-bottom:23px}
 .authorization-inner{gap:17px;align-items:flex-start;padding-block:26px}
 .authorization-icon{width:34px;height:34px;margin-top:3px}
 .authorization-inner h2{font-size:19px}
 .authorization-inner .eyebrow{font-size:9px}
 .route-grid-two .route-card{padding:27px}
 .route-grid-two .route-card h3{font-size:26px}
 .region-section h2{font-size:36px}
 .region-map{height:430px;padding-inline:0}
 .knx-section{grid-template-columns:1fr;gap:25px}
 .partner-logo{padding:15px 0;justify-content:flex-start}
 .partner-logo img{width:200px}
 .form{padding:24px}
 .footer-main .brand svg{width:180px;height:87px}
}

/* Final review: compact navigation and one mobile action pair at a time. */
.hero:before{display:none}
.hero>*,.split>*,.service-hero-grid>*,.contact-grid>*,.field-row>*{min-width:0}
.page-content a,.footer-links a,.contact-number{overflow-wrap:anywhere}
.legal-content{max-width:820px}.legal-content p{line-height:1.8}.legal-content a{text-decoration:underline;text-underline-offset:3px}.legal-content h2{font-size:clamp(23px,3vw,30px);margin-top:36px}
.map-label{font-size:13px}.map-label-main{font-size:14px}
.mobile-contact{display:none}
@media(max-width:1100px) and (min-width:801px){.header-inner{gap:18px}.nav{gap:14px;font-size:12px}.header-inner .brand svg{width:210px;height:102px}}
@media(max-width:800px){
 html{scroll-padding-top:100px}
 .header-inner{height:92px;gap:16px}.header-inner .brand svg{width:180px;height:87px}
 .header-inner>.button,.emergency-bar{display:none}.menu{margin-left:auto;min-width:44px;min-height:44px}
 .nav{max-height:calc(100dvh - 100px);overflow:auto;background:#fff}
 body{padding-bottom:76px}.footer{padding-bottom:32px}
 .mobile-contact.is-visible{position:fixed;bottom:0;left:0;right:0;z-index:50;padding:9px 12px calc(9px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#fff;border-top:1px solid #cbd4cd}
 .mobile-contact a{display:grid;place-items:center;min-height:44px;font-size:13px;font-weight:700;border:1px solid var(--ink);border-radius:8px}
 .mobile-contact a:first-child{background:var(--red);border-color:var(--red);color:#fff}
}
@media(max-width:550px){.header-inner{height:82px}.header-inner .brand svg{width:160px;height:77px}.map-label{font-size:14px}.map-label-main{font-size:15px}.page-hero h1{overflow-wrap:break-word}.hero-actions .button{min-height:48px}}
@media(max-height:480px) and (max-width:1000px){.header{position:relative}.hero{padding-top:28px}.mobile-contact.is-visible{padding-block:5px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Zusammenhängende Unternehmensvorstellung ohne Kacheln. */
.about-story-inner{max-width:820px}.about-story-text{max-width:720px;margin:30px 0 34px}.about-story-text p{font-size:18px;line-height:1.8;margin:0 0 22px;color:var(--muted,#626568)}.construction-photo img{object-position:50% 50%}.construction-photo figcaption a{color:inherit;text-decoration:underline;text-underline-offset:3px}
@media(max-width:550px){.about-story-text{margin:24px 0 28px}.about-story-text p{font-size:16px;line-height:1.75}}

/* Feinschliff Version 2: kompakter Desktop-Einstieg, verlässlicher mobiler Kontakt. */
@media(min-width:801px){
 .header-inner{height:126px}.header-inner .brand svg{width:250px;height:121px}
 .hero{padding:24px 0;gap:48px}.hero h1{font-size:clamp(44px,3.7vw,58px);line-height:1.06;margin-bottom:18px}.hero-mobile-break{display:none}
 .hero .eyebrow{margin-bottom:14px}.hero-description{font-size:17px;line-height:1.55;margin-bottom:18px}.hero-visual{height:330px}.hero-reassurance{margin-top:14px;font-size:12px}
 .values-shell{padding-block:20px 24px}.values-heading{margin-bottom:14px}.value-card{padding-top:14px}.value-card h3{font-size:21px;margin-bottom:8px}.value-card p{font-size:14px;line-height:1.6}
}
@media(min-width:801px) and (max-width:1100px){.header-inner .brand svg{width:210px;height:102px}.hero{gap:32px}.hero h1{font-size:42px}}
@media(max-width:800px){
 .emergency-bar{display:block;padding:9px 0;font-size:12px;background:#17191c}.emergency-bar .shell{justify-content:center;width:94%}.emergency-bar .shell>span{display:none}.emergency-bar a{gap:7px;white-space:nowrap}.emergency-bar .emergency-indicator{margin:0}.emergency-bar .phone-icon{width:14px;height:14px;flex-shrink:0}
 .header{position:sticky;top:0}.nav{top:100%;max-height:calc(100dvh - 110px)}
 .hero-actions{display:none}.hero-reassurance{margin-top:18px}.hero-mobile-break{display:block}
 .mobile-contact{position:fixed;bottom:0;left:0;right:0;z-index:50;padding:9px 12px calc(9px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#fff;border-top:1px solid #cbd4cd}
 .mobile-contact.is-suspended{display:none}
 body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
}
@media(min-width:801px) and (max-height:800px){
 .header-inner{height:118px}.header-inner .brand svg{width:240px;height:116px}
 .hero{padding-block:18px}.hero h1{font-size:clamp(42px,3.4vw,52px);margin-bottom:14px}.hero .eyebrow{margin-bottom:10px}.hero-description{font-size:16px;margin-bottom:14px}.hero-reassurance{margin-top:10px}.hero-actions .button{min-height:48px;padding-block:11px}.hero-visual{height:300px}
 .values-shell{padding-block:16px 20px}
}
@media(min-width:801px) and (max-width:1100px) and (max-height:800px){.header-inner .brand svg{width:210px;height:102px}}

/* Feinschliff Version 3: mehr Ruhe im Einstieg, beide Kontaktwege im Desktop-Kopf. */
.hero-visual img{object-position:50% 48%}
@media(min-width:801px){
 :root{--emergency-height:36px}
 html{scroll-padding-top:180px}
 .emergency-bar{position:sticky;top:0;z-index:45;height:var(--emergency-height);padding:0}
 .emergency-bar .shell{height:100%;align-items:center}
 .header{top:var(--emergency-height)}
 .header-inner{gap:18px}
 .header-phone{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;border:1px solid #c9cdcf;border-radius:2px;font-size:13px;transition:background .2s,border-color .2s}
 .header-phone:hover{background:#f5f5f5;border-color:#73777b}
 .header-phone .phone-icon{width:17px;height:17px;flex:none}
 .header-inner>.button{display:inline-flex}
 .hero{padding-top:42px;padding-bottom:44px}
 .values-shell{padding-top:28px;padding-bottom:38px}
 .authorization-inner{padding-top:42px;padding-bottom:42px}
}
@media(min-width:1001px) and (max-width:1200px){
 .header-inner{gap:14px}.header-inner .brand svg{width:200px;height:97px}
 .nav{gap:13px;font-size:12px}
 .header-phone{width:44px;padding:10px;flex:none}.header-phone span{display:none}
 .header-inner>.button{padding-inline:13px;font-size:12px}
}
@media(min-width:801px) and (max-width:1000px){
 .header-inner{gap:16px}
 .header-phone{margin-left:auto}
 .menu{display:block;margin-left:0;min-width:44px;min-height:44px}
 .nav{display:none;position:absolute;top:100%;left:-5.56%;right:-5.56%;margin:0;padding:24px 5.56%;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:10px;font-size:16px;max-height:calc(100dvh - 165px);overflow:auto}
 .nav.open{display:flex}.nav a{padding:10px 0}
}
@media(min-width:801px) and (max-height:800px){
 .hero{padding-top:42px;padding-bottom:30px}
 .values-shell{padding-top:22px;padding-bottom:28px}
 .authorization-inner{padding-top:40px;padding-bottom:40px}
}

/* Gemeinsame Geometrie für beide Kontaktbuttons im Desktop-Header. */
@media(min-width:801px){
 .header-phone,.header-inner>.button.small{
  height:44px;min-height:44px;box-sizing:border-box;
  padding:0 17px;border-width:1px;border-style:solid;border-radius:8px;
  font-size:13px;font-weight:600;line-height:1;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .2s,border-color .2s;
 }
 .header-phone{background:transparent;box-shadow:none}
 .header-phone:hover,.header-inner>.button.small:hover{transform:none}
}
@media(min-width:1001px) and (max-width:1200px){
 .header-phone{width:44px;padding:0}
 .header-inner>.button.small{padding-inline:13px;font-size:12px}
}
