:root{--bg:#050a10;--bg2:#08111a;--card:rgba(10,19,29,.86);--line:rgba(149,177,205,.24);--white:#f5f7fb;--muted:#bdc7d2;--blue:#008cff;--orange:#ff6408;--shadow:0 18px 70px rgba(0,0,0,.48)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;line-height:1.55;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 18% 12%,rgba(0,140,255,.17),transparent 34%),radial-gradient(circle at 85% 18%,rgba(255,100,8,.13),transparent 28%),url('assets/blueprint-bg.jpg') center/cover;opacity:.28;z-index:-1}.container{width:min(1160px,calc(100% - 42px));margin-inline:auto}.site-header{height:92px;display:flex;align-items:center;gap:34px;padding:0 clamp(20px,5vw,68px);position:sticky;top:0;z-index:20;background:rgba(3,8,14,.92);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brand{display:block;width:282px;max-width:42vw;height:68px;overflow:hidden;border-radius:10px}.brand img{width:100%;height:100%;object-fit:cover;object-position:left center}.main-nav{display:flex;gap:34px;margin-left:auto}.main-nav a{color:#fff;text-decoration:none;font-weight:700;font-size:14px;position:relative}.main-nav a:after{content:"";position:absolute;left:0;right:0;bottom:-14px;height:2px;background:linear-gradient(90deg,var(--blue),var(--orange));transform:scaleX(0);transition:.25s}.main-nav a:hover:after{transform:scaleX(1)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:7px;padding:13px 24px;color:#fff;text-decoration:none;font-weight:800;border:1px solid var(--line);letter-spacing:.01em;transition:.2s}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(0,0,0,.28)}.btn-primary{background:linear-gradient(100deg,var(--blue),var(--orange));border:0}.btn-outline{background:linear-gradient(90deg,rgba(0,140,255,.12),rgba(255,100,8,.1));border-color:rgba(0,140,255,.75);box-shadow:inset 0 0 0 1px rgba(255,100,8,.35)}.btn-soft{background:rgba(5,10,16,.62)}.header-btn{margin-left:25px;white-space:nowrap}.nav-toggle{display:none;background:transparent;border:0;padding:6px}.nav-toggle span{display:block;width:26px;height:2px;background:#fff;margin:6px}.hero{min-height:590px;position:relative;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}.slides,.slide{position:absolute;inset:0}.slide{background-size:cover;background-position:center;opacity:0;transform:scale(1.035);transition:opacity .8s,transform 6s}.slide.active{opacity:1;transform:scale(1)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,7,12,.96) 0%,rgba(3,7,12,.75) 38%,rgba(3,7,12,.18) 78%),linear-gradient(0deg,rgba(3,7,12,.9),transparent 42%)}.hero-content{position:relative;z-index:2;padding-top:44px}.eyebrow{text-transform:uppercase;color:var(--orange);font-weight:900;letter-spacing:.07em;font-size:14px;margin:0 0 10px}.hero h1,.about-text h2,.center-head h2,.split-card h2{font-size:clamp(36px,5.3vw,70px);line-height:.98;text-transform:uppercase;margin:0 0 18px;text-shadow:0 3px 0 rgba(0,0,0,.45)}.lead{font-size:20px;max-width:590px;color:#eef3f8}.blue{color:var(--blue)}.orange{color:var(--orange)}.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:30px}.hero-arrow{position:absolute;z-index:5;top:50%;transform:translateY(-50%);background:transparent;border:0;color:#fff;font-size:72px;cursor:pointer;opacity:.9}.prev{left:28px}.next{right:28px}.dots{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:5;display:flex;gap:14px}.dot{width:10px;height:10px;border-radius:50%;border:0;background:#cbd1da;opacity:.9}.dot.active{background:var(--blue);box-shadow:0 0 18px var(--blue)}.quickbar{background:rgba(7,15,24,.91);border-bottom:1px solid var(--line)}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding:22px 0}.quick-grid div{display:flex;align-items:center;gap:14px;justify-content:center}.quick-grid i{font-style:normal;color:var(--blue);font-size:32px}.quick-grid strong{color:var(--blue);display:block}.quick-grid span{display:block;color:var(--muted);font-size:14px}.section{padding:64px 0}.center-head{text-align:center;margin-bottom:28px}.center-head h2{font-size:clamp(28px,3.4vw,46px);display:inline-block;position:relative}.center-head h2:after{content:"";display:block;width:120px;height:3px;background:linear-gradient(90deg,var(--blue),var(--orange));margin:12px auto 0}.center-head p{color:var(--muted);max-width:760px;margin:0 auto}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-card,.process-grid div,.trust-grid div,.contact-top div,.contact-form,.area-card,.split-card{background:linear-gradient(145deg,rgba(13,25,38,.88),rgba(5,10,16,.86));border:1px solid var(--line);box-shadow:var(--shadow);border-radius:12px}.service-card{padding:28px;min-height:245px}.service-card:hover{border-color:rgba(0,140,255,.75);transform:translateY(-3px)}.icon{font-size:42px;line-height:1}.service-card h3,.trust h3{font-size:22px;text-transform:uppercase;margin:16px 0 10px}.service-card p,.trust p,.about-text p,.process p,.split-card p{color:var(--muted)}.service-card a{color:var(--blue);text-decoration:none;font-weight:800}.process{margin-top:46px}.process h2{text-align:center;text-transform:uppercase}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.process-grid div{padding:24px;position:relative;overflow:hidden}.process-grid b{font-size:62px;color:rgba(255,255,255,.05);position:absolute;right:16px;bottom:-12px}.gallery-section{padding-top:20px}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.gallery-grid figure{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#07101a;box-shadow:var(--shadow)}.gallery-grid img{display:block;width:100%;height:230px;object-fit:cover}.gallery-grid figcaption{padding:16px 18px;text-align:center}.gallery-grid span{display:block;color:var(--muted);font-size:14px}.about-band{display:grid;grid-template-columns:1.02fr .98fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(90deg,rgba(6,13,21,.95),rgba(6,13,21,.72))}.about-image img{width:100%;height:100%;min-height:430px;object-fit:cover}.about-text{padding:64px clamp(24px,6vw,70px)}.about-text h2{font-size:clamp(30px,4vw,50px)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.stats div{border:1px solid var(--line);padding:18px;border-radius:10px;text-align:center;background:rgba(7,14,22,.7)}.stats b{display:block;font-size:30px;color:var(--blue)}.stats span{text-transform:uppercase;font-size:12px;color:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}.trust-grid div{border-radius:0;padding:26px}.contact{background:linear-gradient(180deg,rgba(4,9,14,.4),rgba(8,15,23,.8))}.contact-top{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-bottom:22px}.contact-top div{border-radius:0;padding:26px}.contact-top b,.contact-top span{display:block}.contact-top a,.contact-top strong{display:block;color:var(--orange);font-size:24px;text-decoration:none;margin:8px 0}.contact-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:22px}.contact-form,.area-card{padding:28px}.contact-form input,.contact-form select,.contact-form textarea{width:100%;background:rgba(4,8,13,.84);border:1px solid var(--line);border-radius:6px;color:#fff;padding:15px 16px;margin-bottom:14px;font:inherit}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#8f9ba8}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.check{font-size:14px;color:var(--muted);display:flex;gap:10px;margin:4px 0 16px}.check input{width:auto;margin:3px 0 0}.full{width:100%;border:0;cursor:pointer;font:inherit}.contact-form small{display:block;text-align:center;margin-top:14px;color:var(--muted)}.map{height:255px;border:1px solid var(--line);border-radius:10px;background:radial-gradient(circle at 50% 50%,rgba(0,140,255,.48),rgba(0,140,255,.12) 34%,transparent 35%),url('assets/blueprint-bg.jpg') center/cover;display:grid;place-items:center;margin:18px 0}.map span{font-size:26px;font-weight:900;text-shadow:0 2px 12px #000}.area-card p{color:var(--muted)}.area-card hr{border:0;border-top:1px solid var(--line);margin:24px 0}.emergency{display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(255,100,8,.75);border-radius:12px;padding:24px 28px;margin-top:24px;background:linear-gradient(90deg,rgba(255,100,8,.11),rgba(9,17,26,.88))}.emergency b,.emergency small{display:block}.emergency em{color:var(--orange);font-style:normal}.emergency a{font-size:30px;font-weight:900;color:var(--orange);text-decoration:none}.split-card{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:34px;padding:34px;overflow:hidden}.split-card h2{font-size:clamp(28px,3.4vw,44px)}.split-card img{width:100%;border-radius:10px;border:1px solid var(--line);display:block;aspect-ratio:2.44/1;object-fit:cover;object-position:center}.footer{border-top:1px solid var(--line);padding:42px 0 26px;background:rgba(3,8,14,.98)}.footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:34px}.footer img{width:270px;max-width:100%;border-radius:10px}.footer a{display:block;color:var(--muted);text-decoration:none;margin:5px 0}.footer p{color:var(--muted)}.legal{display:flex;gap:22px;justify-content:center;margin-top:22px;color:var(--muted)}.legal a{color:var(--muted);text-decoration:none}.nav-toggle.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}.nav-toggle.open span:nth-child(2){opacity:0}.nav-toggle.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}@media(max-width:980px){.site-header{height:auto;min-height:78px;flex-wrap:wrap;padding:10px 18px}.brand{width:226px;height:54px}.nav-toggle{display:block;margin-left:auto}.main-nav{display:none;order:3;width:100%;flex-direction:column;gap:0;margin:0}.main-nav.open{display:flex}.main-nav a{padding:14px 0;border-top:1px solid var(--line)}.header-btn{display:none}.hero{min-height:610px}.hero h1{font-size:42px}.hero-arrow{display:none}.quick-grid,.services-grid,.process-grid,.gallery-grid,.trust-grid,.contact-top,.contact-layout,.about-band,.split-card,.footer-grid{grid-template-columns:1fr}.quick-grid div{justify-content:flex-start}.trust-grid div,.contact-top div{border-radius:12px;margin-bottom:12px}.about-image img{min-height:300px}.two{grid-template-columns:1fr}.emergency{align-items:flex-start;gap:20px;flex-direction:column}.emergency a{font-size:24px}}@media(max-width:560px){.container{width:min(100% - 26px,1160px)}.hero{min-height:560px}.hero-content{padding-top:10px}.hero h1{font-size:34px}.lead{font-size:17px}.btn{width:100%}.service-card{padding:22px}.section{padding:44px 0}.gallery-grid img{height:190px}.stats{grid-template-columns:1fr}.footer img{width:230px}.contact-top a,.contact-top strong{font-size:20px}}

/* Rechtliche Unterseiten */
.legal-wrap {
  padding-top: 120px;
}
.legal-page {
  max-width: 980px;
  padding-top: 40px;
  padding-bottom: 80px;
  line-height: 1.75;
}
.legal-page h1 {
  font-size: clamp(2.2rem, 5vw, 4rem);
  margin-bottom: 32px;
  color: #fff;
}
.legal-page h2 {
  margin-top: 34px;
  margin-bottom: 12px;
  color: #fff;
  font-size: 1.25rem;
}
.legal-page p,
.legal-page li {
  color: rgba(255,255,255,.78);
}
.legal-page a {
  color: #168bff;
}
.legal-page ul {
  margin-left: 22px;
  margin-bottom: 20px;
}


/* Hinweisboxen */
.start-hinweis {
  margin-top: 18px;
  padding: 14px 18px;
  border: 1px solid rgba(255,255,255,.22);
  border-left: 4px solid #f28c28;
  border-radius: 14px;
  background: rgba(5, 18, 34, .72);
  color: rgba(255,255,255,.92);
  font-weight: 600;
  max-width: 760px;
}

.contact-notice {
  margin-bottom: 22px;
  padding: 18px 20px;
  border-radius: 18px;
  background: rgba(242,140,40,.12);
  border: 1px solid rgba(242,140,40,.35);
  color: rgba(255,255,255,.9);
  line-height: 1.6;
}

/* Konkrete Kundendienst-Arbeiten */
.typical-work {
  margin-top: 28px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(13,25,38,.88), rgba(5,10,16,.86));
  box-shadow: var(--shadow);
  text-align: center;
}
.typical-work h3 {
  margin: 0 0 8px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.typical-work p {
  margin: 0 auto 18px;
  color: var(--muted);
}
.work-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}
.work-chips span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(149,177,205,.28);
  background: rgba(4,8,13,.65);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}
