@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#082f63;--blue:#0d4e91;--cyan:#27a9c5;--ink:#10243c;--muted:#66768a;--pale:#eff7fa;--white:#fff;--line:#dce7ee;--shadow:0 24px 70px rgba(7,39,78,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"DM Sans",Arial,sans-serif;color:var(--ink);background:#fff}a{color:inherit;text-decoration:none}.wrap{width:min(1160px,calc(100% - 48px));margin:auto}.topline{background:#06264f;color:#d6e8f3;font-size:12px;letter-spacing:.06em}.topline-inner{height:36px;display:flex;align-items:center;justify-content:space-between}.topline a{color:#fff}.header{height:86px;background:#fff;position:sticky;top:0;z-index:20;box-shadow:0 5px 24px rgba(4,35,69,.06)}.nav{height:100%;display:flex;align-items:center;justify-content:space-between}.brand img{width:78px;height:78px;object-fit:contain}.nav-links{display:flex;align-items:center;gap:34px;font-size:13px;font-weight:700;color:#24415e}.nav-links a:not(.nav-cta):hover,.footer a:hover{color:var(--cyan)}.nav-cta{background:var(--navy);color:#fff;padding:14px 19px;border-radius:4px}.nav-cta span,.btn span{margin-left:12px}.menu-toggle{display:none;background:none;border:0;font-size:25px;color:var(--navy)}
.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#f4f9fc 0%,#fff 55%,#eaf6fa 100%);padding:96px 0 25px}.hero:after{content:"";position:absolute;right:-180px;top:-250px;width:650px;height:650px;border:1px solid rgba(39,169,197,.22);border-radius:50%}.hero-glow{position:absolute;width:480px;height:480px;right:10%;top:4%;background:rgba(39,169,197,.08);filter:blur(60px);border-radius:50%}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:50px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#4f9bb4}.eyebrow i{display:block;width:27px;height:2px;background:var(--cyan)}.eyebrow.dark{color:#4f7898}h1,h2,h3,p{margin-top:0}h1,h2{font-family:Manrope,Arial,sans-serif;letter-spacing:-.055em;color:var(--navy)}h1{font-size:clamp(48px,5.7vw,76px);line-height:1.04;margin:25px 0 22px;font-weight:800}h1 em,h2 em{font-style:normal;color:var(--cyan)}.hero-lead{font-size:17px;line-height:1.8;color:#536b82;max-width:540px}.hero-actions{display:flex;gap:14px;align-items:center;margin-top:32px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:16px 21px;font-size:12px;font-weight:800;letter-spacing:.02em;border-radius:4px;transition:.2s}.btn-primary{background:var(--navy);color:#fff;box-shadow:0 10px 25px rgba(8,47,99,.17)}.btn-primary:hover{background:#0e5596;transform:translateY(-2px)}.btn-quiet{color:var(--navy)}.btn-outline{border:1px solid rgba(255,255,255,.5);color:#fff;margin-top:17px}.hero-proof{display:flex;align-items:center;gap:14px;margin-top:55px}.proof-mark{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#dff3f7;color:var(--navy);font:800 13px Manrope}.hero-proof p{margin:0;font-size:12px;line-height:1.55;color:#63778b}.hero-proof strong{color:var(--navy)}.hero-visual{height:470px;position:relative;display:flex;align-items:center;justify-content:center}.visual-orbit{position:absolute;border:1px solid rgba(39,169,197,.35);border-radius:50%;transform:rotate(-20deg)}.orbit-one{width:430px;height:320px}.orbit-two{width:510px;height:390px}.building-scene{position:relative;width:390px;height:340px;display:flex;align-items:flex-end;justify-content:center;gap:12px;padding-bottom:48px}.building{position:relative;display:flex;flex-wrap:wrap;align-content:flex-start;gap:10px 8px;padding:22px 13px;background:linear-gradient(150deg,#0b4d8d,#082e60);box-shadow:14px 18px 30px rgba(6,40,79,.2);transform:skewY(-5deg)}.building span{width:19px;height:27px;background:#9edce8;opacity:.9}.b1{height:205px;width:105px}.b2{height:275px;width:116px;background:linear-gradient(150deg,#2aabc1,#0878a3)}.b3{height:165px;width:90px}.ground{position:absolute;bottom:30px;width:390px;height:12px;background:var(--cyan);transform:skewY(-8deg);border-radius:100%}.visual-card{position:absolute;background:#fff;box-shadow:var(--shadow);padding:15px 18px;border-radius:5px;z-index:2}.card-top{top:40px;left:8px;font-size:9px;font-weight:800;letter-spacing:.15em;color:#52738d}.mini-dot{display:inline-block;width:7px;height:7px;background:#35b5c9;border-radius:50%;margin-right:7px}.card-bottom{bottom:40px;right:0;display:flex;flex-direction:column;gap:4px}.card-bottom b{font:800 16px Manrope;color:var(--navy);letter-spacing:.06em}.card-bottom span{font-size:10px;color:#8292a2}.spark{position:absolute;color:var(--cyan);font-size:30px}.spark-a{top:125px;right:30px}.spark-b{bottom:120px;left:12px;font-size:42px}.hero-bottom{display:flex;align-items:center;gap:18px;margin-top:55px;font-size:9px;letter-spacing:.22em;font-weight:800;color:#8295a8}.hero-bottom .line{height:1px;background:#cbdce5;flex:1;max-width:100px}
.section{padding:110px 0}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start}.intro h2,.section-head h2,.business-copy h2,.cta-grid h2{font-size:clamp(37px,4.3vw,54px);line-height:1.13;margin:22px 0 0}.intro-text{padding-top:34px;color:#65778a;font-size:15px;line-height:1.85}.text-link{display:inline-block;margin-top:14px;color:var(--navy);font-weight:800;font-size:12px;border-bottom:1px solid var(--cyan);padding-bottom:8px}.text-link span{color:var(--cyan);margin-left:10px}
.services{background:#f4f8fa}.section-head{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:48px}.section-head>p{max-width:360px;color:#6c7e90;font-size:14px;line-height:1.8;margin:0 0 5px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.service-card{background:#fff;padding:31px 29px 27px;min-height:280px;border:1px solid #e8eef2;position:relative;transition:.25s}.service-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.service-card.featured{background:var(--navy);color:#fff}.service-icon{font-size:27px;color:var(--cyan);margin-bottom:27px}.service-no{font-size:9px;letter-spacing:.16em;color:#7fa1b7;font-weight:800}.service-card h3{font:800 20px/1.25 Manrope;color:var(--navy);margin:13px 0}.service-card.featured h3{color:#fff}.service-card p{font-size:12px;line-height:1.8;color:#718296;margin-bottom:22px}.service-card.featured p{color:#c4d5e4}.service-card>a{font-size:11px;font-weight:800;color:var(--navy);position:absolute;bottom:25px}.service-card.featured>a{color:#fff}.service-card>a span{color:var(--cyan);margin-left:10px}
.business-band{background:linear-gradient(115deg,#062a58,#0a477e);color:#fff;overflow:hidden;padding:100px 0}.business-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px;align-items:center}.business-art{height:380px;position:relative;display:grid;place-items:center}.art-circle{position:absolute;width:330px;height:330px;border:1px solid rgba(88,202,220,.45);border-radius:50%;box-shadow:0 0 0 30px rgba(255,255,255,.025),0 0 0 65px rgba(255,255,255,.02)}.art-building{height:230px;width:245px;display:flex;gap:9px;align-items:end;justify-content:center;z-index:1}.art-building i{display:block;width:60px;background:linear-gradient(150deg,#36b6cb,#0b79a4);height:60%;position:relative}.art-building i:nth-child(2){height:90%}.art-building i:nth-child(3){height:75%}.art-building i:nth-child(4){height:100%;background:linear-gradient(150deg,#d8f5f8,#6cc9d9)}.art-building i:nth-child(5){height:70%}.art-building i:nth-child(6){height:84%}.art-building i:nth-child(7){height:55%}.art-building i:nth-child(8){height:68%}.art-building i:after{content:"";position:absolute;inset:12px 10px;background:repeating-linear-gradient(0deg,transparent 0 19px,rgba(255,255,255,.65) 20px 22px),repeating-linear-gradient(90deg,transparent 0 13px,rgba(255,255,255,.65) 14px 16px)}.art-stamp{position:absolute;bottom:12px;right:0;width:105px;height:105px;border-radius:50%;background:var(--cyan);display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 11px Manrope;color:var(--navy);transform:rotate(9deg);box-shadow:0 10px 25px rgba(0,0,0,.2)}.art-stamp span{text-align:center;font-size:12px;line-height:1.05;margin-top:4px}.business-copy .eyebrow{color:#79c8d6}.business-copy h2{color:#fff;margin-bottom:25px}.business-copy h2 em{color:#5cc7d6}.business-copy p{font-size:14px;line-height:1.9;color:#c4d5e4;max-width:580px}
.process{background:#fff}.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.step{padding:27px 24px 0 0;position:relative}.step:before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--cyan)}.step>span{font:800 12px Manrope;color:var(--cyan);letter-spacing:.1em}.step h3{font:800 19px Manrope;color:var(--navy);margin:18px 0 10px}.step p{font-size:12px;line-height:1.8;color:#758699;max-width:220px}
.cta-section{background:#f1f7fa;padding:100px 0}.cta-grid{display:grid;grid-template-columns:1fr .85fr;gap:100px;align-items:center}.cta-grid h2{margin:22px 0}.cta-grid>div>p{font-size:14px;line-height:1.85;color:#6a7c8e;max-width:490px}.contact-email{display:inline-block;margin-top:17px;font:800 19px Manrope;color:var(--navy);border-bottom:2px solid var(--cyan);padding-bottom:8px}.contact-email span{color:var(--cyan);margin-left:12px}.contact-form{background:#fff;padding:32px;box-shadow:var(--shadow);display:flex;flex-direction:column}.contact-form label{font-size:10px;font-weight:800;color:#37536d;margin:13px 0 7px}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #dce6ed;background:#fbfdfe;padding:13px 12px;font:13px "DM Sans",sans-serif;color:var(--ink);border-radius:2px;outline:none}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--cyan)}.contact-form textarea{resize:vertical}.submit-btn{border:0;margin-top:20px;cursor:pointer}.contact-form small{font-size:10px;line-height:1.6;color:#8a98a6;margin-top:12px}
.footer{background:#061f40;color:#c1d0df;padding:55px 0 0}.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1.2fr .8fr;gap:40px;padding-bottom:45px}.footer-brand img{width:115px;height:75px;object-fit:contain;background:#fff;border-radius:3px}.footer-brand p{font-size:11px;line-height:1.7;color:#92a9bd;margin-top:15px}.footer-top>div:not(:first-child){display:flex;flex-direction:column;gap:12px;font-size:11px}.footer-top b{font-size:11px;color:#fff;margin-bottom:5px}.footer-top a,.footer-top span{color:#a8bbcc}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:18px 0;display:flex;justify-content:space-between;font-size:10px;color:#8299ad}
@media(max-width:900px){.hero-grid{gap:15px}.hero-visual{transform:scale(.88);transform-origin:center}.business-grid{gap:45px}.cta-grid{gap:45px}.nav-links{gap:18px}.service-card{padding:25px 22px}}
@media(max-width:700px){.wrap{width:min(100% - 34px,560px)}.topline-inner{font-size:10px}.header{height:72px}.brand img{width:95px;height:62px}.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;padding:20px 24px 25px;box-shadow:0 15px 20px rgba(0,0,0,.08);flex-direction:column;align-items:stretch;gap:20px}.nav-links.open{display:flex}.nav-cta{text-align:center}.hero{padding:65px 0 20px}.hero-grid{grid-template-columns:1fr}.hero-copy{position:relative;z-index:2}.hero h1{font-size:48px}.hero-lead{font-size:15px}.hero-visual{height:340px;transform:scale(.78);margin:-5px -35px -20px}.hero-proof{margin-top:32px}.hero-bottom{margin-top:25px;gap:9px;font-size:8px}.section{padding:75px 0}.intro-grid,.business-grid,.cta-grid{grid-template-columns:1fr;gap:25px}.intro-text{padding-top:0}.section-head{display:block;margin-bottom:35px}.section-head>p{margin-top:20px}.service-grid{grid-template-columns:1fr}.service-card{min-height:245px}.business-band{padding:70px 0}.business-art{height:300px;transform:scale(.85);margin:-15px 0}.business-copy h2{font-size:39px}.steps{grid-template-columns:1fr 1fr;row-gap:30px}.step{padding-right:12px}.cta-section{padding:75px 0}.contact-form{padding:24px}.footer-top{grid-template-columns:1fr 1fr;gap:32px 20px}.footer-bottom{gap:12px;flex-direction:column}.card-top{left:30px}.card-bottom{right:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* KOENIGZCLEAN Marken-Video im Startseiten-Hero */
.hero-video-wrap{height:auto;min-height:0;aspect-ratio:592 / 496;max-width:590px;width:100%;margin-inline:auto;overflow:hidden;border-radius:18px;background:#071d35;box-shadow:0 24px 65px rgba(8,47,99,.18);border:1px solid rgba(39,169,197,.22)}
.hero-video{display:block;width:100%;height:100%;aspect-ratio:592 / 496;object-fit:contain;background:#071d35}
	.water-effect {
position: fixed;
inset: 0;
z-index: 999;
pointer-events: none;
overflow: hidden;
opacity: 0.45;
mix-blend-mode: screen;
}

.water-effect::before,
.water-effect::after {
content: "";
position: absolute;
top: -220px;
left: 0;
width: 100%;
height: calc(100% + 440px);
pointer-events: none;
background-repeat: repeat;
}

.water-effect::before {
background-image:
radial-gradient(ellipse 4px 9px at 30px 35px, rgba(255,255,255,.9), rgba(100,200,240,.5) 45%, transparent 75%),
radial-gradient(ellipse 5px 11px at 100px 120px, rgba(255,255,255,.8), rgba(100,200,240,.4) 50%, transparent 75%);
background-size: 160px 220px;
animation: drops-fall 7s linear infinite;
}

.water-effect::after {
background-image:
radial-gradient(ellipse 7px 13px at 60px 60px, rgba(255,255,255,.8), rgba(100,200,240,.4) 50%, transparent 75%),
radial-gradient(ellipse 3px 7px at 130px 150px, rgba(255,255,255,.9), rgba(100,200,240,.4) 50%, transparent 75%);
background-size: 230px 290px;
animation: drops-fall 11s linear infinite;
opacity: .7;
}

@keyframes drops-fall {
from { transform: translateY(0); }
to { transform: translateY(220px); }
}

@media (prefers-reduced-motion: reduce) {
.water-effect::before,
.water-effect::after {
animation: none;
}
}


@media(max-width:700px){.hero-video-wrap{height:auto;min-height:0;width:100%;max-width:100%;margin:8px auto 0;transform:none;border-radius:14px}.hero-video{width:100%;height:auto;aspect-ratio:592 / 496;object-fit:contain}}
	
	/* KOENIGZ CLEAN – CINEMATIC VIDEO BANNER */

.cinema-banner {
position: relative;
width: 100%;
height: clamp(130px, 20vw, 230px);
overflow: hidden;
background: #071d35;
margin: 0;
padding: 0;
line-height: 0;
}

.cinema-banner video {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
border: 0;
border-radius: 0;
}

@media (max-width: 700px) {
.cinema-banner {
height: 145px;
}
}
/* KOENIGZ CLEAN – PREISRECHNER */

.calculator-section {
padding: 80px 20px;
background: linear-gradient(135deg, #071d35, #0b3150);
color: #ffffff;
}

.calculator-section .section-head {
text-align: center;
margin-bottom: 35px;
}

.calculator-section h2 {
color: #ffffff;
font-size: clamp(28px, 4vw, 42px);
margin: 15px 0;
}

.calculator-section .eyebrow {
color: #35d6d0;
font-weight: 700;
letter-spacing: 2px;
}

.calculator-box {
max-width: 600px;
margin: auto;
padding: 35px;
background: #102e49;
border: 1px solid rgba(53, 214, 208, 0.35);
border-radius: 18px;
box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}

.calculator-box label {
display: block;
margin: 20px 0 8px;
color: #ffffff;
font-weight: 600;
}

.calculator-box input,
.calculator-box select {
width: 100%;
padding: 15px;
border: 1px solid #31536c;
border-radius: 9px;
background: #071d35;
color: #ffffff;
font-size: 16px;
}

.calculator-box button {
width: 100%;
margin-top: 25px;
padding: 16px;
border: 0;
border-radius: 9px;
background: #27c9c4;
color: #071d35;
font-weight: 700;
font-size: 16px;
cursor: pointer;
}

.calculator-box button:hover {
background: #55e5df;
}

#calc-result {
margin-top: 25px;
padding: 20px;
border-radius: 10px;
background: #071d35;
color: #35d6d0;
font-size: 22px;
text-align: center;
}

.calc-note {
color: #b8cbd8;
font-size: 12px;
line-height: 1.6;
margin-top: 18px;
}

@media (max-width: 600px) {
.calculator-box {
padding: 22px;
}

.calculator-section {
padding: 55px 15px;
}
}
/* CASEY CHAT ASSISTENT */

#casey-chat {
position: fixed;
right: 25px;
bottom: 25px;
z-index: 99999;
font-family: Arial, sans-serif;
}

#casey-toggle {
display: block;
background: linear-gradient(135deg, #00d9e8, #0874e8);
color: white;
border: 2px solid white;
border-radius: 50px;
padding: 18px 28px;
font-size: 19px;
font-weight: bold;
cursor: pointer;
box-shadow: 0 5px 25px rgba(0,0,0,0.4);
}

#casey-window {
position: absolute;
right: 0;
bottom: 75px;
width: 340px;
max-width: calc(100vw - 30px);
height: 420px;
background: #071d35;
border: 2px solid #00d9e8;
border-radius: 18px;
overflow: hidden;
box-shadow: 0 8px 30px rgba(0,0,0,0.5);
color: white;
}

#casey-window[hidden] {
display: none;
}

.casey-header {
background: #0874e8;
padding: 18px;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 18px;
}

#casey-close {
background: transparent;
color: white;
border: 0;
font-size: 25px;
cursor: pointer;
}

#casey-messages {
height: 285px;
padding: 15px;
overflow-y: auto;
}

.casey-input {
display: flex;
padding: 10px;
gap: 8px;
}

#casey-input {
flex: 1;
min-width: 0;
padding: 12px;
border-radius: 8px;
border: 1px solid #00d9e8;
}

#casey-send {
background: #00d9e8;
color: #071d35;
border: 0;
border-radius: 8px;
padding: 12px;
font-weight: bold;
cursor: pointer;
}

@media (max-width: 600px) {
#casey-chat {
right: 12px;
bottom: 15px;
}
}