:root{--ink:#173b40;--muted:#51666b;--teal:#247a79;--light:#eaf3f1;--paper:#f8faf7;--line:#d9e3de;--radius:20px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:17px;line-height:1.65}a{color:inherit}img{display:block;max-width:100%}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #d49129;outline-offset:5px}.wrap{width:min(1180px,calc(100% - 64px));margin:auto}.skip{position:absolute;top:-80px;left:20px;background:white;padding:10px;z-index:100}.skip:focus{top:10px}.header{border-bottom:1px solid var(--line);background:var(--paper)}.nav{min-height:94px;display:flex;align-items:center;justify-content:space-between;gap:32px}.brand{display:flex;align-items:center;text-decoration:none}.brand img{width:185px;height:auto}.links{display:flex;align-items:center;gap:28px}.links a{text-decoration:none;font-size:14px;font-weight:700}.links a:hover,.links a[aria-current=page]{color:var(--teal)}.menu-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:8px;padding:9px 14px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;text-decoration:none;background:var(--teal);color:white;border:1px solid var(--teal);border-radius:8px;padding:13px 22px;font-size:15px;font-weight:700;transition:background .2s,transform .2s}.button:hover{background:#1b6060;transform:translateY(-2px)}.button.secondary{background:transparent;color:var(--ink);border-color:#b6c9c5}.links .button{color:white;padding:10px 17px}.eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:12px;font-weight:700;color:var(--teal);margin:0 0 20px}.hero{padding:76px 0 72px}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:72px}h1,h2,h3{line-height:1.12;letter-spacing:-.045em;margin:0;font-weight:700}h1{font-size:clamp(42px,4.9vw,68px);max-width:760px}h1 em{font-style:normal;color:var(--teal)}h2{font-size:clamp(30px,3vw,43px)}h3{font-size:24px;letter-spacing:-.025em}.lead{font-size:19px;line-height:1.7;color:var(--muted);max-width:620px;margin:25px 0 28px}.actions{display:flex;flex-wrap:wrap;gap:12px}.fine{font-size:13px;color:var(--muted);margin-top:20px}.hero-image{position:relative;border-radius:var(--radius);overflow:hidden;background:#e6eeea}.hero-image img{width:100%;height:480px;object-fit:cover;object-position:center}.image-caption{position:absolute;bottom:20px;left:20px;right:20px;background:#fffef5f0;border-radius:12px;padding:15px 20px;display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:13px}.image-caption strong{font-size:16px;display:block}.section{padding:70px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:34px}.section-head p{max-width:370px;margin:0;color:var(--muted)}.topics{background:#fff;border-block:1px solid var(--line)}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{display:block;text-decoration:none;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper);transition:transform .25s,box-shadow .25s}.card:hover{transform:translateY(-5px);box-shadow:0 14px 24px #173b400c}.card-image{height:235px;position:relative;overflow:hidden}.card-image img{width:100%;height:100%;object-fit:cover;transition:opacity .35s,transform .5s}.card-image .hover{position:absolute;inset:0;opacity:0}.card:hover .hover,.card:focus-visible .hover{opacity:1}.card:hover .base{opacity:0}.card-body{padding:22px}.card-body h3{font-size:20px;display:flex;justify-content:space-between;gap:10px}.card-body p{font-size:14px;line-height:1.6;color:var(--muted);margin:12px 0 0}.product{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}.product-art{background:#dfeeea;border-radius:var(--radius);padding:32px}.product-art img{width:100%;max-height:440px;object-fit:cover;border-radius:12px}.feature-list{list-style:none;padding:0;margin:28px 0}.feature-list li{padding:13px 0;border-bottom:1px solid var(--line);display:flex;gap:16px;font-size:16px}.feature-list li span{color:var(--teal);font-weight:bold}.about-band{background:var(--ink);color:#fff}.about-band .eyebrow{color:#a6d7ca}.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center}.about-band p{color:#ccdedb}.about-band .button{background:#d3e8dd;border-color:#d3e8dd;color:var(--ink)}.contact-strip{display:flex;justify-content:space-between;gap:30px;align-items:center;padding:55px 0}.contact-strip p{color:var(--muted);margin:12px 0 0}.footer{border-top:1px solid var(--line);padding:30px 0;color:var(--muted);font-size:13px}.footer-row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer-links{display:flex;gap:22px;flex-wrap:wrap}.footer a{text-decoration:none}.footer a:hover{text-decoration:underline}.subhero{padding:65px 0 40px}.subhero h1{font-size:clamp(39px,5vw,60px)}.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:30px}.breadcrumb a{text-decoration:none}.reading{max-width:820px;padding-bottom:70px}.reading h2{font-size:28px;margin:38px 0 16px}.reading h3{margin:30px 0 12px;font-size:23px}.reading p{color:var(--muted)}.reading ul{padding-left:22px}.legal table{border-collapse:collapse;width:100%;font-size:16px}.legal td{padding:12px 0;vertical-align:top;border-bottom:1px solid var(--line)}.legal td:first-child:not([colspan]){width:29%;padding-right:22px;font-weight:bold}.legal td[colspan]{border:0}.legal .cls_td_header_formell{font-size:23px;line-height:1.4;font-weight:bold;margin:0 0 20px}.legal .cls_td_point_formell{font-size:20px;font-weight:bold;margin-top:24px}.notice{background:var(--light);border-left:4px solid var(--teal);padding:20px 24px;border-radius:0 10px 10px 0;margin:24px 0}.contact-address{font-style:normal;margin:25px 0}.text-link{font-weight:bold;color:var(--teal);text-underline-offset:5px}.split-content{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}.split-content img{border-radius:16px;max-height:520px;width:100%;object-fit:cover}@media(min-width:900px){.header{position:sticky;top:0;z-index:20}}@media(max-width:1000px){.hero-grid{gap:35px}.cards{grid-template-columns:repeat(2,1fr)}.card-image{height:290px}.product{gap:40px}.links{gap:18px}.hero-image img{height:440px}}@media(max-width:760px){.wrap{width:calc(100% - 36px)}.nav{min-height:78px;flex-wrap:wrap;gap:0}.brand img{width:160px}.menu-toggle{display:block}.links{width:100%;display:flex;flex-wrap:wrap;gap:18px;padding:12px 0 22px}.js .links{display:none}.js .links.open{display:flex}.hero{padding:42px 0}.hero-grid,.product,.about-grid,.split-content{grid-template-columns:1fr;gap:34px}h1{font-size:44px}.lead{font-size:17px}.hero-image img{height:360px}.section{padding:48px 0}.section-head{display:block}.section-head p{margin-top:18px}.card-image{height:230px}.card-body{padding:18px}.card-body h3{font-size:18px}.product-art{padding:22px}.contact-strip{display:block;padding:40px 0}.contact-strip .button{margin-top:22px}.subhero{padding-top:35px}.legal td:first-child:not([colspan]){width:34%}.legal td{font-size:14px;overflow-wrap:anywhere}}@media(max-width:420px){.cards{grid-template-columns:1fr}.card-image{height:300px}.hero-image img{height:330px}h1{font-size:39px}.image-caption{font-size:11px;left:14px;right:14px}.footer-row{display:block}.footer-links{margin-top:14px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

.gallery{margin:25px 0 45px;background:white;border:1px solid var(--line);border-radius:16px;padding:20px}.slide{margin:0}.slide[hidden]{display:none}.slide img{width:100%;height:440px;object-fit:contain}.slide figcaption{text-align:center;font-weight:bold;margin:16px 0}.slide-controls{display:none;justify-content:center;gap:10px;margin-top:20px}.js .slide-controls{display:flex}.slide-controls button{width:42px;height:42px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:50%;cursor:pointer}.slide-controls button[aria-pressed=true]{background:var(--teal);color:white}.gallery-status{text-align:center;font-size:12px;margin:12px 0 0!important}@media(max-width:760px){.slide img{height:280px}.gallery{padding:12px}}

/* Bildkacheln: vollständiges 3:4-Motiv, ohne Beschnitt; einheitliche Beschriftung */
.card-image{height:auto;aspect-ratio:3/4;background:#f5f8f6}
.card-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;transform:none!important}
.card-body h3{font-size:20px;line-height:1.3;min-height:2.6em;align-items:start}
@media(max-width:1000px){.card-image{height:auto}}
@media(max-width:760px){.card-image{height:auto}.card-body h3{font-size:20px}}
@media(max-width:420px){.card-image{height:auto}}

/* Startseite: Hero-Bild vollständig anzeigen, ohne Beschnitt der oberen Beschriftung. */
.hero-image img{height:auto;aspect-ratio:640/850;object-fit:contain;object-position:center}

/* Unaufdringlicher Cookie-Hinweis */
.cookie-notice{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:#fff;box-shadow:0 -8px 32px #102d3440;border-top:3px solid var(--teal,#227d75);color:var(--ink,#19324b)}
.cookie-notice-inner{max-width:1180px;margin:auto;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.cookie-notice strong{font-size:18px}.cookie-notice p{margin:6px 0 0;line-height:1.5;font-size:14px}.cookie-notice a{text-decoration:underline;color:inherit}
.cookie-notice-button{border:0;border-radius:8px;padding:12px 22px;background:var(--teal,#227d75);color:white;font-weight:700;cursor:pointer;white-space:nowrap}
@media(max-width:650px){.cookie-notice-inner{display:block;padding:16px}.cookie-notice-button{margin-top:12px;width:100%}}

/* Relaunch 2026: unabhängig vom Kostenplaner rotierende Startseitenmotive */
.hero-rotator{aspect-ratio: 640 / 850;isolation:isolate}
.hero-rotator .hero-frame{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;opacity:0;transition:opacity 1.2s ease;pointer-events:none}
.hero-rotator .hero-frame.is-active{opacity:1}
.hero-dots{position:absolute;z-index:2;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:10px;padding:10px 14px;border-radius:30px;background:#ffffffdc}
.hero-dots button{width:11px;height:11px;border:0;border-radius:50%;background:#8caeac;cursor:pointer;padding:0}
.hero-dots button[aria-pressed=true]{background:#175f61;box-shadow:0 0 0 3px #cce5de}
.gallery .slide img{height:auto;max-height:510px;object-fit:contain}
.gallery .slide-controls{flex-wrap:wrap}
@media(max-width:760px){.hero-rotator{aspect-ratio:4/3}.hero-rotator .hero-frame{height:100%}}
@media(prefers-reduced-motion:reduce){.hero-rotator .hero-frame{transition:none}}

/* Startseite: sanfte Kamerafahrt durch drei Software-Screenshots. */
.hero-rotator{background:#eaf3f1}
.hero-rotator .hero-frame{object-fit:cover;object-position:100% 100%;transform:scale(1.035);transition:opacity 1.5s ease;will-change:transform,object-position}
.hero-rotator .hero-frame.is-active{animation:heroCameraPan 9s linear both}
@keyframes heroCameraPan{from{object-position:100% 100%;transform:scale(1.035)}to{object-position:0% 0%;transform:scale(1.035)}}
@media(prefers-reduced-motion:reduce){.hero-rotator .hero-frame.is-active{animation:none;object-position:center;transform:none}}

/* Korrektur: echte kontinuierliche Kamerafahrt über die großen Screenshots.
   Das Bild ist bewusst größer als das Sichtfenster; die komplette Überbreite
   wird während jedes Durchlaufs von rechts nach links abgefahren. */
.hero-rotator .hero-frame,
.hero-rotator .hero-frame.is-active{
  inset:auto;
  top:0;left:0;
  width:auto;height:115%;min-width:100%;max-width:none;
  object-fit:fill;object-position:center;
  transform:translate(0,0);
  animation:none;
  transition:opacity 1.5s ease;
}
.hero-rotator .hero-frame.is-active{
  animation:heroWindowTravel 12s linear both;
}
@keyframes heroWindowTravel{
  0%{left:0;top:0;transform:translate(0,0)}
  100%{left:100%;top:100%;transform:translate(-100%,-100%)}
}
@media(prefers-reduced-motion:reduce){
 .hero-rotator .hero-frame.is-active{animation:none;left:50%;top:50%;transform:translate(-50%,-50%)}
}

/* V3: kontinuierliche Bewegung auch beim sanften Kreuzüberblenden. */
.hero-rotator .hero-frame,.hero-rotator .hero-frame.is-active,.hero-rotator .hero-frame.is-exiting{
 transition:opacity 3s ease-in-out;
}
.hero-rotator .hero-frame.is-active{z-index:2;opacity:1;animation:heroWindowTravel 18s linear both}
.hero-rotator .hero-frame.is-exiting{z-index:1;opacity:0;animation:heroWindowTravel 18s linear both}
.hero-rotator .hero-frame:not(.is-active):not(.is-exiting){z-index:0;opacity:0}
.gallery-paging{display:flex;align-items:center;justify-content:center;gap:18px;margin:20px 0 5px;flex-wrap:wrap}
.gallery-paging button{border:1px solid var(--teal);background:var(--teal);color:white;border-radius:9px;padding:11px 23px;font-weight:700;cursor:pointer;min-width:130px}
.gallery-paging button:hover{background:#1b6060}
.gallery-paging button:focus-visible{outline:3px solid #d49129;outline-offset:3px}
.gallery-paging .gallery-status{margin:0!important;min-width:105px;font-size:14px;font-weight:700;color:var(--ink)}
@media(max-width:500px){.gallery-paging{gap:8px}.gallery-paging button{min-width:105px;padding:10px}.gallery-paging .gallery-status{order:3;flex-basis:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){.hero-rotator .hero-frame.is-active{animation:none;transition:none}}