.work-chips span:nth-child(odd) { border-color: rgba(0,140,255,.45); }
.work-chips span:nth-child(even) { border-color: rgba(255,100,8,.45); }

/* Verbesserte Darstellung: Typische Kundendienst-Arbeiten */
.typical-work {
  position: relative;
  overflow: hidden;
  margin-top: 34px;
  padding: clamp(24px, 4vw, 42px);
  border-radius: 22px;
  border: 1px solid rgba(149,177,205,.22);
  background:
    linear-gradient(135deg, rgba(0,140,255,.10), transparent 32%),
    linear-gradient(315deg, rgba(255,100,8,.10), transparent 34%),
    rgba(5,10,16,.82);
  box-shadow: 0 22px 70px rgba(0,0,0,.45);
  text-align: left;
}
.typical-work::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('assets/blueprint-bg.jpg') center/cover;
  opacity: .10;
  pointer-events: none;
}
.typical-work > * { position: relative; z-index: 1; }
.typical-head {
  max-width: 760px;
  margin: 0 auto 24px;
  text-align: center;
}
.typical-head h3 {
  margin: 4px 0 10px;
  font-size: clamp(26px, 3vw, 38px);
  text-transform: uppercase;
  letter-spacing: .03em;
}
.typical-head p {
  margin: 0;
  color: var(--muted);
  font-size: 17px;
}
.job-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.job-card {
  min-height: 100%;
  padding: 24px 22px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(12,23,34,.94), rgba(4,8,13,.92));
  border: 1px solid rgba(149,177,205,.20);
  box-shadow: 0 14px 38px rgba(0,0,0,.32);
}
.job-card.blue-card { border-top: 3px solid var(--blue); }
.job-card.orange-card { border-top: 3px solid var(--orange); }
.job-card.neutral-card { border-top: 3px solid rgba(255,255,255,.65); }
.job-icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  margin-bottom: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  font-size: 24px;
}
.job-card h4 {
  margin: 0 0 14px;
  font-size: 21px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.job-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.job-card li {
  position: relative;
  padding: 10px 0 10px 24px;
  color: rgba(255,255,255,.86);
  border-top: 1px solid rgba(149,177,205,.13);
  line-height: 1.45;
}
.job-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 10px;
  color: var(--blue);
  font-weight: 900;
}
.orange-card li::before { color: var(--orange); }
.neutral-card li::before { color: #fff; }
@media (max-width: 900px) {
  .job-grid { grid-template-columns: 1fr; }
  .job-card { padding: 22px 20px; }
}

.seo-intro{max-width:880px;margin:14px auto 0;color:#d7e5f5;font-size:1.02rem;line-height:1.75}


/* Vollbreiter Über-uns-Banner mit Transporter und KI-Person */
.about-full-banner {
  padding: 52px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(3,8,14,.72), rgba(3,8,14,.92));
}
.about-full-wrap {
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(149,177,205,.24);
  box-shadow: var(--shadow);
  background: rgba(4,9,14,.78);
}
.about-full-wrap img {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 760px) {
  .about-full-banner { padding: 34px 0; }
  .about-full-wrap {
    border-radius: 12px;
  }
  .about-full-wrap img {
    width: 180%;
    max-width: none;
    transform: translateX(-7%);
  }
}

/* Mehr-erfahren-Buttons in den Leistungskarten */
.more-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--blue);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
  text-decoration: none;
}
.more-link:hover { color: var(--orange); }

