/* Generated by tools/bundle-css.py: edit the sources, then re-run it. */
/* styles.css */
*{box-sizing:border-box}html{scroll-behavior:smooth}html.dialog-open{overflow:hidden;scrollbar-gutter:stable;background:#778a96}body{margin:0;font-family:'Avenir Next',Avenir,'Helvetica Neue',sans-serif;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}body.cloud{--paper:#f4f8fa;--ink:#132b3a;--hero:#dceef8;--accent:#35667f;--soft:#e9f2f7}body.work{--paper:#f7f8fa;--ink:#20262d;--hero:#f7f8fa;--accent:#2457d6;--soft:#e4ebf8}body.horizon{--paper:#edf5f8;--ink:#163e48;--hero:#edf5f8;--accent:#163e48;--soft:#dbe9ec}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{color:inherit}::selection{background:#f2d566;color:#132b3a}h1,h2,h3,p{margin:0}h1,h2{font-weight:500;letter-spacing:-.03em;line-height:1.02}h1{font-size:clamp(54px,6.7vw,112px)}h2{font-size:clamp(38px,4.3vw,68px)}h3{font-size:26px;letter-spacing:-.02em;font-weight:550}p{line-height:1.6}svg{display:block}.nowrap{white-space:nowrap}.hero .intro{text-wrap:pretty}.wrap{width:min(100%,1616px);padding-inline:clamp(24px,5vw,88px);margin-inline:auto}.skip{position:absolute;z-index:50;left:20px;top:-100px;padding:16px;background:white}.skip:focus{top:12px}.preview-bar{font-size:12px;padding:9px 24px;text-align:center;background:var(--ink);color:white}.preview-bar a{text-decoration:underline;text-underline-offset:3px}.header{height:96px;display:flex;align-items:center;justify-content:space-between;gap:32px;background:var(--hero)}.brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:650;letter-spacing:-.06em;line-height:.98;flex-shrink:0}.brand svg{width:40px;height:40px}.brand b{font-weight:650}.nav{display:flex;align-items:center;gap:36px;font-size:15px}.nav a{min-height:44px;display:flex;align-items:center}.nav a:hover{opacity:.65}.nav .nav-contact{border-bottom:1px solid currentColor}.hero-stage{height:175svh;background:var(--hero)}.hero{position:sticky;top:0;min-height:100svh;display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:30px;padding-top:36px;padding-bottom:64px;overflow:hidden}.hero-text{position:relative;z-index:2}.locale{font-size:14px;display:flex;align-items:center;gap:10px;margin-bottom:28px}.locale:before{content:'';width:9px;height:9px;border-radius:50%;background:var(--accent)}.intro{font-size:clamp(18px,1.5vw,21px);max-width:440px;margin-top:30px;line-height:1.55}.actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:32px}.button{display:inline-flex;justify-content:center;align-items:center;gap:24px;min-height:54px;padding:15px 25px;border-radius:999px;background:var(--ink);color:white;border:1px solid var(--ink);font-size:15px;font-weight:550;transition:background .2s,transform .2s}.button:hover{background:var(--accent);transform:translateY(-2px)}.button svg{width:20px;height:20px}.text-link{font-size:14px;border-bottom:1px solid currentColor;min-height:44px;display:inline-flex;align-items:center}.hero-credit{font-size:12px;margin-top:48px;line-height:1.7;max-width:400px}.hero-credit strong{font-weight:600}.art{height:480px;position:relative;isolation:isolate;--p:0}.art-label{position:absolute;left:0;right:0;bottom:4px;text-align:center;font-size:12px;letter-spacing:.015em}.art-label .end{display:none}.art[data-finished=true] .art-label .start{display:none}.art[data-finished=true] .art-label .end{display:inline}.piece{position:absolute;left:50%;top:46%;will-change:transform,border-radius,width,height}.cloud .piece{background:radial-gradient(circle at 35% 20%,#ffffff 0,#eaf6fc 25%,#b4d9ec 66%,#78acc9 100%);box-shadow:inset -8px -10px 22px #669cb626,8px 28px 45px #618ba520}.cloud .piece:nth-child(1){z-index:1}.cloud .piece:nth-child(2){z-index:2}.cloud .piece:nth-child(3){z-index:4}.cloud .piece:nth-child(4){z-index:3}.art-line{position:absolute;left:12%;right:12%;top:46%;height:2px;background:var(--accent);opacity:var(--p);z-index:-1}.cloud .art:before{content:'';position:absolute;border:1px solid #729db64d;border-radius:50%;inset:12px 8%;transform:rotate(-18deg);z-index:-1}.cloud .art:after{content:'';position:absolute;inset:15% 0 19%;border-top:1px solid #729db64d;border-bottom:1px solid #729db64d;border-radius:50%;transform:rotate(30deg);z-index:-1}.scroll-note{position:absolute;bottom:20px;left:clamp(24px,5vw,88px);font-size:12px;display:flex;align-items:center;gap:12px}.scroll-note:before{content:'';width:24px;height:1px;background:currentColor}.section{padding-top:96px;padding-bottom:96px}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:56px}.section-head p{max-width:370px;font-size:18px}.eyeline{font-size:14px;margin-bottom:24px}.services{background:white}.service-row{border-top:1px solid #132b3a30}.service-row:last-child{border-bottom:1px solid #132b3a30}.service-row summary{list-style:none;min-height:116px;display:grid;grid-template-columns:1fr 1fr 40px;align-items:center;gap:24px;padding-block:24px;cursor:pointer}.service-row summary::-webkit-details-marker{display:none}.service-row summary p{font-size:16px;max-width:420px}.service-row .plus{font-size:30px;text-align:right;font-weight:400;transition:transform .2s}.service-row[open] .plus{transform:rotate(45deg)}.service-detail{padding:0 64px 30px 50%;font-size:16px;max-width:1100px}.service-row summary:hover h3{color:var(--accent)}.proof{overflow:hidden;padding:52px 0;background:var(--paper)}.proof-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;margin-bottom:30px;font-size:14px}.pause{display:flex;align-items:center;justify-content:center;gap:9px;min-width:44px;min-height:44px;padding:10px 18px 10px 16px;border:1px solid #0b1f3b40;border-radius:999px;background:transparent;color:var(--ink);font-size:14px;line-height:1.2}.pause:before{content:"";flex:0 0 auto;width:8px;height:10px;border-inline:3px solid currentColor}.proof.paused .pause:before{width:9px;border:0;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}.pause:hover{background:#fff;border-color:#0b1f3b80}.proof-head .pause{flex:0 0 auto}.marquee{overflow:hidden}.track{display:flex;width:max-content;animation:flow 38s linear infinite}.track-group{display:flex;gap:64px;padding:0 32px;align-items:center}.logo-item{width:170px;min-height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.logo-item img{width:132px;height:48px;object-fit:contain;filter:grayscale(1);mix-blend-mode:multiply}.logo-item strong{height:48px;display:flex;align-items:center;font-size:34px;letter-spacing:-.05em;font-weight:600}.logo-item small{font-size:11px;line-height:1.4;text-align:center}.marquee:hover .track,.marquee:focus-within .track,.proof.paused .track,html.dialog-open .track{animation-play-state:paused}.proof:focus-within:not(:has(.pause:focus)) .track{animation-play-state:paused}@keyframes flow{to{transform:translateX(-50%)}}.proof-foot{font-size:12px;margin-top:25px;line-height:1.6;max-width:780px}.team{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}.team h2{max-width:650px}.team-intro{max-width:460px;font-size:19px;margin-top:28px}.partner{padding:25px 0;border-bottom:1px solid #132b3a30}.partner:first-child{padding-top:0}.partner p{margin-top:12px;font-size:16px;max-width:440px}.partner a{display:inline-block;margin-top:14px;font-size:13px;text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}.partner p a{display:inline;margin-top:0;font-size:inherit}.contact{background:var(--ink);color:white}.contact-inner{display:flex;align-items:flex-end;justify-content:space-between;gap:48px}.contact h2{max-width:700px}.contact p{margin-top:26px;font-size:18px;max-width:500px}.contact .button{background:white;color:var(--ink);border-color:white;flex-shrink:0}.contact .button:hover{background:var(--hero)}.footer{padding-block:32px;display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;font-size:12px}.footer-links{display:flex;flex-wrap:wrap;gap:0 24px}.footer-links button{background:none;border:0;padding:0;min-height:44px;font-size:12px;text-decoration:underline}.footer>p{display:flex;align-items:center}dialog{--dialog-pad:40px;overscroll-behavior:contain;border:0;border-radius:16px;padding:var(--dialog-pad);width:min(520px,calc(100% - 32px));color:var(--ink);background:white;box-shadow:0 20px 100px #0003}dialog::backdrop{background:#132b3a88;backdrop-filter:blur(5px)}dialog h2{font-size:36px;letter-spacing:-.03em;margin:20px 0}dialog p,dialog .dialog-copy{font-size:17px}dialog .dialog-copy{line-height:1.6}#dialog-title:focus{outline:none}.booking-notice{flex:1 1 100%;font-size:14px;line-height:1.5;color:#4a5d75}dialog .close{display:block;margin-left:auto;border:1px solid #132b3a50;background:none;border-radius:50%;width:44px;height:44px;font-size:25px}.work .hero{grid-template-columns:1.1fr 1fr;gap:72px}.work h1{font-size:clamp(54px,6.4vw,105px)}.work .art{background-image:linear-gradient(#2457d60c 1px,transparent 1px),linear-gradient(90deg,#2457d60c 1px,transparent 1px);background-size:32px 32px;border:1px solid #2457d630;height:520px}.work .piece{border:2px solid var(--accent);background:#2457d608;box-shadow:12px 12px 0 #2457d60a}.work .art:after{content:'ki';font-weight:500;letter-spacing:-.08em;font-size:90px;position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);color:var(--accent);opacity:calc(1 - var(--p))}.work .button{border-radius:4px;background:var(--accent);border-color:var(--accent)}.work .service-list{display:grid;grid-template-columns:1fr 1fr;gap:0 64px}.work .service-row summary{grid-template-columns:1fr 35px;min-height:180px}.work .service-row summary h3{grid-column:1}.work .service-row summary p{grid-column:1;grid-row:2}.work .service-row .plus{grid-column:2;grid-row:1}.work .service-detail{padding:0 30px 30px 0}.work .service-row:last-child{border-bottom:0}.work .services{background:var(--soft)}.work .contact .button{background:white;color:var(--ink)}.horizon .hero{display:flex;flex-direction:column;justify-content:center;text-align:center;gap:0;padding-top:32px;padding-bottom:42px}.horizon .hero-text{display:flex;flex-direction:column;align-items:center}.horizon h1{font-size:clamp(54px,6.8vw,112px);max-width:1050px}.horizon .locale{justify-content:center;margin-bottom:20px}.horizon .intro{max-width:570px;font-size:18px;margin-top:24px}.horizon .actions{justify-content:center;margin-top:24px}.horizon .hero-credit{margin-top:22px;font-size:12px}.horizon .art{height:240px;width:min(840px,100%);margin-top:20px}.horizon .piece{background:linear-gradient(135deg,#fff,#c4dde4);box-shadow:6px 18px 25px #163e4810}.horizon .art:before{content:'';width:130px;height:130px;background:#f2d566;border-radius:50%;position:absolute;left:50%;top:24%;transform:translate(-50%,-50%);z-index:-1}.horizon .art-label{bottom:0}.horizon .art-line{background:var(--ink);top:54%}.horizon .piece{top:54%}.workshop-feature{background:#f2d566;color:#163e48;display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}.workshop-feature p{font-size:19px;max-width:520px}.workshop-feature .text-link{margin-top:22px}.horizon .contact{background:#163e48}.chooser{--ink:#132b3a;--paper:#f4f8fa;--accent:#35667f;background:var(--paper)}.choose-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:34px}.choose-header>span{font-size:12px}.choose-intro{padding:55px 0 44px}.choose-intro h1{font-size:clamp(48px,5.5vw,84px);max-width:1000px}.choose-intro p{font-size:19px;max-width:600px;margin-top:26px}.concepts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding-bottom:52px}.concept{display:block;min-width:0}.mini{height:300px;position:relative;overflow:hidden;background:var(--mini);padding:26px;border-radius:12px;isolation:isolate;transition:transform .25s}.concept:hover .mini{transform:translateY(-5px)}.mini .mini-brand{font-size:10px;font-weight:650}.mini h2{font-size:37px;max-width:200px;line-height:1.02;margin-top:44px;position:relative;z-index:2}.mini-shape{position:absolute;width:145px;height:145px;right:-14px;bottom:18px;background:linear-gradient(135deg,white,#86b8d2);border-radius:50%;box-shadow:-52px 12px 0 -9px #d6eaf5,-23px -39px 0 -18px white}.mini-work .mini-shape{border:2px solid #2457d6;border-radius:0;background:transparent;box-shadow:12px 12px 0 #2457d618;transform:rotate(-20deg);right:30px;width:120px;height:120px}.mini-horizon h2{max-width:100%;text-align:center;margin-top:40px}.mini-horizon .mini-shape{width:75px;height:75px;background:#f2d566;box-shadow:-52px 43px 0 5px white,42px 46px 0 14px #d2e5eb;left:calc(50% - 38px);bottom:35px}.concept-meta{padding-top:22px}.concept-meta h2{font-size:27px;letter-spacing:-.04em}.concept-meta p{font-size:15px;margin-top:12px;max-width:360px}.concept-meta span{display:inline-block;font-size:13px;margin-top:20px;text-decoration:underline;text-underline-offset:4px}.choice-notes{border-top:1px solid #132b3a30;padding:30px 0 45px;font-size:13px;line-height:1.7;max-width:1050px}.choice-notes strong{font-weight:600}
@media(min-width:1900px){.hero{min-height:850px;max-height:1050px}.hero-stage{height:1500px}.art{max-width:650px}.horizon .hero{min-height:1000px}.horizon .hero-stage{height:1800px}}
@media(max-width:850px){.header{height:80px}.nav{gap:24px}.nav a:not(.nav-contact){display:none}.hero,.work .hero{grid-template-columns:1fr;align-content:start;gap:10px;min-height:100svh;padding-top:28px;padding-bottom:34px}.hero-stage{height:185svh}.hero h1{font-size:clamp(49px,8.8vw,78px);max-width:700px}.locale{margin-bottom:20px}.intro{margin-top:20px;font-size:18px;max-width:510px}.actions{margin-top:24px;gap:20px}.hero-credit{margin-top:20px;font-size:11px}.art,.work .art{height:290px;max-width:510px;width:100%;margin-inline:auto}.work .art{height:280px}.scroll-note{display:none}.section{padding-block:64px}.section-head{display:block;margin-bottom:35px}.section-head p{margin-top:24px;max-width:500px}.service-row summary{grid-template-columns:1fr 30px;gap:12px;min-height:140px}.service-row summary h3{grid-column:1}.service-row summary p{grid-column:1;grid-row:2}.service-row .plus{grid-column:2;grid-row:1}.service-detail{padding:0 24px 24px 0}.team,.workshop-feature{grid-template-columns:1fr;gap:40px}.contact-inner{display:block}.contact .button{margin-top:30px}.work .service-list{gap:0 32px}.horizon .hero{padding-top:30px;justify-content:flex-start}.horizon h1{font-size:clamp(52px,8vw,78px)}.horizon .art{height:200px;margin-top:16px}.horizon .intro{font-size:17px}.horizon .art:before{width:90px;height:90px}.concepts{grid-template-columns:1fr;gap:42px}.mini{height:330px}.mini h2{font-size:50px;max-width:290px}.mini-shape{right:35px}.choose-intro{padding-top:30px}.choose-intro h1{font-size:54px}.concept-meta p{max-width:600px}.choose-header>span{max-width:120px;text-align:right}.mini-horizon h2{max-width:100%}}
@media(max-width:480px){.brand{font-size:17px;gap:8px}.brand svg{width:32px;height:32px}.header{gap:12px}.nav{font-size:12px;gap:0}.header .nav-contact{font-size:12px}.hero h1,.work h1{font-size:clamp(40px,12vw,58px)}.locale{font-size:12px;margin-bottom:20px}.intro{font-size:17px}.hero-credit{font-size:10px;line-height:1.5}.button{font-size:13px;gap:16px;padding:13px 20px;min-height:50px}.text-link{font-size:13px}.art,.work .art{height:225px}.hero{gap:0}.cloud .art:before{inset:0 13%}.hero-stage{height:175svh}.horizon .hero h1{font-size:49px}.horizon .art{height:170px}.horizon .hero-credit{font-size:10px}.horizon .intro{font-size:16px}.section-head p,.team-intro{font-size:17px}.service-row summary p{font-size:15px}.service-row h3{font-size:24px}.work .service-list{grid-template-columns:1fr}.work .service-row summary{min-height:150px}.proof{padding-block:34px}.track-group{gap:25px;padding-inline:12.5px}.logo-item{width:140px}.logo-item img{width:112px;height:42px}.logo-item small{font-size:10px}.proof-head{font-size:12px}.proof-foot{font-size:11px}.footer{gap:10px}.footer-links{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:0 32px}.footer-links a{overflow-wrap:anywhere}.preview-bar{font-size:10px}.choose-header{padding-top:26px}.choose-intro h1{font-size:46px}.mini{height:300px}.mini h2{font-size:43px;max-width:245px}.mini-shape{right:0}.mini-horizon .mini-shape{right:auto}.mini-horizon h2{max-width:100%}dialog{--dialog-pad:24px}dialog h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.hero-stage{height:auto}.hero{position:relative;min-height:0;padding-block:48px}.track{transform:none!important;display:block;width:auto}.marquee{overflow:visible}.track-group{--max:7;display:grid;grid-template-columns:repeat(auto-fill,minmax(max(112px,calc((100% - (var(--max) - 1)*16px)/var(--max))),1fr));gap:12px 16px;width:min(100%,1616px);margin-inline:auto;padding-inline:clamp(24px,5vw,88px)}.track-group:has(>.logo-item:nth-child(8):last-child){--max:4}.track-group:has(>.logo-item:nth-child(9):last-child),.track-group:has(>.logo-item:nth-child(10):last-child){--max:5}.track-group:has(>.logo-item:nth-child(11):last-child),.track-group:has(>.logo-item:nth-child(12):last-child){--max:6}.track-group .logo-item{width:auto}.track-group .logo-item img{width:min(132px,100%)}.track-group[aria-hidden="true"]{display:none}.proof .pause{display:none}.piece{will-change:auto}}@media(prefers-reduced-motion:reduce) and (max-width:415px){.track-group>.logo-item:last-child:nth-child(odd){grid-column:1/-1}}
/* Full-bleed workshop colour; consistent readable gutters in both columns. */
.workshop-feature{padding-inline:clamp(24px,5vw,88px)}.workshop-feature>.wrap{padding-inline:0!important}
/* D-06: Inter's serifed capital I (cv08) on headings, the locale line and .ki spans, so "KI" never reads as "Kl"; the H1's KI gets a little air between K and I. Heading tracking is -.03em (brand-system.css). */
.cloud :is(h1,h2,h3,.locale,.ki){font-feature-settings:"cv08"}.cloud h1 .ki{letter-spacing:.035em;margin-right:-.045em}
/* T-12: the pinned hero fits the screen under the header; site.js reports --header-h and --hero-h. Pinned, the hero is centred, or bottom-aligned when taller than the screen so the art and caption stay in view. */
@media(prefers-reduced-motion:no-preference){.cloud.refined .hero{min-height:calc(100svh - var(--header-h,116px));top:var(--hero-top,min(calc((100svh - var(--hero-h,100svh))/2),calc(100svh - var(--hero-h,100svh))))}}
@media(prefers-reduced-motion:no-preference) and (max-width:600px){.cloud.refined .hero{min-height:calc(100svh - var(--header-h,96px))}}
/* T-12: on short phones, tighter hero spacing so more of the cloud shows on the first screen. */
@media(max-width:480px) and (max-height:700px){.cloud.refined .hero{padding-top:16px}.cloud .hero .locale{margin-bottom:12px}.cloud .hero .intro{margin-top:14px}.cloud .hero .actions{margin-top:18px;row-gap:6px}}

dialog h2{overflow-wrap:break-word;hyphens:auto}@media(max-width:360px){dialog h2{font-size:26px}}

/* P2 D-17: the header contact item opens the booking dialog, styled as a quiet outlined button rather than an underlined "active" link. */
.nav .nav-contact{border:1px solid currentColor;border-radius:999px;padding:0 18px;min-height:40px;font-size:14px;white-space:nowrap}
.nav .nav-contact:hover{opacity:1;background:#0b1f3b;color:#fff;border-color:#0b1f3b}
/* P2 D-20: the contact button sits under its text instead of at the far right. */
.contact-inner{display:block}
.contact-inner .button{margin-top:32px}
/* Footer legal links are real links now (/impressum, /datenschutz) that open the dialogs when JS runs. */
.footer-links a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:underline;text-underline-offset:.18em}
/* Small phones: logo and contact pill share one row without overflowing. */
@media(max-width:380px){.nav .nav-contact{padding:0 12px;font-size:13px}}@media(max-width:340px){.cloud .header .brand-lockup{width:130px}}
/* Header menu (plan 2026-10-31-dke-site-improvements, W3.4 d; owner 2 Nov 2026): from 937px the five items as before;
   at 851-936px KI-Beratung and KI im Bau stay in the bar and Was wir tun and Wer wir sind go under the hamburger; up to
   850px all four text links are in it. A native <details>, so it opens without JavaScript; site.js closes it. The panel's
   link rule ties the phone rule that hides `.nav a` on specificity and comes after it, so its links show at every width. */
.nav-menu{display:none}
.nav-menu>summary{list-style:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #132b3a40;border-radius:999px;cursor:pointer}
.nav-menu>summary::-webkit-details-marker{display:none}
.nav-menu>summary svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.nav-menu[open]>summary{background:#fff;border-color:#132b3a80}
@media(hover:hover){.nav-menu>summary:hover{background:#fff;border-color:#132b3a80}}
.nav-menu-panel{position:absolute;z-index:40;right:clamp(24px,5vw,88px);top:calc(100% - 8px);width:min(260px,calc(100vw - 48px));display:flex;flex-direction:column;padding:6px 0;background:#fff;border-radius:12px;box-shadow:0 16px 48px #0b1f3b29}
.nav .nav-menu-panel a{display:flex;align-items:center;min-height:48px;padding:0 20px;font-size:16px}
.nav .nav-menu-panel a+a{border-top:1px solid #132b3a1a}
.nav .nav-menu-panel a:hover{opacity:1;background:#eaf6ff}
@media(max-width:936px){.header{position:relative}.nav>.nav-extra{display:none}.nav-menu{display:block}}
@media(min-width:851px) and (max-width:936px){.nav .nav-menu-panel a.nav-key{display:none}}
/* Phones: the hamburger costs 50px, so the pill takes its small size up to 420px and the gaps narrow, keeping the logo
   as large as the row allows (172px from 390px). */
@media(max-width:480px){.nav .nav-menu{margin-right:6px}}
@media(min-width:361px) and (max-width:480px){body.cloud .header{gap:12px}}
@media(max-width:420px){.nav .nav-contact{padding:0 12px;font-size:13px}}

/* cloud-refinements.css */
/* Wolkenwerk refinement layer: same brand, three sculptural materials. */
.cloud.refined .art{height:510px;overflow:visible;isolation:isolate}.cloud.refined .art:before,.cloud.refined .art:after{display:none}.cloud-sculpture{width:100%;height:100%;overflow:visible}.cloud.refined .art-label{bottom:0;line-height:1.5;color:#35667f}.cloud.refined .art-label .start,.cloud.refined .art-label .end{display:none}.sculpture-shadow{opacity:calc(.25 - var(--p,0)*.18)}.workflow-lines{opacity:var(--reveal,0)}.workflow-labels{opacity:var(--reveal,0);fill:#132b3a;font-family:'Avenir Next',Avenir,sans-serif;font-size:13px;text-anchor:middle;letter-spacing:0}.cloud-switch{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;padding:16px 24px;background:#dceef8;border-top:1px solid #35667f25;font-size:12px}.cloud-switch a{padding:11px 15px;min-height:44px;border:1px solid #35667f40;border-radius:999px;display:flex;align-items:center}.cloud-switch a[aria-current=page]{background:#132b3a;color:white;border-color:#132b3a}.cloud-switch a:hover{background:#ffffff80}.cloud-switch a[aria-current=page]:hover{background:#35667f}.cloud-switch .back{border:0;text-decoration:underline}.refined .hero-stage{height:190svh}.refined .scroll-note{bottom:24px}.refined .art .sculpture-caption{position:absolute;bottom:8px;left:0;right:0;text-align:center;color:#35667f;font-size:12px}.cloud-gallery{--ink:#132b3a;--paper:#f4f8fa;--accent:#35667f;color:var(--ink);background:var(--paper)}.cloud-gallery .choose-intro{padding-bottom:30px}.cloud-gallery .choose-intro p{max-width:720px}.cloud-gallery .concepts{gap:24px}.cloud-gallery .cloud-card-art{background:#dceef8;border-radius:14px;overflow:hidden;height:300px;position:relative}.cloud-gallery .cloud-card-art .art{height:300px;width:100%;margin:0}.cloud-gallery .cloud-card-art .art:before,.cloud-gallery .cloud-card-art .art:after{display:none}.cloud-gallery .sculpture-caption{display:none}.cloud-gallery .concept-meta .tag{font-size:11px;text-decoration:none;background:#dceef8;padding:5px 9px;border-radius:999px;margin:0 0 12px}.cloud-gallery .concept-meta h2{font-size:30px}.cloud-gallery .concept-meta p{max-width:100%;font-size:15px}.cloud-gallery .baseline-link{display:inline-flex;min-height:44px;align-items:center;font-size:13px;text-decoration:underline;text-underline-offset:4px}.refined .hero-text{z-index:3}
@media(max-width:850px){.cloud.refined .art{height:290px;max-width:510px}.cloud.refined .hero{gap:14px}.cloud-gallery .concepts{grid-template-columns:1fr}.cloud-gallery .cloud-card-art{height:330px}.cloud-gallery .cloud-card-art .art{height:330px}.refined .hero-stage{height:130svh}}
@media(max-width:480px){.cloud.refined .art{height:240px}.cloud.refined .hero{gap:12px}.cloud.refined .hero-credit{margin-top:16px}.cloud.refined .art .sculpture-caption{font-size:10px;bottom:0}.cloud-switch{padding:12px 16px;gap:6px}.cloud-switch a{font-size:11px;padding:10px 12px}.cloud-gallery .choose-intro h1{font-size:43px}.cloud-gallery .cloud-card-art{height:280px}.cloud-gallery .cloud-card-art .art{height:280px}.refined .hero-stage{height:125svh}}
@media(prefers-reduced-motion:reduce){.refined .hero-stage{height:auto}.refined .hero{position:relative}}

/* T-13: no scroll pin at any width. The stage collapses to the hero's own
   height and the hero scrolls natively; scroll-hold.js plays the one-shot
   morph on its own clock once the art is on screen, so a pin buys nothing
   and only froze the view mid-scroll (D-09). */
.cloud.refined .hero-stage{height:auto}.cloud.refined .hero{position:relative;top:auto}
@media(max-width:850px){.cloud.refined .hero{position:static;min-height:100svh}}

/* Selected Cumulus: caption-free references, steady pace for the longer strip. */
body:has([data-sculpture="cumulus"]) .proof .track{animation-duration:65s}body:has([data-sculpture="cumulus"]) .proof .logo-item{justify-content:center}body:has([data-sculpture="cumulus"]) .proof-foot{max-width:960px;line-height:1.7}body:has([data-sculpture="cumulus"]) .proof img{mix-blend-mode:multiply}

/* Official key.fit artwork has white lettering; use the strip’s monochrome ink. */
.cloud.refined .proof .keyfit-logo{filter:brightness(0);opacity:.68}

body:has([data-sculpture="cumulus"]) .international .track{animation-duration:85s;animation-direction:reverse}.international{margin-top:12px}

.cloud.refined .proof img[src^="assets/solarkit.png"]{filter:brightness(0);opacity:.68}

.refined .partner-logo{height:96px;display:flex;align-items:center;margin-bottom:20px}.refined .partner-logo img{display:block;max-width:100%;object-fit:contain;object-position:left center}

/* The logo moves below the name only when the two cannot share the row (text spacing at 320 px); a name never breaks
   inside a word. */
.refined .partner-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}.refined .partner-heading h3{margin:0;flex:1 1 0;min-width:min-content}.refined .partner-heading .partner-logo{height:64px;margin:0;flex:0 0 160px;justify-content:flex-end}.refined .partner-heading .partner-logo img{max-width:160px;max-height:64px;width:auto;height:auto}.refined .partner-heading .partner-logo img[src^="assets/aberger.svg"]{width:85px}@media(max-width:480px){.refined .partner-heading{gap:12px}.refined .partner-heading h3{font-size:22px}.refined .partner-heading .partner-logo{flex-basis:112px;height:56px}.refined .partner-heading .partner-logo img{max-width:112px;max-height:56px}.refined .partner-heading .partner-logo img[src^="assets/aberger.svg"]{width:74px}}

/* Owner refinement: company logos 20% larger without adding row height. */
.refined .partner-heading .partner-logo img{transform:scale(1.2);transform-origin:right center}

.refined .company-address{font-style:normal;font-size:12px;line-height:1.8}.refined .company-address a{text-decoration:underline;text-underline-offset:3px}

/* Paint the header edge to edge while preserving the shared content alignment. */
.cloud.refined .header.wrap{width:100%;padding-inline:max(clamp(24px,5vw,88px),calc((100% - 1616px)/2 + clamp(24px,5vw,88px)))}

/* cumulus-loop2.css */
/* Fable loop 2: one continuous cloud surface, restrained internal volume. */
.cloud-modelling{opacity:clamp(0,(.62 - var(--p,0))/.38,1)}
.cloud-rim{opacity:clamp(0,.9 - var(--p,0)*1.3,.9)}
.sculpture-shadow-core{opacity:calc(.16 - var(--p,0)*.13)}

.module-fill{opacity:var(--reveal,0)}
.cloud-bloom{opacity:calc(.55*(1 - var(--reveal,0)))}
/* Logo morph: the row settles smaller so four modules breathe inside the column. */
body.cloud.refined .art[data-sculpture=cumulus] .cloud-sculpture{transform:scale(calc(1.38 - var(--p,0)*.12))}
@media(max-width:850px){body.cloud.refined .art[data-sculpture=cumulus] .cloud-sculpture{transform:scale(calc(1.3 - var(--p,0)*.08))}}
@media(max-width:480px){body.cloud.refined .art[data-sculpture=cumulus] .cloud-sculpture{transform:scale(1.22)}}
.art .workflow-lines{opacity:clamp(0,var(--draw,var(--reveal,0))*6,1)}
.cloud .art .workflow-labels{opacity:var(--lbl,var(--reveal,0));font-size:13px;font-weight:500;letter-spacing:.01em}
@media(max-width:600px){.cloud .art .workflow-labels{font-size:19px}}
.cloud .art .sculpture-caption .caption-first{opacity:clamp(0,1 - var(--caption-blend,0)*2.2,1);transform:translateY(calc(var(--caption-blend,0)*-14px))}
.cloud .art .sculpture-caption .caption-second{opacity:clamp(0,var(--caption-blend,0)*2.2 - 1.2,1);transform:translateY(calc((1 - var(--caption-blend,0))*14px))}
@media(prefers-reduced-motion:reduce){.cloud .art .sculpture-caption .caption-first,.cloud .art .sculpture-caption .caption-second{transform:none}}
/* After its first play the art replays the morph on tap: a hand cursor on fine pointers only, no tap flash or selection. */
.art.morph-toggle{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
.art.morph-toggle:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
@media(pointer:fine){.art.morph-toggle{cursor:pointer}}

/* cumulus-immersive.css */
/* More presence throughout the original Cumulus scroll sequence. */
.cloud.refined .art[data-sculpture="cumulus"] .cloud-sculpture{transform:scale(calc(1.38 + var(--p,0)*.12));transform-origin:50% 50%}
/* The art box follows the SVG (600x480) and shrinks with the viewport height, so the cloud and caption fit the first screen on short laptops. */
.cloud.refined .art[data-sculpture="cumulus"]{width:100%;height:auto;aspect-ratio:5/4;max-height:clamp(260px,calc(100svh - 216px),560px)}
@media(max-width:850px){.cloud.refined .art[data-sculpture="cumulus"]{max-height:clamp(200px,calc(100svh - 150px),408px)}.cloud.refined .art[data-sculpture="cumulus"] .cloud-sculpture{transform:scale(calc(1.3 + var(--p,0)*.08))}}
@media(max-width:480px){.cloud.refined .art[data-sculpture="cumulus"] .cloud-sculpture{transform:scale(1.22)}}

/* Reserve breathing room above enlarged logo in stacked hero. */
@media(max-width:850px){.cloud.refined .hero{row-gap:76px;padding-bottom:64px}}
@media(max-width:480px){.cloud.refined .hero{row-gap:44px;padding-bottom:48px}}
@media(max-width:850px) and (max-height:760px){.cloud.refined .hero{row-gap:44px;padding-bottom:32px}}
@media(max-width:480px) and (max-height:700px){.cloud.refined .hero{row-gap:28px}}

/* brand-system.css */
@font-face{font-family:Inter;src:url('assets/brand/InterVariable.woff2?v=b2087832') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
/* Stand-ins until Inter has loaded: Arial scaled to Inter's width, with Inter's line box (ascender 1984, descender 494
   per 2048), so the swap moves no text. Headings have their own, since Inter is narrower than Arial at display sizes.
   unicode-range is Inter's own coverage, so a character Inter lacks still falls back to plain Arial. */
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('LiberationSans'),local('Arimo'),local('Arimo-Regular');font-weight:100 549;font-style:normal;size-adjust:105.5%;ascent-override:91.82%;descent-override:22.86%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-AC,U+AE-FF,U+178,U+218-219,U+39C,U+2011,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+20AC,U+2190}
@font-face{font-family:'Inter Fallback';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('LiberationSans-Bold'),local('Arimo Bold'),local('Arimo-Bold');font-weight:550 900;font-style:normal;size-adjust:102%;ascent-override:94.98%;descent-override:23.65%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-AC,U+AE-FF,U+178,U+218-219,U+39C,U+2011,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+20AC,U+2190}
@font-face{font-family:'Inter Display Fallback';src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('LiberationSans'),local('Arimo'),local('Arimo-Regular');font-weight:100 549;font-style:normal;size-adjust:99%;ascent-override:97.85%;descent-override:24.36%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-AC,U+AE-FF,U+178,U+218-219,U+39C,U+2011,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+20AC,U+2190}
@font-face{font-family:'Inter Display Fallback';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('LiberationSans-Bold'),local('Arimo Bold'),local('Arimo-Bold');font-weight:550 900;font-style:normal;size-adjust:100%;ascent-override:96.88%;descent-override:24.12%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-AC,U+AE-FF,U+178,U+218-219,U+39C,U+2011,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+20AC,U+2190}
:root{--dke-navy:#0B1F3B;--dke-blue:#2A7FFF;--dke-mid:#7DD3FC;--dke-sky:#EAF6FF;--dke-paper:#F8FCFF;--dke-cyan:#1EB6D9;--dke-deep-cyan:#007EAD;--dke-muted:#607B9B}
body.cloud{--ink:var(--dke-navy);--paper:var(--dke-paper);--hero:var(--dke-sky);--accent:var(--dke-deep-cyan);--soft:var(--dke-sky);font-family:Inter,'Inter Fallback',Arial,sans-serif;font-optical-sizing:auto}
.cloud h1,.cloud h2{font-family:Inter,'Inter Display Fallback',Arial,sans-serif;font-weight:400;letter-spacing:-.03em}.cloud h3{font-weight:650}.cloud .brand-lockup{display:block;width:220px;height:auto;max-width:none}.cloud .header{height:116px}.cloud .footer-brand{width:220px;height:auto;object-fit:contain}
.cloud .cloud-switch{background:var(--dke-sky);border-color:#0B1F3B20}.cloud .cloud-switch a[aria-current=page]{background:var(--dke-navy);border-color:var(--dke-navy)}
.cloud .workflow-labels{font-family:Inter,'Inter Fallback',Arial,sans-serif;fill:var(--dke-navy)}.cloud .art .sculpture-caption{color:var(--dke-deep-cyan)}
.cloud ::selection{background:var(--dke-mid);color:var(--dke-navy)}
/* BAU-16: the logo takes the width the nav leaves, so the contact pill keeps the header's edge on narrow phones */
.cloud .header .brand{flex:0 1 auto;min-width:0}.cloud .header .brand-lockup{min-width:0;max-width:100%;height:auto}.cloud .header .nav{flex:none}
@media(max-width:600px){.cloud .brand-lockup{width:172px}.cloud .header{height:96px;gap:16px}.cloud .nav{font-size:12px}.cloud .footer-brand{width:200px}}
@media(max-width:360px){.cloud .brand-lockup{width:148px}.cloud .header{gap:10px}}

.austrian-flag{display:inline-block;width:24px;height:16px;flex:0 0 24px;border-radius:2px;background:linear-gradient(to bottom,#ed2939 0 33.333%,#fff 33.333% 66.667%,#ed2939 66.667% 100%);box-shadow:0 0 0 1px #0b1f3b10}
.cloud .locale:has(.austrian-flag)::before{display:none}
/* Full-width reference heading, including small phones; it wraps only when it cannot fit (text spacing at 320 px). */
.cloud .proof-head>span{font-size:clamp(11px,2.8vw,14px)}

/* Footer: the ownership line wraps instead of shrinking; footer text stays at 13 px or more. */
.cloud .footer,.cloud .footer-credit,.cloud.refined .company-address,.cloud .footer-links button{font-size:14px}
.cloud .footer-credit{white-space:normal;line-height:1.5}
@media(max-width:600px){.cloud .footer,.cloud .footer-credit,.cloud.refined .company-address,.cloud .footer-links button{font-size:13px}}

/* cloud-caption.css */
.cloud.refined .art .sculpture-caption{line-height:1.35;letter-spacing:0;color:#0b1f3b;display:grid;left:-5%;right:-5%;bottom:0;text-wrap:balance;isolation:isolate}
.sculpture-caption .caption-first,.sculpture-caption .caption-second{grid-area:1/1;display:block;transform-origin:center;will-change:opacity,transform,filter}
.sculpture-caption .caption-first{opacity:calc(1 - var(--caption-blend,0));transform:translateY(calc(var(--caption-blend,0)*-10px)) scale(calc(1 - var(--caption-blend,0)*.025));filter:blur(calc(var(--caption-blend,0)*3px))}
.sculpture-caption .caption-second{opacity:var(--caption-blend,0);transform:translateY(calc((1 - var(--caption-blend,0))*10px)) scale(calc(.975 + var(--caption-blend,0)*.025));filter:blur(calc((1 - var(--caption-blend,0))*3px))}
.caption-accessible{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:600px){.cloud.refined .art .sculpture-caption{left:0;right:0;font-size:24px;bottom:-4px}}
@media(prefers-reduced-motion:reduce){.sculpture-caption .caption-first,.sculpture-caption .caption-second{transform:none;filter:none;will-change:auto}}

/* cloud-lettering.css */
@font-face{font-family:Outfit;src:url('assets/brand/Outfit.woff2?v=7677de6b') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
.cloud.refined .art .sculpture-caption{font-family:Outfit,Inter,sans-serif;font-style:normal;font-weight:350;font-size:clamp(24px,2.3vw,34px)}
.cloud-lettering{display:none;width:100%;height:150px;grid-area:1/1;pointer-events:none}
.has-cloud-lettering .cloud-lettering{display:block}
.has-cloud-lettering .caption-first,.has-cloud-lettering .caption-second{visibility:hidden}
@media(prefers-reduced-motion:reduce){.has-cloud-lettering .cloud-lettering{display:none}.has-cloud-lettering .caption-first,.has-cloud-lettering .caption-second{visibility:visible}}

.cloud.refined .art .sculpture-caption.has-cloud-lettering{bottom:-32px}
@media(max-width:600px){.cloud.refined .art .sculpture-caption.has-cloud-lettering{bottom:-24px}}

/* slogan-selected.css */
/* Hero caption: a quiet two-line line under the art, secondary to the H1. Solid brand colours, no gradient text. From 24px up, #007ead on the sky (4.2:1) counts as large text; the smaller phone caption uses the darker #00698f (5.6:1). */
.cloud.refined .art .sculpture-caption{font-family:Outfit,Inter,sans-serif;font-weight:400;font-style:normal;font-size:clamp(24px,1.8vw,28px);line-height:1.3;letter-spacing:-.01em;top:calc(69% + 34px);bottom:auto;min-height:0;text-align:center}
.sculpture-caption .caption-first,.sculpture-caption .caption-second{align-self:start;filter:none;will-change:opacity,transform}
.sculpture-caption .caption-first{opacity:max(0,calc(1 - var(--caption-blend,0)*2));transform:scale(calc(1 + var(--caption-blend,0)*.04))}
.sculpture-caption .caption-second{opacity:max(0,calc(var(--caption-blend,0)*2 - 1));transform:scale(calc(.96 + var(--caption-blend,0)*.04))}
.sculpture-caption .caption-first>span,.sculpture-caption .caption-second>span{display:block}
.sculpture-caption .slogan-result{color:#007ead}
@media(max-width:850px){.cloud.refined .art .sculpture-caption{top:calc(68% + 28px)}}
@media(max-width:600px){.cloud.refined .art .sculpture-caption{font-size:clamp(18px,4.9vw,20px);top:calc(67% + 18px)}.sculpture-caption .slogan-result{color:#00698f}}
@media(prefers-reduced-motion:reduce){.sculpture-caption .caption-first,.sculpture-caption .caption-second{transform:none;will-change:auto}}