@font-face{font-family:KaplaHeroSans;src:url('/assets/realevate-hero/commons.woff2') format('woff2');font-weight:400;font-display:swap}

/* Full-screen architecture pulls back into an original-photo collage. */
.hero.hero-impact{--scene-height:max(660px,100svh);height:calc(var(--scene-height)*1.95);min-height:0;position:relative;background:#103d85;color:#fff;isolation:isolate}
.hero-impact .collage-frame{position:sticky;top:0;height:var(--scene-height);overflow:hidden;isolation:isolate;background:linear-gradient(125deg,#194fa0 0%,#103d85 45%,#082659 100%)}
.hero-impact .impact-stage{position:absolute;inset:0;perspective:1600px;overflow:hidden}
.hero-impact .impact-world{position:absolute;inset:-2%;transform:rotateX(var(--camera-x,0deg)) rotateY(var(--camera-y,0deg));transform-style:preserve-3d;will-change:transform}
.hero-impact .impact-photo{display:block;position:absolute;cursor:zoom-in;touch-action:pan-y pinch-zoom;-webkit-user-drag:none;outline-offset:6px}
.hero-impact .impact-surface,.hero-impact .impact-float{width:100%;height:100%}
.hero-impact .impact-surface{overflow:hidden;border:1px solid #ffffff45;border-radius:3px;background:#123771;box-shadow:0 16px 70px #03163050;transform-origin:center}
.hero-impact .impact-photo img{width:100%;height:100%;max-width:none;object-fit:cover;filter:none;opacity:1;pointer-events:none;-webkit-user-drag:none}
.hero-impact .impact-main{inset:0;z-index:2;transform:translate3d(var(--main-x,0px),var(--main-y,0px),0) rotate(var(--main-angle,-2deg)) scale(var(--main-scale,.84));will-change:transform}
.hero-impact .impact-main img{object-position:center 47%}
.hero-impact .impact-satellite{left:var(--x);top:var(--y);width:var(--w);height:var(--h);max-height:390px;z-index:1;transform:translate(-50%,-50%) translate3d(var(--travel-x,0px),var(--travel-y,0px),0) rotate(var(--angle));will-change:transform}
.hero-impact .impact-photo:focus-visible{outline:3px solid #fff}
.hero-impact .impact-photo:hover .impact-float,.hero-impact .impact-photo:focus-within .impact-float{animation-play-state:paused}
.hero-impact .impact-satellite:focus-visible{z-index:5}
.hero-impact .impact-shade{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:var(--shade-opacity,1);background:linear-gradient(180deg,#071d4799 0%,transparent 24%,transparent 37%,#071d4773 64%,#071d47e6 100%)}
.hero-impact .impact-copy{position:absolute;left:5.3vw;right:5.3vw;bottom:15%;z-index:4;pointer-events:none;transform:translate3d(0,var(--copy-y,0px),0);opacity:var(--copy-opacity,1);will-change:transform,opacity}
.hero-impact .impact-kicker{font:400 14px/1.3 KaplaHeroSans,Switzer,Arial,sans-serif;letter-spacing:.11em;margin-bottom:25px;color:#e1eaff}
.hero-impact .impact-heading{font:400 clamp(92px,10.4vw,185px)/1.02 Anton,Impact,'Arial Narrow',sans-serif;letter-spacing:-.025em;text-transform:uppercase;margin:0;color:#fff;text-shadow:none}
.hero-impact .impact-line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.hero-impact .impact-line>span{display:block;transform-origin:left bottom}
html[lang="de"] .hero-impact .impact-heading{font-size:clamp(76px,8.7vw,156px)}
html[lang="en"] .hero-impact .impact-heading{font-size:clamp(75px,8.5vw,152px)}
.hero-impact .impact-description{position:absolute;right:0;bottom:10px;max-width:290px;font:400 19px/1.4 KaplaHeroSans,Switzer,Arial,sans-serif;letter-spacing:-.01em;color:#edf3ff;text-shadow:none}
.hero-impact .impact-bottom{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom,0px));left:5.3vw;right:5.3vw;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:22px}
.hero-impact .impact-discover{display:flex;align-items:center;gap:24px;min-height:44px;font:400 14px/1.3 KaplaHeroSans,Switzer,Arial,sans-serif;letter-spacing:.06em;color:#fff}
.hero-impact .impact-scroll-line{display:block;position:relative;width:110px;height:1px;overflow:hidden;background:#ffffff45}
.hero-impact .impact-scroll-line i{position:absolute;inset:0 auto 0 0;width:40%;height:1px;background:#fff;animation:impact-scroll 2.8s ease-in-out infinite}
.hero-impact .impact-location{font:400 14px/1.4 KaplaHeroSans,Switzer,Arial,sans-serif;color:#e1eaff;margin-left:auto}
.hero-impact .impact-motion{flex:0 0 44px;display:grid;place-items:center;width:44px;height:44px;padding:0;background:#08265955;border:1px solid #ffffff70;border-radius:50%;color:#fff}
.hero-impact .impact-motion:hover{background:#ffffff1a}
.hero-impact .impact-motion>span{display:block;width:10px;height:13px;border-left:3px solid;border-right:3px solid}
.hero-impact.is-paused .impact-motion>span{width:0;height:0;border:0;border-left:10px solid;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
.hero-impact.impact-entering .impact-main .impact-surface{animation:impact-reveal 1.8s cubic-bezier(.16,1,.3,1) both}
.hero-impact.impact-entering .impact-satellite .impact-surface{animation:impact-arrive 1.35s cubic-bezier(.16,1,.3,1) var(--delay) both}
.hero-impact.impact-entering .impact-line>span{animation:impact-words 1.1s cubic-bezier(.16,1,.3,1) .35s both}
.hero-impact.impact-entering .impact-line:nth-child(2)>span{animation-delay:.5s}
.hero-impact.impact-entered .impact-float{animation:impact-float 7s ease-in-out var(--float-delay) infinite alternate}
.hero-impact.is-paused *,.hero-impact.is-resting *{animation-play-state:paused!important}
.hero-impact.is-resting .impact-world,.hero-impact.is-resting .impact-main,.hero-impact.is-resting .impact-satellite,.hero-impact.is-resting .impact-copy{will-change:auto}
@keyframes impact-reveal{from{transform:scale(1.21) rotate(2deg)}to{transform:scale(1) rotate(0)}}
@keyframes impact-arrive{from{opacity:0;transform:translate3d(0,22svh,0) rotate(-12deg) scale(.75)}to{opacity:1;transform:none}}
@keyframes impact-words{from{transform:translateY(112%) rotate(3deg)}to{transform:none}}
@keyframes impact-float{from{transform:translateY(-6px)}to{transform:translateY(6px)}}
@keyframes impact-scroll{from{transform:translateX(-120%)}to{transform:translateX(360%)}}
@media(max-width:1150px){.hero-impact .impact-description{position:static;margin-top:25px;max-width:400px;font-size:18px}.hero-impact .impact-copy{bottom:17%}.hero-impact .impact-heading{font-size:10.7vw}html[lang="de"] .hero-impact .impact-heading{font-size:9.1vw}html[lang="en"] .hero-impact .impact-heading{font-size:8.9vw}}
@media(max-width:850px){
 .hero.hero-impact{--scene-height:max(600px,100svh);height:calc(var(--scene-height)*1.7)}
 .hero-impact .impact-stage{perspective:1000px}
 .hero-impact .impact-main{transform:translate3d(var(--main-x,0px),var(--main-y,0px),0) rotate(var(--main-angle,-2deg)) scale(var(--main-scale,.94))}
 .hero-impact .impact-main img{object-position:59% center}
 .hero-impact .satellite-1{left:11%;top:19%;width:47vw;height:24svh}
 .hero-impact .satellite-2{left:91%;top:30%;width:38vw;height:26svh}
 .hero-impact .satellite-5{left:10%;top:82%;width:46vw;height:23svh}
 .hero-impact .satellite-6{left:92%;top:91%;width:51vw;height:22svh}
 .hero-impact .satellite-3,.hero-impact .satellite-4,.hero-impact .satellite-7,.hero-impact .satellite-8{display:none}
 .hero-impact .impact-copy{left:6vw;right:6vw;bottom:17%}
 .hero-impact .impact-kicker{font-size:12px;letter-spacing:.07em;margin-bottom:20px}
 .hero-impact .impact-heading{font-size:clamp(60px,18.3vw,132px)}
 html[lang="de"] .hero-impact .impact-heading{font-size:clamp(42px,12.6vw,96px)}
 html[lang="en"] .hero-impact .impact-heading{font-size:clamp(40px,12.3vw,93px)}
 .hero-impact .impact-description{font-size:16px;line-height:1.4;max-width:300px;margin-top:20px}
 .hero-impact .impact-shade{background:linear-gradient(180deg,#071d4780,transparent 26%,#071d4733 41%,#071d47b3 73%,#071d47eb)}
 .hero-impact .impact-bottom{left:6vw;right:6vw;bottom:calc(24px + env(safe-area-inset-bottom,0px));gap:16px}
 .hero-impact .impact-discover{font-size:12px;gap:14px}
 .hero-impact .impact-scroll-line{width:45px}
 .hero-impact .impact-location{display:none}
}
@media(max-height:620px) and (min-width:851px){.hero-impact .impact-heading{font-size:95px}html[lang="de"] .hero-impact .impact-heading,html[lang="en"] .hero-impact .impact-heading{font-size:78px}.hero-impact .impact-description{position:absolute;right:0;bottom:0;max-width:280px}}
@media(prefers-reduced-motion:reduce){
 .hero.hero-impact{height:var(--scene-height)}
 .hero-impact .collage-frame{position:relative}
 .hero-impact *{animation:none!important}
 .hero-impact .impact-motion{display:none}
 .hero-impact .impact-world{transform:none;will-change:auto}
 .hero-impact .impact-copy{transform:none;opacity:1;will-change:auto}
}