/* Leistungsfenster / Modal */
.service-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
}
.service-modal.is-open { display: flex; }
.service-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(8px);
}
.service-modal__panel {
  position: relative;
  width: min(940px, 100%);
  max-height: min(86vh, 820px);
  overflow: auto;
  padding: clamp(24px, 4vw, 42px);
  border-radius: 22px;
  border: 1px solid rgba(149,177,205,.28);
  background:
    linear-gradient(135deg, rgba(0,140,255,.14), transparent 32%),
    linear-gradient(315deg, rgba(255,100,8,.13), transparent 34%),
    rgba(5,10,16,.97);
  box-shadow: 0 28px 90px rgba(0,0,0,.65);
}
.service-modal__panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('assets/blueprint-bg.jpg') center/cover;
  opacity: .08;
  pointer-events: none;
}
.service-modal__panel > * { position: relative; z-index: 1; }
.service-modal__close {
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 2;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(3,8,14,.86);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.service-modal h3 {
  margin: 4px 48px 14px 0;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.05;
  text-transform: uppercase;
}
.service-modal p { color: var(--muted); font-size: 17px; }
.modal-list-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 22px 0;
}
.modal-list-grid ul {
  margin: 0;
  padding: 20px 22px;
  list-style: none;
  border: 1px solid rgba(149,177,205,.20);
  border-radius: 16px;
  background: rgba(4,8,13,.58);
}
.modal-list-grid li {
  position: relative;
  padding: 10px 0 10px 28px;
  border-top: 1px solid rgba(149,177,205,.12);
  color: rgba(255,255,255,.88);
}
.modal-list-grid li:first-child { border-top: 0; }
.modal-list-grid li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 10px;
  color: var(--blue);
  font-weight: 900;
}
.modal-list-grid ul:nth-child(2) li::before { color: var(--orange); }
.modal-note {
  padding: 14px 16px;
  border-left: 4px solid var(--orange);
  border-radius: 12px;
  background: rgba(255,100,8,.10);
  color: rgba(255,255,255,.86) !important;
}
body.modal-open { overflow: hidden; }
@media (max-width: 760px) {
  .service-modal { padding: 12px; }
  .service-modal__panel { max-height: 90vh; border-radius: 16px; }
  .modal-list-grid { grid-template-columns: 1fr; }
  .service-modal h3 { margin-right: 36px; }
}

/* V8: Mehr-erfahren direkt unter den Leistungskarten */
.more-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
  padding: 13px 24px !important;
  border: 0 !important;
  border-radius: 6px;
  background: linear-gradient(100deg, var(--blue), var(--orange)) !important;
  color: #fff !important;
  font-weight: 900 !important;
  letter-spacing: .01em;
  box-shadow: 0 12px 34px rgba(0,0,0,.26), inset 0 0 0 1px rgba(255,255,255,.12);
  cursor: pointer;
  text-decoration: none;
  transition: .2s;
}
.more-link:hover,
.more-link.is-active {
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 16px 42px rgba(0,0,0,.34), 0 0 24px rgba(0,140,255,.18), 0 0 24px rgba(255,100,8,.16);
}
.more-link span { font-size: 18px; line-height: 1; }

.service-details-wrap {
  display: none;
  margin-top: 22px;
}
.service-details-wrap.is-visible { display: block; }
.service-detail {
  display: none;
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid rgba(149,177,205,.28);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(0,140,255,.14), transparent 31%),
    linear-gradient(315deg, rgba(255,100,8,.14), transparent 34%),
    rgba(5,10,16,.94);
  box-shadow: var(--shadow);
}
.service-detail.is-open { display: block; }
.service-detail::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('assets/blueprint-bg.jpg') center/cover;
  opacity: .08;
  pointer-events: none;
}
.service-detail > * { position: relative; z-index: 1; }
.detail-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 6px;
}
.detail-close {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(3,8,14,.82);
  color: #fff;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.service-detail h3 {
  margin: 4px 0 12px;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.05;
  text-transform: uppercase;
}
.service-detail p { color: var(--muted); font-size: 17px; max-width: 920px; }
.detail-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
  margin: 22px 0;
}
.detail-columns > div {
  border: 1px solid rgba(149,177,205,.20);
  border-radius: 16px;
  background: rgba(4,8,13,.62);
  padding: 22px;
}
.detail-columns h4 {
  margin: 0 0 12px;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.detail-columns ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.detail-columns li {
  position: relative;
  padding: 10px 0 10px 28px;
  border-top: 1px solid rgba(149,177,205,.12);
  color: rgba(255,255,255,.88);
}
.detail-columns li:first-child { border-top: 0; }
.detail-columns li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 10px;
  color: var(--blue);
  font-weight: 900;
}
.detail-columns > div:nth-child(2) li::before { color: var(--orange); }
.detail-note {
  padding: 14px 16px;
  border-left: 4px solid var(--orange);
  border-radius: 12px;
  background: rgba(255,100,8,.10);
  color: rgba(255,255,255,.86) !important;
}
@media(max-width:760px){
  .detail-columns { grid-template-columns: 1fr; }
  .more-link { width: 100%; }
  .service-detail { border-radius: 14px; }
}


/* V9: saubere Mehr-erfahren-Karten direkt unter dem Button */
.service-card{display:flex;flex-direction:column;align-items:flex-start;gap:0;overflow:hidden;transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease}
.service-card--wide{min-height:270px}
.more-link{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  margin-top:auto;padding:13px 24px;border:0;border-radius:8px;
  color:#fff;background:linear-gradient(100deg,var(--blue),var(--orange));
  font:inherit;font-weight:900;letter-spacing:.01em;cursor:pointer;text-decoration:none;
  box-shadow:0 12px 34px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.10);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.more-link:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(0,0,0,.35)}
.more-link span{font-weight:900;transition:transform .2s ease}
.more-link.is-active span{transform:rotate(90deg)}
.service-card.is-open{grid-column:span 3;border-color:rgba(0,140,255,.75);box-shadow:0 24px 80px rgba(0,0,0,.58)}
.service-card.is-open .more-link{filter:saturate(1.08)}
.card-detail{
  width:100%;margin-top:22px;padding:24px;border-radius:12px;
  background:linear-gradient(145deg,rgba(4,10,16,.92),rgba(10,20,31,.82));
  border:1px solid rgba(149,177,205,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.card-detail h4{font-size:22px;margin:0 0 8px;text-transform:uppercase;color:#fff;letter-spacing:.01em}
.card-detail p{margin:0 0 16px;color:var(--muted);max-width:980px}
.detail-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:16px}
.detail-mini-grid>div,.card-detail>ul{
  border:1px solid rgba(149,177,205,.18);border-radius:10px;
  padding:18px;background:rgba(255,255,255,.025);
}
.detail-mini-grid strong{display:block;color:#fff;font-size:17px;margin-bottom:10px}
.card-detail ul,.detail-mini-grid ul{margin:0;padding:0;list-style:none;color:var(--muted)}
.card-detail li,.detail-mini-grid li{position:relative;padding:9px 0 9px 24px;border-top:1px solid rgba(149,177,205,.12)}
.card-detail li:first-child,.detail-mini-grid li:first-child{border-top:0}
.card-detail li:before,.detail-mini-grid li:before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:900}
.service-card:nth-child(2) .card-detail li:before,.service-card:nth-child(5) .card-detail li:before,.service-card:nth-child(6) .card-detail li:before{color:var(--orange)}
.service-details-wrap{display:none!important}
@media(max-width:980px){.service-card.is-open{grid-column:auto}.detail-mini-grid{grid-template-columns:1fr}.more-link{width:100%;margin-top:18px}.card-detail{padding:18px}}

/* V10: Mehr-erfahren direkt in der jeweiligen Leistungskarte – kein Popup, kein weißer Standardbutton */
#leistungen .service-card{
  overflow:hidden;
}
#leistungen .service-more{
  width:100%;
  margin-top:22px;
}
#leistungen .service-more > summary{
  list-style:none;
  cursor:pointer;
  user-select:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-width:230px;
  padding:15px 26px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(100deg,var(--blue) 0%,#246fae 45%,#da5a18 100%) !important;
  color:#fff !important;
  font-weight:900;
  letter-spacing:.01em;
  text-decoration:none;
  box-shadow:0 16px 42px rgba(0,0,0,.36),0 0 26px rgba(0,140,255,.18);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
#leistungen .service-more > summary::-webkit-details-marker{display:none;}
#leistungen .service-more > summary:hover{
  transform:translateY(-2px);
  filter:saturate(1.08);
  box-shadow:0 22px 54px rgba(0,0,0,.48),0 0 34px rgba(255,100,8,.18);
}
#leistungen .service-more[open] > summary .arrow{
  transform:rotate(90deg);
}
#leistungen .service-more > summary .arrow{
  display:inline-block;
  transition:transform .18s ease;
  font-size:18px;
}
#leistungen .service-more .card-detail{
  margin-top:22px;
  width:100%;
  padding:24px;
  border-radius:14px;
  border:1px solid rgba(149,177,205,.22);
  background:linear-gradient(180deg,rgba(4,10,16,.94),rgba(7,16,25,.88)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 50px rgba(0,0,0,.28);
  color:#fff;
}
#leistungen .service-more .card-detail h4{
  margin:0 0 10px;
  font-size:22px;
  line-height:1.25;
  color:#fff;
  text-transform:none;
}
#leistungen .service-more .card-detail p{
  margin:0 0 18px;
  color:var(--muted);
  max-width:980px;
}
#leistungen .service-more .detail-mini-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
#leistungen .service-more .detail-mini-grid > div,
#leistungen .service-more .card-detail > ul{
  border:1px solid rgba(149,177,205,.15);
  background:rgba(2,7,12,.38);
  border-radius:12px;
  padding:18px;
}
#leistungen .service-more strong{
  display:block;
  color:#fff;
  margin-bottom:10px;
  font-size:16px;
}
#leistungen .service-more ul{
  list-style:none;
  padding:0;
  margin:0;
}
#leistungen .service-more li{
  position:relative;
  padding:8px 0 8px 24px;
  color:var(--muted);
  border-top:1px solid rgba(149,177,205,.1);
}
#leistungen .service-more li:first-child{border-top:0;}
#leistungen .service-more li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:8px;
  color:var(--blue);
  font-weight:900;
}
#leistungen .service-card:nth-child(2) .service-more li::before,
#leistungen .service-card:nth-child(5) .service-more li::before,
#leistungen .service-card:nth-child(6) .service-more li::before{color:var(--orange);}
#leistungen .more-link{display:none!important;}
@media(max-width:980px){
  #leistungen .service-more > summary{width:100%;min-width:0;}
  #leistungen .service-more .detail-mini-grid{grid-template-columns:1fr;}
  #leistungen .service-more .card-detail{padding:18px;}
}


/* V11: Perspektive statt großem Über-uns-Bild */
.about-full-banner{display:none!important;}
.perspective-section{padding:64px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.perspective-card{display:grid;grid-template-columns:.82fr 1.18fr;gap:28px;align-items:center;background:linear-gradient(145deg,rgba(10,19,29,.88),rgba(5,10,16,.9));border:1px solid rgba(149,177,205,.24);box-shadow:var(--shadow);border-radius:16px;padding:34px;overflow:hidden;}
.perspective-text h2{font-size:clamp(34px,4.7vw,62px);line-height:.98;text-transform:uppercase;margin:0 0 18px;text-shadow:0 3px 0 rgba(0,0,0,.45)}
.perspective-text p{color:var(--muted);font-size:18px;line-height:1.7;max-width:650px;margin:0 0 18px;}
.perspective-text .btn{margin-top:10px;}
.perspective-image{border:1px solid rgba(149,177,205,.24);border-radius:14px;overflow:hidden;box-shadow:0 18px 55px rgba(0,0,0,.5);background:#07101a;}
.perspective-image img{display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:cover;object-position:center;}
@media(max-width:980px){.perspective-card{grid-template-columns:1fr;padding:24px}.perspective-image img{aspect-ratio:4/3}.perspective-text p{font-size:16px}}

/* V11: Mehr erfahren als echter Verlauf-Button, Inhalt direkt darunter in der Karte */
#leistungen details.service-more{display:block;width:100%;margin-top:22px;}
#leistungen details.service-more > summary,
#leistungen details.service-more > summary.service-toggle{
  -webkit-appearance:none;appearance:none;list-style:none;cursor:pointer;user-select:none;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;
  min-width:230px!important;padding:15px 26px!important;border-radius:8px!important;
  border:0!important;background:linear-gradient(100deg,var(--blue) 0%,#246fae 45%,var(--orange) 100%)!important;
  color:#fff!important;font-weight:900!important;letter-spacing:.01em!important;text-decoration:none!important;
  box-shadow:0 16px 42px rgba(0,0,0,.36),0 0 26px rgba(0,140,255,.18)!important;
}
#leistungen details.service-more > summary::-webkit-details-marker{display:none!important;}
#leistungen details.service-more > summary::marker{content:""!important;}
#leistungen details.service-more > summary:hover{transform:translateY(-2px);filter:saturate(1.08);}
#leistungen details.service-more[open] > summary .arrow{transform:rotate(90deg);}
#leistungen details.service-more > summary .arrow{display:inline-block;transition:transform .18s ease;}
#leistungen details.service-more .card-detail{display:block!important;position:static!important;margin-top:22px!important;width:100%!important;max-width:none!important;padding:24px!important;border-radius:14px!important;border:1px solid rgba(149,177,205,.22)!important;background:linear-gradient(180deg,rgba(4,10,16,.94),rgba(7,16,25,.88))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 50px rgba(0,0,0,.28)!important;color:#fff!important;overflow:visible!important;}
#leistungen details.service-more:not([open]) .card-detail{display:none!important;}
#leistungen details.service-more .detail-mini-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;}
@media(max-width:980px){#leistungen details.service-more > summary{width:100%!important;min-width:0!important;}#leistungen details.service-more .detail-mini-grid{grid-template-columns:1fr!important}}

/* V12: saubere Aufklappbereiche in den Leistungskarten */
#leistungen .services-grid{align-items:start;}
#leistungen .service-card{overflow:visible;}
#leistungen .service-card.is-open{
  grid-column:1 / -1 !important;
  border-color:rgba(0,140,255,.72) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.58) !important;
}
#leistungen details.service-more{display:block;width:100%;margin-top:auto;padding-top:20px;}
#leistungen details.service-more > summary,
#leistungen details.service-more > summary.service-toggle{
  -webkit-appearance:none !important;appearance:none !important;list-style:none !important;cursor:pointer;user-select:none;
  display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:12px !important;
  width:auto !important;min-width:230px !important;padding:15px 28px !important;border-radius:8px !important;
  border:0 !important;background:linear-gradient(100deg,var(--blue) 0%,#2174b8 46%,var(--orange) 100%) !important;
  color:#fff !important;font-weight:900 !important;letter-spacing:.01em !important;text-decoration:none !important;
  box-shadow:0 16px 42px rgba(0,0,0,.36),0 0 26px rgba(0,140,255,.18) !important;
}
#leistungen details.service-more > summary::-webkit-details-marker{display:none !important;}
#leistungen details.service-more > summary::marker{content:"" !important;}
#leistungen details.service-more > summary:hover{transform:translateY(-2px);filter:saturate(1.08);}
#leistungen details.service-more[open] > summary .arrow{transform:rotate(90deg);}
#leistungen details.service-more > summary .arrow{display:inline-block;transition:transform .18s ease;}
#leistungen details.service-more:not([open]) .card-detail{display:none !important;}
#leistungen details.service-more .card-detail{
  display:block !important;position:static !important;clear:both !important;
  margin-top:24px !important;width:100% !important;max-width:none !important;
  padding:28px !important;border-radius:18px !important;
  border:1px solid rgba(149,177,205,.24) !important;
  background:
    linear-gradient(135deg,rgba(0,140,255,.09),transparent 30%),
    linear-gradient(315deg,rgba(255,100,8,.09),transparent 32%),
    rgba(4,10,16,.94) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 55px rgba(0,0,0,.34) !important;
  overflow:visible !important;color:#fff !important;
}
#leistungen details.service-more .card-detail h4{
  margin:0 0 10px !important;font-size:clamp(22px,2.4vw,30px) !important;line-height:1.18 !important;
  color:#fff !important;text-transform:none !important;letter-spacing:.01em !important;
}
#leistungen details.service-more .card-detail p{
  max-width:980px !important;margin:0 0 22px !important;color:#c9d5e1 !important;font-size:17px !important;line-height:1.7 !important;
}
#leistungen .detail-block-grid{
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:16px !important;align-items:stretch !important;
}
#leistungen .detail-block{
  border:1px solid rgba(149,177,205,.18) !important;border-radius:14px !important;
  padding:20px !important;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018)) !important;
}
#leistungen .detail-block strong{
  display:block !important;margin:0 0 12px !important;color:#fff !important;font-size:18px !important;line-height:1.25 !important;
  padding-bottom:10px !important;border-bottom:1px solid rgba(149,177,205,.16) !important;
}
#leistungen .detail-block ul{margin:0 !important;padding:0 !important;list-style:none !important;}
#leistungen .detail-block li{
  position:relative !important;margin:0 !important;padding:9px 0 9px 26px !important;
  color:#c4cfda !important;line-height:1.55 !important;border-top:1px solid rgba(149,177,205,.10) !important;
  overflow-wrap:break-word !important;word-break:normal !important;hyphens:auto !important;
}
#leistungen .detail-block li:first-child{border-top:0 !important;}
#leistungen .detail-block li::before{
  content:"✓" !important;position:absolute !important;left:0 !important;top:9px !important;color:var(--blue) !important;font-weight:900 !important;
}
#leistungen .service-card:nth-child(2) .detail-block li::before,
#leistungen .service-card:nth-child(5) .detail-block li::before,
#leistungen .service-card:nth-child(6) .detail-block li::before{color:var(--orange) !important;}
@media(max-width:1100px){#leistungen .detail-block-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media(max-width:700px){
  #leistungen .service-card.is-open{grid-column:auto !important;}
  #leistungen details.service-more > summary{width:100% !important;min-width:0 !important;}
  #leistungen details.service-more .card-detail{padding:20px !important;}
  #leistungen .detail-block-grid{grid-template-columns:1fr !important;}
}


/* V13: saubere Mehr-erfahren-Gliederung und vollständiges Perspektive-Foto */
#leistungen .services-grid{align-items:start!important;}
#leistungen .service-card{display:flex!important;flex-direction:column!important;overflow:visible!important;}
#leistungen .service-card:has(details[open]),
#leistungen .service-card.is-open{grid-column:1 / -1!important;}
#leistungen details.service-more{width:100%!important;margin-top:auto!important;padding-top:20px!important;}
#leistungen details.service-more > summary.service-toggle{
  appearance:none!important;-webkit-appearance:none!important;list-style:none!important;cursor:pointer!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;
  min-width:220px!important;padding:15px 28px!important;border-radius:8px!important;border:0!important;
  background:linear-gradient(100deg,var(--blue) 0%,#2174b8 46%,var(--orange) 100%)!important;
  color:#fff!important;font-weight:900!important;font-size:16px!important;letter-spacing:.01em!important;
  box-shadow:0 14px 34px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.18)!important;
}
#leistungen details.service-more > summary.service-toggle::-webkit-details-marker{display:none!important;}
#leistungen details.service-more > summary.service-toggle .arrow{font-size:18px!important;transition:transform .2s ease!important;}
#leistungen details.service-more[open] > summary.service-toggle .arrow{transform:rotate(90deg)!important;}
#leistungen details.service-more .detail-clean{display:none!important;}
#leistungen details.service-more[open] .detail-clean{
  display:block!important;position:static!important;width:100%!important;margin-top:24px!important;padding:30px!important;
  border-radius:18px!important;border:1px solid rgba(149,177,205,.24)!important;
  background:linear-gradient(135deg,rgba(0,140,255,.10),rgba(4,10,16,.96) 32%,rgba(255,100,8,.08))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 55px rgba(0,0,0,.34)!important;
  overflow:visible!important;color:#fff!important;
}
#leistungen .detail-clean h4{margin:0 0 10px!important;font-size:clamp(22px,2.4vw,30px)!important;line-height:1.2!important;text-transform:none!important;color:#fff!important;}
#leistungen .detail-clean .detail-intro{max-width:1050px!important;margin:0 0 22px!important;color:#c9d5e1!important;font-size:17px!important;line-height:1.65!important;}
#leistungen .detail-clean-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;gap:18px!important;align-items:start!important;}
#leistungen .detail-clean-group{min-width:0!important;border:1px solid rgba(149,177,205,.18)!important;border-radius:14px!important;padding:20px 20px 16px!important;background:rgba(2,7,12,.44)!important;}
#leistungen .detail-clean-group strong{display:block!important;margin:0 0 12px!important;color:#fff!important;font-size:18px!important;line-height:1.35!important;}
#leistungen .detail-clean-group ul{list-style:none!important;margin:0!important;padding:0!important;}
#leistungen .detail-clean-group li{position:relative!important;margin:0!important;padding:10px 0 10px 28px!important;border-top:1px solid rgba(149,177,205,.12)!important;color:#c9d5e1!important;line-height:1.45!important;overflow-wrap:anywhere!important;}
#leistungen .detail-clean-group li:first-child{border-top:0!important;}
#leistungen .detail-clean-group li::before{content:'✓'!important;position:absolute!important;left:0!important;top:10px!important;color:var(--blue)!important;font-weight:900!important;}
#leistungen .service-card:nth-child(2) .detail-clean-group li::before,
#leistungen .service-card:nth-child(5) .detail-clean-group li::before,
#leistungen .service-card:nth-child(6) .detail-clean-group li::before{color:var(--orange)!important;}
.perspective-card{grid-template-columns:.78fr 1.22fr!important;align-items:center!important;}
.perspective-image{background:#050a10!important;}
.perspective-image img{width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;background:#050a10!important;}
@media(max-width:980px){
  #leistungen .service-card:has(details[open]),#leistungen .service-card.is-open{grid-column:auto!important;}
  #leistungen details.service-more > summary.service-toggle{width:100%!important;min-width:0!important;}
  #leistungen details.service-more[open] .detail-clean{padding:22px!important;}
  #leistungen .detail-clean-grid{grid-template-columns:1fr!important;}
  .perspective-card{grid-template-columns:1fr!important;}
}

/* V15: Leistungskarten geschlossen sauber auf einer Linie */
#leistungen .services-grid{
  align-items:stretch !important;
  grid-auto-rows:1fr !important;
}
#leistungen .service-card{
  height:100% !important;
  min-height:315px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
}
#leistungen .service-card--wide{
  min-height:315px !important;
}
#leistungen .service-card .icon{
  height:34px !important;
  display:flex !important;
  align-items:center !important;
  margin-bottom:18px !important;
}
#leistungen .service-card h3{
  width:100% !important;
  min-height:54px !important;
  margin:0 0 14px !important;
  display:flex !important;
  align-items:flex-start !important;
}
#leistungen .service-card > p{
  width:100% !important;
  min-height:100px !important;
  margin:0 !important;
}
#leistungen details.service-more{
  margin-top:auto !important;
  padding-top:24px !important;
}
#leistungen .service-card:has(details[open]),
#leistungen .service-card.is-open{
  height:auto !important;
}
@media(max-width:980px){
  #leistungen .services-grid{
    grid-auto-rows:auto !important;
  }
  #leistungen .service-card,
  #leistungen .service-card--wide{
    min-height:auto !important;
  }
  #leistungen .service-card h3,
  #leistungen .service-card > p{
    min-height:auto !important;
  }
}

/* Korrektur 2026-08-01: Perspektive zeigt nur das freigestellte Foto, nicht den kompletten Webseiten-Screenshot. */
.perspective-image img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:4/3!important;
  object-fit:cover!important;
  object-position:center!important;
  background:#050a10!important;
}


/* Logo-Hintergrund an den Webseitenkopf angepasst */
.brand{border-radius:0;background:transparent}
.brand img{display:block;border-radius:0}
.footer img{border-radius:0;background:transparent}

/* V15: Logo ohne sichtbaren Bildrahmen */
.site-header{background:#03080e}
.footer{background:#03080e}
.brand,.brand img,.footer img{border-radius:0;background:#03080e}

/* V18: zusätzliche Navigation und Kundenbereiche im bestehenden Design */
.main-nav{gap:18px}
.main-nav a{font-size:13px;white-space:nowrap}
.site-header{gap:20px;padding-left:clamp(18px,2.5vw,42px);padding-right:clamp(18px,2.5vw,42px)}
.header-btn{margin-left:8px}

.customer-points{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 24px}
.customer-points span{display:inline-flex;align-items:center;padding:9px 13px;border:1px solid rgba(149,177,205,.24);border-radius:999px;background:rgba(5,10,16,.56);color:#eef4fb;font-weight:700;font-size:14px}
.client-section{padding-top:18px}
.client-card-reverse{grid-template-columns:1.05fr .95fr}
.about-operator{padding-top:28px}
.about-company-card img{aspect-ratio:16/9;object-position:center}

/* Warum Kellerer – angelehnt an eine hochwertige Meisterbetriebs-Darstellung */
.why-kellerer{position:relative;padding-top:78px;padding-bottom:76px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(4,10,17,.36),rgba(8,17,26,.76))}
.why-kellerer:before{content:"";position:absolute;inset:0;background:url('assets/blueprint-bg.jpg') center/cover;opacity:.08;pointer-events:none}
.why-kellerer>.container{position:relative;z-index:1}
.why-head{margin-bottom:34px}
.why-process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.why-process-grid article{position:relative;overflow:hidden;min-height:230px;padding:30px 28px;border-radius:14px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(13,25,38,.94),rgba(5,10,16,.9));box-shadow:var(--shadow)}
.why-process-grid article:nth-child(1){border-top:3px solid var(--blue)}
.why-process-grid article:nth-child(2){border-top:3px solid rgba(255,255,255,.68)}
.why-process-grid article:nth-child(3){border-top:3px solid var(--orange)}
.why-process-grid h3{font-size:22px;text-transform:uppercase;margin:12px 0 10px}
.why-process-grid p{color:var(--muted);margin:0}
.why-number{font-size:13px;font-weight:900;letter-spacing:.1em;color:var(--orange)}
.why-promises-wrap{margin-top:30px;padding:34px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,rgba(11,22,34,.88),rgba(5,10,16,.88));box-shadow:var(--shadow)}
.why-promises-head{text-align:center;margin-bottom:24px}
.why-promises-head h3{font-size:clamp(25px,3vw,38px);text-transform:uppercase;margin:0}
.why-promises-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.why-promises-grid article{padding:22px 20px;border:1px solid rgba(149,177,205,.18);border-radius:12px;background:rgba(4,9,15,.52)}
.why-promises-grid article>span{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;margin-bottom:14px;background:linear-gradient(135deg,rgba(0,140,255,.16),rgba(255,100,8,.14));border:1px solid rgba(149,177,205,.20);color:#fff;font-size:21px;font-weight:900}
.why-promises-grid h4{margin:0 0 8px;font-size:18px;text-transform:uppercase;letter-spacing:.02em}
.why-promises-grid p{margin:0;color:var(--muted);font-size:15px}
.why-cta{margin-top:22px;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:24px 28px;border-radius:14px;border:1px solid rgba(0,140,255,.48);background:linear-gradient(90deg,rgba(0,140,255,.10),rgba(255,100,8,.08))}
.why-cta strong,.why-cta span{display:block}
.why-cta strong{font-size:20px}
.why-cta span{margin-top:4px;color:var(--muted)}

/* Foto-Upload im Anfrageformular */
.file-upload{margin:2px 0 16px;padding:18px;border:1px dashed rgba(149,177,205,.38);border-radius:9px;background:rgba(4,8,13,.54)}
.file-upload label{display:block;margin-bottom:12px;cursor:pointer}
.file-upload label strong,.file-upload label span{display:block}
.file-upload label strong{color:#fff;margin-bottom:4px}
.file-upload label span{color:var(--muted);font-size:13px}
.file-upload input[type=file]{margin:0;padding:10px;background:rgba(8,16,25,.82)}
.area-card a{color:var(--blue);text-decoration:none}

@media(max-width:1320px){
  .site-header{height:auto;min-height:78px;flex-wrap:wrap;padding:10px 18px}
  .brand{width:226px;height:54px}
  .nav-toggle{display:block;margin-left:auto}
  .main-nav{display:none;order:3;width:100%;flex-direction:column;gap:0;margin:0}
  .main-nav.open{display:flex}
  .main-nav a{padding:14px 0;border-top:1px solid var(--line);font-size:14px}
  .header-btn{display:none}
}
@media(max-width:980px){
  .why-process-grid,.why-promises-grid{grid-template-columns:1fr}
  .client-card-reverse{grid-template-columns:1fr}
  .why-cta{align-items:flex-start;flex-direction:column}
}


/* V20: Bild- und Responsive-Feinschliff */
.slide.hero-kellerer-slide{background-position:center 44%;}
#privatkunden .perspective-image img,
#hausverwaltungen .perspective-image img{
  width:100%!important;
  aspect-ratio:16/10!important;
  object-fit:cover!important;
  object-position:center!important;
}
@media(max-width:980px){
  .slide.hero-kellerer-slide{background-position:66% center;}
  #privatkunden .perspective-image img,
  #hausverwaltungen .perspective-image img{aspect-ratio:4/3!important;}
}
@media(max-width:560px){
  .slide.hero-kellerer-slide{background-position:68% center;}
  #privatkunden .perspective-image img,
  #hausverwaltungen .perspective-image img{aspect-ratio:1/1!important;}
}

/* V22: fünf klar strukturierte Leistungsbereiche */
#leistungen .services-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  grid-auto-rows:auto!important;
}
#leistungen .service-card{
  grid-column:span 2;
  min-height:300px!important;
}
#leistungen .service-card:nth-child(4),
#leistungen .service-card:nth-child(5){
  grid-column:span 3;
}
#leistungen .service-card.is-open,
#leistungen .service-card:has(details[open]){
  grid-column:1 / -1!important;
}
#leistungen .service-card:nth-child(2) .detail-clean-group li::before,
#leistungen .service-card:nth-child(5) .detail-clean-group li::before{
  color:var(--orange)!important;
}

.contact-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:4px;
}
.contact-phone-button{
  min-height:49px;
}

@media(max-width:980px){
  #leistungen .services-grid{grid-template-columns:1fr!important;}
  #leistungen .service-card,
  #leistungen .service-card:nth-child(4),
  #leistungen .service-card:nth-child(5){grid-column:auto!important;min-height:auto!important;}
  .contact-actions{grid-template-columns:1fr;}
}


/* V23 – deutlich hervorgehobene Telefon-Buttons */
.phone-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  min-height:58px;
  padding:15px 24px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:linear-gradient(100deg,#ff6408 0%,#f36a12 42%,#147fd4 100%);
  color:#fff!important;
  text-decoration:none!important;
  font-size:21px;
  font-weight:900;
  letter-spacing:.01em;
  box-shadow:0 14px 34px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.16);
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}
.phone-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,255,255,.18);
  filter:brightness(1.06);
}
.phone-cta-icon{
  font-size:23px;
  line-height:1;
  color:#fff;
}
.area-phone-button{
  width:100%;
  margin-top:18px;
}
.contact-phone-button{
  width:100%;
  min-height:58px;
}
@media(max-width:560px){
  .phone-cta{font-size:19px;min-height:56px;padding:14px 18px;}
}